Details
-
Bug
-
Resolution: Done
-
P3: Somewhat important
-
4.7.1
-
None
-
QML
-
cebf68dd65d484e5da25ec6244f865b737778011
Description
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- QML BUG - input mechanism didn't have that as a choice **********************
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
The problem we have is that we have some UI elements with buttons inside them (in our final implementation they are only visible when the parent is highlighted see example 2). When the user hovers the parent element, we have a highlighting effect (but we do NOT want the parent highlighting to be removed). If the user passes his or her mouse over the buttons inside this parent element, then we would like to indicate to the user that the buttons are clickable - by highlighting them. The way to highlight them is, of course, to declare a mouseArea on the child and to listen to the onEnteredEvent (see example below).
If we do the above these are the events are fired in a completely non-sensible way...
e.g.
- Parent Element alone: onEnter, onExited: OK
- Parent Element with always visible child (example 1): onEnter fired on parent, onExited fired on parent (unclear why... and causes us problems) when hovering the child, which gets an onEnter event. When leaving the child the expected event (onExited) is fired, but then we receive the onEnter event for the parent (which we never really left.)
- Parent element with child that is visible only when the parent is highlighted (example 2): Completely screwed! The parent element is left (onExited), so unhighlighted, but somehow the onEnter event is still fired on the child, which you would expect to no longer be visible, because of the strange behaviour in the above example, however, we are back in the parent, thus causing the parent to rehighlight (onEnter) and the button to reappear, which give another onExited event... this continues. If you stop moving the mouse, it does sometimes stop misbehaving.
Please let us know if this is going to get fixed, as it is critical for our use cases and could well influence our future decisions regarding use of Qt/QML on other platforms.
Examlpe 1 script:
Rectangle { id: wrapper property bool isHovered: false color: isHovered ? "red" : "blue" width : 200 height: 100 MouseArea { hoverEnabled: true anchors.fill: parent onEntered: { wrapper.isHovered = true } onExited: { wrapper.isHovered = false } } Rectangle { id: button property bool isHovered: false color: isHovered ? "green" : "yellow" width : 50 height: 50 anchors.centerIn: parent MouseArea { hoverEnabled: true anchors.fill: parent onEntered: { button.isHovered = true } onExited: { button.isHovered = false } } } }
Example 2 script:
Rectangle { id: wrapper property bool isHovered: false color: isHovered ? "red" : "blue" width : 200 height: 100 MouseArea { hoverEnabled: true anchors.fill: parent onEntered: { print ("WRAPPER - onEntered") wrapper.isHovered = true } onExited: { print ("WRAPPER- onExited") wrapper.isHovered = false } } Rectangle { id: button property bool isHovered: false color: isHovered ? "green" : "yellow" width : 50 height: 50 anchors.centerIn: parent visible: wrapper.isHovered MouseArea { hoverEnabled: true anchors.fill: parent onEntered: { print ("BUTTON - onEntered") button.isHovered = true } onExited: { print ("BUTTON - onExited") button.isHovered = false } } } }