[Nin4ikP]

Hello everyone 🙂

 

I don’t know, if it is possible, why I am asking you now.

I want to have to .qml files: ContentManager.qml and HomeWindow.qml.

I’ve got more .qml-files, in which I want to use the same Backgroundimage as in the HomeWindow. So my question is: Can I define the Image in the ContentManager and call it from other .qml-files?

Like this (which doesn’t work yet):

ContentManager.qml:

Item {
    id: lcm

    property alias background: background

    MultiResolutionImage {
        id: background
        source: sourceManager.backgroundFile2
        anchors.fill: parent
    }
}

 

and HomeWindow.qml:

Scene {
    id: homeWindow
    anchors.fill: parent

    property MultiResolutionImage backgr: levelContentManager.background
}

 

but right now, it doesn’t show me anything, so the question is still: is it possible at all? And if yes – HOW? 🙂 maybe I need a function?

 

Thank you

Nina

[AlexFelgo Team]

Hi Nina,

without testing the code, something like this could work:

Item {
    id: lcm

    property alias background: background
    
    // this does not create the image as child of the ContentManager, but instead prepares a component that can be created and used e.g. with a Loader
    Comppnent {
        id: background
        MultiResolutionImage {
            source: sourceManager.backgroundFile2
            anchors.fill: parent
        }
    }
}

Scene {
    id: homeWindow
    // a Scene is built to automatically scale and adept to the GameWindow, using anchors.fill totally breaks this, read more about this here: https://felgo.com/doc/vplay-different-screen-sizes/
    // anchors.fill: parent

    Loader { sourceComponent: levelContentManager.background}
}

Anyway I find this approach a bit over-complicated, why not just create a e.g. SceneBase item that contains the background, and derive your scenes from this item:
SceneBase.qml

Scene {

    // alias this property, in case you want to change it from outside
    property alias backgroundSource: background.source

    MultiResolutionImage {
        id: background
        source: sourceManager.backgroundFile2
        // game backgrounds should always fill the gameWindowAnchorItem of the scene rather than just the scene, you cam read more about this here: https://felgo.com/doc/vplay-different-screen-sizes/
        anchors.fill: parent.gameWindowAnchorItem
    }
}

Then you can just use SceneBase instead of Scene as base item of your scenes, and each one use the same background (and you can use the backGroundSource property if you want to change the image for a specific scene).

Since I found some basic issues how you are using your scene and the background, I’d highly recommend to check out this tutorial about creating games for multiple resolutions: https://felgo.com/doc/vplay-different-screen-size

Cheers,
Alex

[Nin4ikP]

Hello Alex!

 

Thank you very much! It’s so simple that I didn’t think of it right away 😀

I have usage for both solutions 🙂 Thanks!

 

Best,

Nina