Uploaded image for project: 'Qt'
  1. Qt
  2. QTBUG-94741

Wrong Z order with DropShadow in WebAssembly

    XMLWordPrintable

    Details

    • Platform/s:
      WebAssembly

      Description

      The following qml snippet with QtWebAssembly causes items to be painted with the wrong Z order

      import QtQuick 2.15
      import QtQuick.Window 2.15
      import QtGraphicalEffects 1.15Window {
          id: root    
          width: 300
          height: 300    
          visible: true    
          
          Rectangle {
              id: header
              width: parent.width
              height: 50
              color: "#dddddd"
              visible: false
          }    
          
          DropShadow {
              anchors.fill: header
              horizontalOffset: 0
              verticalOffset: 1
              radius: 5
              samples: 11
              color: "#60000000"
              source: header
          }    
          
          Rectangle {
              id: bkg
              anchors { topMargin: header.height; fill: parent }
              color: "red"        
              
              Rectangle {
                  width: parent.width
                  height: 50
                  color: "green"            
                  
                  Text {
                      anchors.fill: parent
                      text: "Hello World"
                      color: "white"
                  }
              }
          }    
          
          MouseArea {
              anchors.fill: parent
              onClicked: bkg.opacity = bkg.opacity === 0.5 ? 1 : 0.5
          }
      } 

      In particular "bkg" red rectangle is painted above its children green rectangle.

      This can be seen by clicking the window and making the "bkg" rectangle slightly transparent.

       

      Expected Behaviour:

      The red rectangle is painted under the green rectangle as shown in this pic (obtained by compiling with Qt 5.15.5 x64

       

      Current wrong behaviour

      The red rectangle is painted above its children rectangle in Qt 5.15.5 WASM as shown in this picture

      and confirmed by making the red rectangle slightly transparent

       

      Steps to reproduce and notes

       

       

       

        Attachments

        1. 5.15.6_vs_6.2.0.png
          95 kB
          Juha Vuolle
        2. image-2021-06-23-12-27-43-147.png
          9 kB
          Filippo Cucchetto
        3. image-2021-06-23-12-28-21-637.png
          26 kB
          Filippo Cucchetto
        4. image-2021-06-23-12-30-38-542.png
          22 kB
          Filippo Cucchetto
        5. image-2021-06-23-12-31-04-902.png
          19 kB
          Filippo Cucchetto
        6. image-2021-06-23-12-37-36-570.png
          21 kB
          Filippo Cucchetto
        7. WebAssemblyZOrderBug.zip
          4 kB
          Filippo Cucchetto
        No reviews matched the request. Check your Options in the drop-down menu of this sections header.

          Activity

            People

            Assignee:
            lpotter Lorn Potter
            Reporter:
            cuke Filippo Cucchetto
            Votes:
            1 Vote for this issue
            Watchers:
            3 Start watching this issue

              Dates

              Created:
              Updated:
              Resolved:

                Gerrit Reviews

                There are no open Gerrit changes