OpacityMask doesn't work for me ... what am I missing?



  • I downloaded the images & used the QML code from the OpacityMask documentation page (qt-project.org/doc/qt-5/qml-qtgraphicaleffects-opacitymask.html) but it isn't doing what I expect. I though I would end up with a mostly red screen with a butterfly-shaped picture of a bug, but what I get instead is a boring square picture of a bug (on a red screen). There are no warnings in the console that would indicate the problem. Am I just mis-understanding the purpose of OpacityMask?

    Thanks,
    Chris

    @
    import QtQuick 2.2
    import QtQuick.Controls 1.2
    import QtGraphicalEffects 1.0

    Item
    {
    id: screen
    anchors.fill: parent

    Rectangle {
        anchors.fill: parent
    
        color: "red"
    
    }
    
    Item
    {
        id: hole
        anchors.fill: parent
    
        Image
        {
            id: bug
            source:"qrc:/Bug.png"
            sourceSize: Qt.size(parent.width, parent.height)
            smooth: true
            visible: false
        }
    
        Image
        {
            id: mask
            source:"qrc:/Butterfly.png"
            sourceSize: Qt.size(parent.width, parent.height)
            smooth: true
            visible: false
        }
    
        OpacityMask {
            anchors.fill: bug
            source: bug
            maskSource: mask
        }
    }
    

    }
    @

    [edit: added missing coding tags @ SGaist]


  • Moderators

    Hi,

    Make sure the image source files are in the resources.
    QtCreator must have shown the error in the console when you run the application.



  • I figured out the problem, I downloaded the Butterfly.png from the OpacityMask documentation page and it looked like it had the properly transparent background, but it didn't. When I modified the image to actually have transparency, everything worked.


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.