GUI屏幕转换如何在qml中工作-Java 学习之路

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

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

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

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

要么

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

这种处理的术语是什么 .

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

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

3 回答

2
有一个方便的现成解决方案：StackView . 它为滑动/淡入和淡出的页面提供内置过渡 .
```
StackView {
    id: stack
    initialItem: Page {
        Button {
            text: "Push"
            anchors.centerIn: parent
            onClicked: stack.push(Qt.resolvedUrl("OtherPage.qml"))
        }
    }
}
```
StackView允许您push项目，URL和组件 . 当推送后两者中的任何一个时，StackView会在适当时自动创建和销毁实例 . 例如，如果您推送多个URL或组件，它将仅实例化成为堆栈中当前项的最顶层URL或组件 . 从堆栈中删除项目后，一旦它成为堆栈中当前最顶层的项目，它就会根据需要创建项目的实例 . StackView还允许您在堆栈中的一个或多个项目中使用replace . 当从堆栈弹出或替换动态创建的项目时，它会在相应的转换完成后自动销毁实例 .
回复于 2024-05-02T20:12:22+08:00

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

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
            }
        }
    ]
}

回复于 2024-05-02T20:12:22+08:00

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

Example:

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

回复于 2024-05-02T20:12:22+08:00

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

3 回答

相关问题