Question

非常简单的问题。

这与Qt 4.8.5, QML, QtQuick 1.1

有关

我无法理解QML中的屏幕转换以及如何编码。

为简单起见，我想在3个不同的QML文件中有3个不同的屏幕。

1.Home Screen
2.Setting Screen
3.Help Screen
all with width: 640 and height:480

每个屏幕都不同，里面有不同的孩子。

现在我在主屏幕上有一个按钮进入设置屏幕，后面有一个后退按钮。然后在1和2中都有一个帮助按钮，显示帮助屏幕。

现在我的main.qml文件应该如何???

为简单起见，请考虑屏幕只有导航按钮。

有人可以给我发一个代码。

Answer 1

如果你确定你的应用程序将保持固定在这3个屏幕上，你可以使用这样简单的东西：

Rectangle {
  id: app
  anchors.fill: parent
  Row {
    anchors.centerIn: parent
    Button {
      text: "settings"
      onClicked: set.visible = true
    }
    Button {
      text: "help"
      onClicked: help.visible = true
    }
  }
}
Rectangle {
  id: set
  anchors.fill: parent
  color: "red"
  visible: false
  Button {
    anchors.centerIn: parent
    text: "close"
    onClicked: set.visible = false
  }
}
Rectangle {
  id: help
  anchors.fill: parent
  color: "blue"
  visible: false
  Button {
    anchors.centerIn: parent
    text: "close"
    onClicked: help.visible = false
  }
}

你有3个＆＃34;屏幕＆＃34;按顺序，以便应用程序屏幕位于底部，设置和帮助位于顶部。然后，您只需控制可见性即可切换屏幕。

如果你想要一个更动态的解决方案，请按照评论中的提示来实现一个简单的堆栈视图，这很容易，并且是学习QML的一个很好的练习。

你绝对不希望效仿Konstantin T.的例子，为什么这样一个有缺陷的例子首先被投票，这是一个谜。每次打开设置或帮助时，该方法都会破坏您的应用程序屏幕，返回时您不会转到上一个屏幕，而是转到全新的实例，丢失所有先前的输入。此外，将鼠标区域置于其上可确保您无法与任何屏幕元素进行交互。

Answer 2

您可以使用Loader元素。它用于动态加载可视化QML组件。它可以加载QML文件（使用source属性）或Component对象（使用sourceComponent属性）。

例如：

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

如何在Qt QML中创建多屏幕应用程序

2 个答案: