ubuntu-sdk-bugs team mailing list archive

[Tim Peeters <1504755@xxxxxxxxxxxxxxxxxx>]

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
SDK bug tracking, which is subscribed to ubuntu-ui-toolkit in Ubuntu.
https://bugs.launchpad.net/bugs/1504755

Title:
  Popover does not open on top of all other Items

Status in ubuntu-ui-toolkit package in Ubuntu:
  New

Bug description:
  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
                  }
              }
          }
      }
  }

To manage notifications about this bug go to:
https://bugs.launchpad.net/ubuntu/+source/ubuntu-ui-toolkit/+bug/1504755/+subscriptions