folks!
I use a listview (Icon mode) to display items which consist of an image and a label.
As you can see in the shots the row height is variable on y depending on the label length. The problem is that I want the complete labels to be drawn, but they are automatically shrinked into two lines:
The strange thing about it is that once you select an item the whole label will be shown:
This is also the case when deselecting the item, but when another item gets selected, only that one will be shown completely.
Is there a way (without drawing the text manually) to avoid truncation in my case?
If some code is needed to answer this question, don't hesitate to ask.
Greetings,
Satara
I'm guessing this was a design choice: make things look less cluttered. E.g. picture your desktop with all labels shown completely... will look messy in my case.
However, you can fix this by drawing the label yourself. Have a look into custom draw which is a service provided by the list control. The thing is that it's usually an all or nothing approach, so this will likely require you to draw everything yourself: border, image, label, etc. The other option is to get hacky: subclass the window and draw the labels again after Windows did in response to several messages (unfortunately Windows does not restrict the painting to WM_PAINT, an optimization that is a left-over from the old days...)
Related
I wanted to wrap the existing text of checkbox into multiline if the width of row exceeds the width of its parent window. I am not really sure how to do that.
The image I want to show the checkbox string
The image where the string is cropped and only shows if window is resized or maximized
You are going to have a problem with this I am afraid.
The setting for making a checkbox multiline is ES_MULTILINE and if you look here you will see that it states:
To create an edit control using the CreateWindow or CreateWindowEx function, specify the EDIT class, appropriate window style constants, and a combination of the following edit control styles. After the control has been created, these styles cannot be modified, except as noted.
So, it would seem to me that you have three ways forward, depending on what you feel is the best or most elegant for you.
Set your control in the resource editor as multiline anyway. Then it doesn't matter and will wrap. No need to have to change the setting.
Implement the needed functionality to limit the size the window can be reduced to. I can show you how if you are interested. This way, if you set the control resize properties correctly it can resize larger but only reduce down the a known dimension (ie: the dimensions you created it in the resource editor).
Possibly have two controls in the same place, one as multiline and one as single. And when you decide which you want to show, swap the visibility. But I think this is a bad idea, bit of a headache, and not worth the hassle.
IMHO I would do both ideas 1 and 2 and I would happily extend my answer to provide more information.
Update
Having looked at your images and the comments about translations then there is a fourth idea. If you use a third party application to manage the translations and use satellite DLL files then you can adjust the resources on a language by language basis. I sometimes have to make the default width for some windows wider due to their verbose nature.
I have set BS_MULTILINE for the checkbox. The minimum size of the window is fixed but I just want the checkbox to fit in that. I expect it to show at least one word in the same line as other labels and remaining words in second line. So I am checking if the total width of the first row is greater than the width of window then show the string with \r\n in it else show normal string. However, I want to align first line or the first word of the checkbox with the checkbox and remaining words should come below the first word. Currently, the checkbox is in between two lines which looks weird. Is there anyway I can do this?
I am writing an application in C++ using WinAPI.
I have a ListView of items with checkboxes and a scrollbar. Sometimes I need to disable the whole thing. When I call EnableWindow() to do that, the behavior of ListView is ok. It gets disabled, none of the contents are accessible any more. However checkboxes and scrollbar still look normal (not grayed out as the rest of the element).
Is it possible to grey out all parts within the ListView?
Enabled
Disabled
Normal disabled checkbox looks liks this: <- this is how I would expect to see checkboxes in the ListView, same applies to the scrollbar.
Regarding the checkboxes, the documentation for LVS_EX_CHECKBOXES says:
When set to this style, the control creates and sets a state image list with two images using DrawFrameControl. State image 1 is the unchecked box, and state image 2 is the checked box. Setting the state image to zero removes the check box.
You can therefore just change those images at indices 1 and 2 in the image list to their properly disabled variants when you are disabling the whole control.
The process itself of course varies depending on the framework you are using (if any), but generally will be along the lines of creating an Image List of SM_CXSMICON×SM_CYSMICON icons, creating a bitmap (2*SM_CXSMICON × SM_CYSMICON) pixels big, selecting it into a Memory DC for drawing, calling DrawFrameControl(..., DFC_BUTTON, DFCS_BUTTONCHECK | DFCS_FLAT | ..., ...) twice as appropriate, then using that bitmap in the Image List (and saving the previous IL to restore when the window is enabled again).
Regarding the scroll bar, you cannot get access to the implicit scrollbar as a separate window, so I don't think you can easily make it look more disabled without resorting to more custom drawing hacks for the non-client area of the List View.
Or creating an explicit scroll bar control yourself, but then you need to make sure it behaves the same as the original one, changes when the list view items change, respects right-to-left locale and so on.
It might be a bit of a challenge to get all the offsets and possibly transparency right even for the custom checkbox images described above. Even though this is how the List View control itself does it, it might not be worth the effort in the end.
I'm making my own UI from scratch using OpenGL that is why I'm asking this and please don't make any discouragement as this is just a hobby project.
Currently, I'm stuck implementing how this scrollbars really work. In my current implementation, the content scrolls at the wrong step value as well as the thumb, meaning, I set the value manually like 1px step for each of them.
The structure of my scrollbar implementation is describe as follows:
I draw scrollbars i.e the main rectangle where the 3 button lies.
Those 3 buttons are, thumb, buttonBack and buttonNext.
All of them do the basic logic of scrollbars i.e when I click each one of them, they moved. But the whole part(scrollbar) don't know how to scroll contents
So what I did is: I make another object and I call it scrollarea
It has two scrollbars, vertical and horizontal scrollbar.
I made a function called scrollToX and scrollToY which
does what I named to them.
But the step values I set to them are
manually set up.
I try to google some scrollbar, scrollarea, scrollview or whatever you call to that scrollable rectangle thing, but all I see are implementation and I cannot find any guides how to build your own. I have no choice but to look at their implementation. I try my best to comprehend what they did but their implementation of how their whole UI structure is very different to mine, and I cannot find anything useful there.
So I ask again here if anybody can explain me well how to make a properly functional scrollbar.
Most specific things I'm really concerned of are:
How do I determine the thumb step value?
How do I determine the content step value?
All of these depend on your content -
Is it just an image ? If so, you only need to change the offset depending on the size of the image.
Is it a list of values like in Windows explorer ? Then you need to create a data structure first that contains all of it, and shows the content that fits within the window as it scrolls.
OpenGL does not fit into this discussion.
I have to design a GUI using Qt. I would like to draw multiple lines depicting relationships between two objects. It's the same idea as matching a word with a definition by drawing a straight line (which might be a diagonal) between the two.
In my case it is an a label (with image inside of it) that needs to be matched with another label.
So we have something like this - http://dl.dropbox.com/u/46437808/DrawLines.png
And I want to add lines to make it look something like this http://dl.dropbox.com/u/46437808/DrawLines2.png
I need to do this in run time because the relationship will be changing based on different factors.
Thanks!
Do you need interaction or is this just an image that the user needs to see based on other information? If it's just a static image, I would simply draw it onto a QImage and show it. That way you have complete control over how things are drawn. So you can either cache the relationship diagrams you need ahead of time, or just draw them on the fly onto the QImage based on the relationship that needs to be displayed at the time. You can look at Qt's painting example for some ideas on how to accomplish what you need.
If you need interactivity, I would probably go with the Graphics View Framework. This way if you need push buttons, check boxes, etc. for any reason you can use the QGraphicsProxyWidget to get them, or you can just make your own from QGraphicsItem subclasses.
I'm having all sorts of size problems with Qt. I am creating my own widgets and using different layouts (generally, I need my own to make them work properly without spending hours on the "powerful" default layouts... which don't lay things out as intended.)
Once I'm done with a widget and its layout though, it doesn't work right. The size is never getting set properly unless I call widget->resize(1, 1); which finally forces a "resize" and makes the widget look correct (i.e. recompute the geometry.) Even the updateGeometry() call has no effect.
This is a dreadful problem when the resize() needs to be called on the parent widget (yuck!) and from what I'm reading should not be necessary were the layouts properly programmed.
Is there a sample that works and is not several thousand of lines long, or does Qt require several thousand lines to make anything work perfectly, even the simplest widget?
What are the minimal functions to be called to make a widget & its layout work at once?
Thank you.
Alexis
P.S. I tried to implement the sizeHint(), minimumSize(), maximumSize(), others that I'm missing? I was hoping that would be enough. Obviously, I also implement the setGeometry() on the layout to resize the children appropriately.
--- addition 1
There is a sample image with a layout that clearly isn't available as is in Qt. The positioning, functions, and colors of the different keys is XML driven and works for any keyboard in the world.
(note, this sample doesn't show the Enter key displayed on two rows and wider below than at the top; more or less, not doable at all with the regular layouts; of course, it works with my version.)
--- clarification
I'm not too sure how to describe the problem better. I was thinking to write a test widget next to see how I can reproduce the problem and then post that and eventually fix it. 8-)
The default layout function that the internal Qt layouts make use of require a lot of coding. I would like to avoid having to copy/paste all of that because for maintenance, it makes it close to impossible.
--- today's findings
As I needed to tweak one of the widgets, I decided to add a VBoxLayout and make it work.
I actually found the problem... One of the widgets in my tree is a QScrollArea and that sizeHint() returns (-1, -1). Not exactly what I'd expect but... whatever you put inside that widget has better know how to compute its width and height or else... it fails.
Looking at the code closely, I could actually compute the width by using the widest width found. Once I used that, the widget would appear (and it actually resizes itself as things change in the list, kinda cool.)
This being said, my earlier comment about having a tree of widgets that auto-resize themselves stands. From the root up to the parents of the leaves in your tree, all of those widgets will need a valid layout. Once I added one in the top widget it resized itself and its children properly (well... in my case up to the QScrollArea, the rest required a bottom to top resizing. Funny how that works!)
--- ah! ha! moment (or: what you find reading the implementation code!)
Today I bumped in another problem which just needed the correct call... I just couldn't find anything worth it in the documentation.
All the objects have a layout now, but a certain parent would not resize properly. Plain simple.
I had a call to the parent as following:
// changes to the children are changing the geometry
parentWidget()->updateGeometry();
Yeah. The docs says that's what you have to do. Nothing happens at all with that call. No idea what it's supposed to do, I did not look at that function. It never did anything for me anyway.
So... I looked at the layout to try to understand how it would send the info up/down. I did not see much except for one interesting comment:
// will trigger resize
This is said of the SetFixedSize mode. To reach that function you need to make the layout for update. Ah! Yes... the layout, not the parent widget... let's try that instead:
parentWidget()->layout()->update();
And voila! It resizes correctly in all cases I have. Quite incredible that the widget updateGeometry() doesn't trigger the same effect...
Although it's possible to do what you want it sounds like the problems you are having are because you're using Qt in a way that it's not meant to be used. Why do you need separate widgets for each key represented on the keyboard?
I see two options, both of which are better in some way:
Use QGraphicsScene and QGraphicsView.
A single custom widget that uses custom drawing to display the keyboard (and likely uses hover for hints).
The first option is probably better. Your keys could then be represented by QGraphicsSimpleTextItem's or even a QGraphicsSvgItem. It also provides a number of standard layouts or you could choose to write your own layout. By default you can use the keyPressEvent or mouseReleaseEvent to respond to user interactions.
I'd highly recommend you take a look at the QGraphicsView examples to get an idea what you can do.
If you go the second route you'll need to record the different key locations so you can respond accordingly as the user moves the mouse around, clicks, etc.
This won't help you with your immediate issue but I wanted to show you a keyboard I made using standard layouts and buttons. It's not perfect and it still won't help you with an enter key that spans two rows but it's not bad. It's resizable too by resizing the window, although I'm not sure if that will be apparent from the images below as SO may be scaling them. (you can view the actual images by opening them in their own tab)
Anyway, this was done using only Qt Designer with no manual coding. It consists of a top level vertical layout with 5 horizontal layouts in it. The buttons are then inserted into one of the 5 horizontal layouts. The size of the keys can be controlled by setting the horizontal and vertical size policies to "ignored" for most of the buttons and then horizontal "minimum" for buttons that you want to be wider. Things can be tweaked by setting min and max size restrictions to buttons. When resized, the buttons will not maintain their relative proportions though, that would probably take some custom programming.
The styling in your example could be approximated pretty well using css style sheets and background images. Still not a minor effort but you should be able to get most of the way there without custom layouts and buttons.