qt - Nested MouseArea hover -
i'm having issues nested mousearea
s. when click red rectangle
triggers exited
event on top rectangle
(for me @ least). intended behavior? if so, there workaround?
edit
clarification
want able keep hover top rectangle
while clicking child rectangle
(the top rectangle
should stay blue
). useful if want hide , unhide buttons etc. on hover, common practice in web interfaces (html/css). doing causes weird effects clicking buttons has been revealed entered
signal disappear when click them.
edit
i made javascript demonstration wanted behavior: https://jsfiddle.net/uo4vousu/ if click red rectangle parent stays blue, want. in qml example parent becomes green. updated qml code mach jsfiddle.
edit
it might linux problem.
here's example:
rectangle { id: top width: 100 height: 32 anchors.centerin: parent color: "green" mousearea { anchors.fill: parent hoverenabled: true onexited: top.color = "green" onentered: top.color = "blue" rectangle { id: child width: 16 height: 16 anchors.centerin: parent color: "red" mousearea { anchors.fill: parent onpressed: child.color="gray" onreleased: child.color="red" } } } }
the easy way:
rectangle { id: top width: 100 height: 32 anchors.centerin: parent color: "green" mousearea { anchors.fill: parent hoverenabled: true onexited: top.color = "green" onentered: top.color = "blue" rectangle { width: 16 height: 16 anchors.centerin: parent color: "red" mousearea { anchors.fill: parent hoverenabled: true onexited: top.color = "blue" onentered: top.color = "green" onclicked: console.log("clicked") } } } }
you can use math,
rectangle { id: top width: 100 height: 32 anchors.centerin: parent signal sgnenteredzone() color: "green" onsgnenteredzone: { top.color = "blue" } mousearea { anchors.fill: parent hoverenabled: true onmousexchanged:{ if( (mousex <inrect.x ||mousex>inrect.width + inrect.x ) && (mousey <inrect.y ||mousey>inrect.height + inrect.y) ) sgnenteredzone() else top.color = "green" } onmouseychanged:{ if( (mousex <inrect.x ||mousex>inrect.width + inrect.x ) && (mousey <inrect.y ||mousey>inrect.height + inrect.y) ) sgnenteredzone() else top.color = "green" } rectangle { id:inrect width: 16 height: 16 anchors.centerin: parent color: "red" mousearea { anchors.fill: parent onclicked: console.log("clicked") } } } }
Comments
Post a Comment