Public bug reported:
When I open a Popover, I expect it to be on top of all other Items. This
is not the case if any Item has a z-value > 0, the Popover will then
open behind that Item, potentially hiding the Popover.
Use the example code below to reproduce the issue. Run the qml code and
click the button at the bottom to open the popover behind the blue
rectangle.
Note that also the MouseArea in the blue rectangle eats the events of
the Popover's InverseMouseArea that is used to close the popover. So if
there is a MouseArea in an Item with z>1, this area cannot be clicked to
close the Popover.
import QtQuick 2.4
import Ubuntu.Components 1.3
import Ubuntu.Components.Popups 1.3
Item {
width: 600
height: 600
Rectangle {
anchors.centerIn: parent
color: "blue"
width: 400
height: 400
opacity: 0.8
z: 1
MouseArea { anchors.fill: parent }
}
Rectangle {
anchors {
right: parent.right
verticalCenter: parent.verticalCenter
}
width: 300
height: 300
color: "yellow"
}
Button {
id: button
anchors {
bottom: parent.bottom
horizontalCenter: parent.horizontalCenter
margins: 30
}
text: "Pop!"
onClicked: PopupUtils.open(popoverComponent, button)
Component {
id: popoverComponent
Popover {
Rectangle {
color: "green"
width: parent.width
height: 300
}
}
}
}
}
** Affects: ubuntu-ui-toolkit (Ubuntu)
Importance: High
Status: New
** Project changed: oxide => ubuntu-ui-toolkit (Ubuntu)
** Changed in: ubuntu-ui-toolkit (Ubuntu)
Importance: Undecided => High
** Description changed:
When I open a Popover, I expect it to be on top of all other Items. This
is not the case if any Item has a z-value > 0, the Popover will then
open behind that Item, potentially hiding the Popover.
Use the example code below to reproduce the issue. Run the qml code and
click the button at the bottom to open the popover behind the blue
rectangle.
import QtQuick 2.4
import Ubuntu.Components 1.3
import Ubuntu.Components.Popups 1.3
Item {
- width: 600
- height: 600
+ width: 600
+ height: 600
- Rectangle {
- anchors.centerIn: parent
- color: "blue"
- width: 400
- height: 400
- opacity: 0.8
- z: 1
- }
- Rectangle {
- anchors {
- right: parent.right
- verticalCenter: parent.verticalCenter
- }
- width: 300
- height: 300
- color: "yellow"
- }
+ Rectangle {
+ anchors.centerIn: parent
+ color: "blue"
+ width: 400
+ height: 400
+ opacity: 0.8
+ z: 1
+ MouseArea { anchors.fill: parent }
+ }
+ Rectangle {
+ anchors {
+ right: parent.right
+ verticalCenter: parent.verticalCenter
+ }
+ width: 300
+ height: 300
+ color: "yellow"
+ }
- Button {
- id: button
- anchors {
- bottom: parent.bottom
- horizontalCenter: parent.horizontalCenter
- margins: 30
- }
- text: "Pop!"
- onClicked: PopupUtils.open(popoverComponent, button)
+ Button {
+ id: button
+ anchors {
+ bottom: parent.bottom
+ horizontalCenter: parent.horizontalCenter
+ margins: 30
+ }
+ text: "Pop!"
+ onClicked: PopupUtils.open(popoverComponent, button)
- Component {
- id: popoverComponent
+ Component {
+ id: popoverComponent
- Popover {
- Rectangle {
- color: "green"
- width: parent.width
- height: 300
- }
- }
- }
- }
+ Popover {
+ Rectangle {
+ color: "green"
+ width: parent.width
+ height: 300
+ }
+ }
+ }
+ }
}
** Description changed:
When I open a Popover, I expect it to be on top of all other Items. This
is not the case if any Item has a z-value > 0, the Popover will then
open behind that Item, potentially hiding the Popover.
Use the example code below to reproduce the issue. Run the qml code and
click the button at the bottom to open the popover behind the blue
rectangle.
+
+ Note that also the MouseArea in the blue rectangle eats the events of
+ the Popover's InverseMouseArea that is used to close the popover. So if
+ there is a MouseArea in an Item with z>1, this area cannot be clicked to
+ close the Popover.
import QtQuick 2.4
import Ubuntu.Components 1.3
import Ubuntu.Components.Popups 1.3
Item {
width: 600
height: 600
Rectangle {
anchors.centerIn: parent
color: "blue"
width: 400
height: 400
opacity: 0.8
z: 1
- MouseArea { anchors.fill: parent }
+ MouseArea { anchors.fill: parent }
}
Rectangle {
anchors {
right: parent.right
verticalCenter: parent.verticalCenter
}
width: 300
height: 300
color: "yellow"
}
Button {
id: button
anchors {
bottom: parent.bottom
horizontalCenter: parent.horizontalCenter
margins: 30
}
text: "Pop!"
onClicked: PopupUtils.open(popoverComponent, button)
Component {
id: popoverComponent
Popover {
Rectangle {
color: "green"
width: parent.width
height: 300
}
}
}
}
}
--
You received this bug notification because you are a member of Ubuntu
Bugs, which is subscribed to Ubuntu.
https://bugs.launchpad.net/bugs/1504755
Title:
Popover does not open on top of all other Items
To manage notifications about this bug go to:
https://bugs.launchpad.net/ubuntu/+source/ubuntu-ui-toolkit/+bug/1504755/+subscriptions
--
ubuntu-bugs mailing list
ubuntu-bugs@lists.ubuntu.com
https://lists.ubuntu.com/mailman/listinfo/ubuntu-bugs
