how to load component from another file using loader in qml

2
votes

I am using loader to load another qml file and after that file is loaded i am trying to set the component of it. The problem is that qml does not recognize the name of component as it is defined in another file.

I know if i make the component it can recognize and loads it using loader. But what i am trying to do is trying to load the component from another file using loader. Please help me Thank you.

Inside main.qml

     MouseArea {
                anchors.fill: parent
                onClicked: {
                    display.visible = false
                    loader.source = "second.qml"
                    loader.sourceComponent = secondcomp

                }
            }

second.qml


import QtQuick 2.0

Component {
    id : secondcomp

    Rectangle{
        id : display
        x: 0
        y: 100
        visible: true
        width: 100
        height: 100
        color: "red"
    }
}
1
qtqml
Why do you set both source and sourceComponent ? – GrecKo
Why Cant I set both ? See QT examples – Mandeep

1 Answers

0
votes

by setting secondcomp as property and making it alias to be used in other file 

Item{

        id : main


        property alias secondcomp: secondcomp

        Component {
            id : secondcomp


            Rectangle{
                id : display
                signal message(string msg)
                x: 400
                y: 400
                visible: true
                width: 100
                height: 100
                color: "red"
            }
        }

        MouseArea {
            anchors.fill: parent
            onClicked: secondcomp.message("clicked!")
        }
    }

and making main.qml 

    MouseArea {
        anchors.fill: parent
        onClicked: {
            display.visible = false
            loader.source = "second.qml"
            loader.sourceComponent = loader.item.secondcomp
        }
    }