GUI屏幕转换如何在qml中工作

Question

我是一名C ++开发人员，现在在QtQuick中使用QML研究GUI开发。

在GUI创建中，用户只能看到一个屏幕。 并且基于用户交互，切换屏幕。 但究竟背后发生了什么？

关于如何设计单个屏幕有很多信息，但是如何管理其状态转换的资源却非常少。

是否在启动应用程序时加载了所有屏幕和组件，并将图层顺序更改为显示一次屏幕，

要么

在用户操作之后，新的屏幕被构建，加载并且旧的被破坏（一次只有一个屏幕在内存中）

这种处理的术语是什么。

指出我能在哪里找到这样的信息是非常有帮助的。

如果您无法理解我的问题，请告诉我。 我会重写!!

Answer 1

使用状态在不同屏幕之间切换的可能选项之一：

ColumnLayout {
    id: controls

    states: [
        State {
            id: state1
            name: "STATE1"

            property list<Item> content: [
                Loader {
                    ...
                },
                MyItem {
                    ...
                }
            ]

            PropertyChanges {
                target: controls
                children: state1.content
            }
        },
        State {
            id: state2
            name: "STATE2"

            property list<Item> content: [
                MyHud {
                    ...
                }
            ]

            PropertyChanges {
                target: controls
                children: state2.content
            }
        }
    ]
}

Answer 2

您可以使用Loader加载不同的qml文件或qml组件。

例：

import QtQuick 2.0
Item {
    width: 200; height: 200
    Loader { id: pageLoader }
    MouseArea {
        anchors.fill: parent
        onClicked: pageLoader.source = "Page1.qml"
    }
}

Answer 3

有一个方便的现成解决方案： StackView 。 它为滑动/淡入和淡出的页面提供内置过渡。

StackView {
    id: stack
    initialItem: Page {
        Button {
            text: "Push"
            anchors.centerIn: parent
            onClicked: stack.push(Qt.resolvedUrl("OtherPage.qml"))
        }
    }
}

StackView允许您推送项目，URL和组件。 当推送后两者中的任何一个时，StackView会在适当时自动创建和销毁实例。 例如，如果您推送多个URL或组件，它将仅实例化成为堆栈中当前项的最顶层URL或组件。 一旦您将项目从堆栈中弹出 ，它就会在需要时创建一个项目实例，一旦它成为堆栈中当前最顶层的项目。 StackView还允许您替换堆栈中的一个或多个项目。 当从堆栈弹出或替换动态创建的项目时，它会在相应的转换完成后自动销毁实例。