Qt/PySide: Linking the hover-highlight state of two widgets - qt

I need a function that takes two Qt widgets and "links" them such that no matter which one the mouse is hovering over, they both get highlighted with their (standard) hover highlighting (if they have such).
This needs to work with whatever kinds of widgets the caller passes to this function; this function can't require callers to create widget subclasses just to make this work.
Here are some images of what I'm referring to:
Normally, when you hover the cursor over a widget, it gets highlighted as shown in Images 1 and 2. I need an example of how to set things up so that regardless of which widget the mouse is hovering over, they BOTH get highlighted with their standard hover highlighting, as shown in Image 3. Ideally, this function would work generically, only operating on its arguments as QWidgets, regardless of what kind of widgets they actually are (because hover highlighting is a generic Qt behavior, after all).
def link_highlighting(widgetA, widgetB):
... what should go here? ...
This feels like it would involve some pretty dark event hackery, but my event hacking fu is not strong.
Ideas? Suggestions?

I did a bit of research and I see two ways this can be done right now in a generic way.
The first part is detecting the hover action. This should be easy. Just subscribe to the enterEvent and leaveEnvent of both widgets. As long as they are of type QWidget this will work. With that you will be notified when the mouse enter or leaves a widget.
Then the highlighting part. Here you have two options:
You can fake a mouse event on the second widget, basically emulating a second mouse enterEvent. This can be done with qApp.sendEvent(widget, event).
You can change the palette of the second widget. Basically to set the normal palette to the highlighted palette. Here you would use functions like:
palette = widget.getPalette()
palette.setColor(QPalette.Base, widget.palette().color(QPalette.Highlight))
widget.setPalette(palette)
This obviously needs some experimenting. And for now this only works for widget styles that work with paletters. For the ones that work with CSS one would need to basically do the same. Find the bit that applies to highlight and copy it over to the normal state.
Depending on how general your case is, this could be really easy or very hard.
Let me know how this goes.

Related

JavaFX disable TextArea scrolling

I have been trying to disable scroll bars in a text area using the code:
ScrollBar scrollBarv = (ScrollBar)textArea.lookup(".scroll-bar:vertical");
scrollBarv.setDisable(true);
But all I get is a null pointer for "scrollBarv". What am I missing?
You can't disable a scroll bar in a text area via lookups like you are trying to do.
A lookup is CSS based, which usually means it will only work after a CSS application pass has been applied. Generally, for a lookup to work as expected, a layout pass also needs to be applied on the parent node or scene. The logic in the JavaFX layout handlers for complex nodes such as controls may modify the CSS and nodes for the controls.
To understand how to apply CSS and perform a layout pass, read the relevant applyCss() documentation.
So you could do this:
textArea.applyCss();
textArea.layout();
ScrollBar scrollBarv = (ScrollBar)textArea.lookup(".scroll-bar:vertical");
scrollBarv.setDisable(true);
But even then, it would not do what you want. Because it is just a one-time call. If the user types new text into an empty TextArea until it fills the area, then a scroll bar will show up, and if the user deletes text in the text area, the scroll bar will be removed. And the new scroll bar which shows up wouldn't be found when you did your lookup because it would not have existed at that time.
Generally, the preferred alternative to performing lookups to nodes is to apply CSS style classes with the style class defining the desired attributes of the node regardless of the state it is in (and using psuedo-classes if state based CSS definitions are required). However, that probably won't work in this case as I can't see a definition for a disable attribute in the JavaFX CSS reference guide. Perhaps you might manage what you need via the visibility property, though that is unlikely as visibility is a bit different from disable.
The behavior for controlling the scroll bars is internally coded in the TextAreaSkin (which in Java 8 is not part of the public JavaFX API). You could copy or subclass the TextAreaSkin to customize its behavior and then attach your customized skin to your node. This is really the "proper" way to customize internal control behavior in the way in which you wish. A discussion of the detailed steps to achieve this is outside the scope of this answer.
But, in the end, I'm not sure how useful the behavior you desire is. Rather than disabling the vertical scroll bar, you could just disable the entire TextArea, which would be fine for most similar use-cases. Though, perhaps your use-case is different somehow in requiring only the vertical scroll bar to be disabled.

draw qt widget bigger as the mouse hovers over it (overlapping of widgets)

I would like to create a simple effect with my qt gui, but i have no idea how to achieve this.
I have several widgets, that i implemented as subclasses of qwidget. These are part of another widget and live in a layout. When the mouse hovers over these widgets, i want them to appear bigger to highlight the selected one.
This is what i already tried:
Override the paint event, and simply paint it bigger. But then, the other widgets that also live in the same layout overpaint the oversized areas.
I also tried to call the paint function "by hand" from the parent window, to get control over the painting order. But that didnt help either.
I think there has to be a possibility achieving this effect this qt, but i simply dont know how.
Any ideas?
You could either:
create your GUI inside a QGraphicsView, with QGraphicsWidgets and use setScale when the mouse enters or leave the widget, or
use QML.

should I use Navigator or View State?

