StackView in ui.qml Forms

Question

Well, my question is very simple, I want to use the ui.qml files but I cant use Component and Loader insite these files, so for that reason I cant use StackView because for config the StackView I need use Component and loaders, so my question is, how I assign a Component and Loaders in main.qml of a StackView inside of WinForm.ui.qml? I already tried this in MainForm.ui.qml file:

property alias stackV: stackV
...
Item{
    id: stackV
    anchors.top: barraUP.bottom; anchors.bottom: barraDown.top
    anchors.horizontalCenter: parent.horizontalCenter
    width: CalcSize.espTrbWid
}
...

In main.qml file:

MainForm {
    anchors.fill: parent
    stackV{
        Component{
            id: comp1
            Loader {
                id:loader1
                source: "VentPrinc.qml"
            }
        }
    }
}

But I get this error

QQmlApplicationEngine failed to load component qrc:/main.qml:30 Cannot assign a value directly to a grouped property

I really appreciate any help

Answer 1

I looked into the same problem - the need to use StackView in Form.ui.qml. As long as I didn't understand the answer by @Fabian Menco and did not like the solution, proposed by @romanp in comment, I came up with a bit simpler solution of my own. The basic idea is the same - create a property alias and use it for further customisation in corresponding .qml file:

property alias stackV: stackV
...
StackView {
    id: stackV
    anchors.top: barraUP.bottom; anchors.bottom: barraDown.top
    anchors.horizontalCenter: parent.horizontalCenter
    width: CalcSize.espTrbWid
}
...

Than it may be directly used in .qml:

MainForm {
    anchors.fill: parent

    Component {
        id: comp1
        Loader {
            id:loader1
            source: "VentPrinc.qml"
        }
    }

    stackV {
        initialItem: comp1
    }
}

Important: Component is declared outside of StackView. Defining Component inside StackView (stackV in example above) results in error that was the problem of the question author:

Cannot assign a value directly to a grouped property

Answer 2

MainForm {
    anchors.fill: parent
    Loader {
        sourceComponent: Component {
            StackView {
                anchors.fill: parent
            }
        }
    }
}