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

Wrong Z order with DropShadow in WebAssembly

    XMLWordPrintable

Details

    • 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

        No reviews matched the request. Check your Options in the drop-down menu of this sections header.

        Activity

          People

            lpotter Lorn Potter
            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