Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Component and Loader where there's a property alias between the Component Item and the Loader?



  • Hi!

    Let's say I have a Component that contains a RadialGradient.

    Component {
       id: radGrad
       RadialGradient {
          //stuff here
       }
    }
    

    Now I use a Loader to create it and bind it to a Rectangle (which is essentially an opacity mask)

    Rectangle {
        id: wrecked
        x:0; y:0; width: 256; height: 256 //LOL! Coder numbers!
        radius: 32
    }
    
    Loader {
       sourceComponent: radGrad
       anchors.fill: parent
       // Loader already has a source property - RadialGradient source property is "hidden"
       source: wrecked // BANG!
    }
    

    As you can see both the Loader and the RadialGradient have a source property and the Loader property, naturally, wins out. So how do I set the source property of the inner item? I can't add a property alias to the inline Component because Component objects cannot declare new properties.

    Currently the only decent work around I have is this...

    Loader
    ...
        onLoaded: {
            item.source = wrecked
        }
    

    But this doesn't "feel" good (should be a bind anyway). I can't write item.source inside the Loader either.

    What's a better solution?

    Yours,
    Matthew


  • Moderators

    Hi @kindid and welcome

    you can define properties inside your loader component, that than can be accessed by the loaded item/component
    something like this:

     Loader {
        sourceComponent: radGrad
        anchors.fill: parent
        // Loader already has a source property - RadialGradient source property is "hidden"
       property var wreckedSource: wrecked
     }
    
    Component {
       id: radGrad
       RadialGradient {
          source: wreckedSource
       }
    }
    

  • Qt Champions 2018

    Another solution is using Binding:

    Loader {
       id: loader
       sourceComponent: radGrad
       anchors.fill: parent
       Binding {
           target: loader.item
           property: "source"
           value: wrecked
       }
    }
    


  • Both work nicely. I will probably go with Binding as it means the interface to the Item contained within the Component maintains the same property set as is documented. But the use of a Loader defined property is a very interesting use of the dynamic search space from the perspective of the Component encapsulated Item. I may have other uses for that - not sure yet!

    Thank you very much!


Log in to reply