Hi I want to create an application has this sort of function:
http://looklet.com/create
In this application when you click the button (or some tilelist) on the right the model on the left update accordingly. I wonder how they achieve this. Originally i think it's some sort of image-only pop-up window but then pop-up window seems to update the entire view.
Then I think it might be only change view state, but then I still confused how it can be done using view state.
Flex expert please give me some hint !
Looks like transparent images drawn on Canvas. Each piece must have predefined offset and draw order.
Probably just images placed on one or more Canvas, with the z-order controlled for depth.
The body stays the same, so shirts probably have their own placement properties, as do skirts, underwear, hosiery, etc. as well as backgrounds, faces, etc.

Advanced Flex custom components for working with graphics and text

I'm looking for a new, modern components with enhanced functionality for working with graphics and text.
For example by mouse over to the text appears a icon click on that appears a panel into which you can change the font, font size, font color, letter-range, etc.
With graphics by pointing resizing handles appear, rotation, reflection, etc.
It sounds like you want to create a custom tooltip, that has the options to change/edit the appearance of the UIComponent that was hovered over. This is a tricky mofo of a component to make. I made a custom tooltip based on a Canvas, that has an item renderer associated with it. If your in earnest, I could probably put together a usable example and post it (on my blog or something).
If you hover over a component, a regular toolip appears, but when you hover over the tooltip, it expands out to a custom tooltip. I used Timer objects with event listeners added.
After that, you'll need to do all the transform stuff. Probably out of the scope of a single StackOverflow question to be honest.

Moving a Flex GUI window confused by underlying Papervision3D viewport

I'm developing a Flex 2 application, and I noticed that part of the library which is responsible for moving GUI windows (TitleWindows) around when you drag them with the mouse gets confused if there is a clickable (buttonMode = true) sprite beneath them. When I say confused, I mean that the window is moved around normally for a while, but then at some point "jumps" into the upper left corner of the flash app, and makes very minor movement there. Then at some other point it jumps back. It is more difficult to explain than to experience, so please go and see for yourself. Here's how to reproduce the problem:
Go to http://www.panocast.com
In the left sidebar, choose "Real Estate"
Just below the bottom right corner of the flash window, choose "high res" by clicking on the rightmost icon.
When (part of) the video loads, click on the staircase. A TitleWindow will pop up.
Try dragging it around the screen. When the mouse cursor is moved above one of the clickable areas (like the staircase), the window is misplaced.
(Sorry, but can't give you a direct link, part of the page is generated dynamically.)
(What's makes the problem even more interesting is that for me, in "low res" mode, the problem does not occur! There is very little difference between the various modes.) I would really appreciate if someone told me what was going on here and how it can be fixed.
I'm not sure if it matters, but the underlying sprite is actually not just plain sprite, rather it is a Papervision3D renderer object with some 3D elements in it. I'm telling this because it is possible that the incorrect mouse coordinates somehow come from the texture UV mapped on the clickable objects.
I've managed to replicate this on the low res mode as well, so I don't think it's related to the resolution.
This looks to be because the MouseEvent is being handled by the TitleWindow AND the Papervision3D window. Perhaps you need to force stopImmediatePropagation() on one or the other? Or maybe switch off the MouseEvent handling for the Pv3D window when the TitleWindow pops up?
That's a tough one to debug without some source; something's apparently calling either move() or setting x and y properties on that TitleWindow and scheduling it be moved.
When I first read the post, it "smelled" like maybe a rotation miscalculation somewhere (using Math.atan vs. Math.atan2 can sometimes have that kind of effect), so you're right, it could have something to do with PaperVision, assuming you're not using Math.atan or setting rotation properties yourself anywhere. Just thought I'd mention it, though it's probably not happening in your case. You never know, though. ;)
More likely the LayoutManager is moving the component in response to a property change on the component. The Flex docs explain that in addition to setting its x and y properties, and explicit calls to move(), a UIComponent's move event can also be triggered when any of the following other properties change:
minWidth
minHeight
maxWidth
maxHeight
explicitWidth
explicitHeight
PaperVision or no, maybe that info might help you isolate the source of the move. Good luck.
I got this figured out. Apparently, this is a Papervision3D problem. There is a class deep inside Papervision3D called VirtualMouse, which is supposed to generate MouseEvents programmatically. This happens, for example, when the user interacts with any of the interactive objects on stage, e.g., a Plane with an interactive material on it (as in my case).
The problem is that the x and y coordinates of the generated event represent texture UV coordinates (just as I suspected) and not real world screen coordinates. When a TitleWindow (or any Panel object) is dragged, a "mouseMove" handler (among others) is added to the SystemManager, which then uses the stageX and stageY properties of the event object to determine the new position of the window. Unfortunately for VirtualMouse's mouse events, these are invalid, since the original x,y coordinates, which are probably used to determine the global stage coordinates are, as I said, not screen coordinates.
Honestly, I'm still unsure whether the events dispatched by VirtualMouse are used anywhere within Papervision3D itself, or they are just offered for convenience, but they sure make it difficult to integrate a viewport into a Flex program. Assuming that such events aren't necessary for PV3D itself, there is a one-liner fix for my problem, which must be added right after the creation of the viewport:
viewport.interactiveSceneManager.virtualMouse.
disableEvent(MouseEvent.MOUSE_MOVE);
BTW., there was a very similar (or rather, as it turns out, the same) bug with dragging sliders, also fixed by this line.

Resources