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

问题描述：

我是一名C++开发人员，现在正在研究在QtQuick中使用QML进行GUI开发。GUI屏幕转换如何在qml中工作

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

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

是，新的屏幕建成，装老被销毁启动应用程序并更改图层顺序显示，一旦画面时加载所有屏幕和组件，

或用户操作后

（一次只有一个屏幕在内存中）

这种类型的处理的术语是什么。

这将是非常有用的指向我可以找到这样的信息。

如果您不明白我的问题，请告诉我。我会重写！

答

有可用的一个方便的现成的解决方案：StackView。它为滑动/淡入淡出的页面提供了内置转换。

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

StackView让你push项目，URL和组件。在推动后两者中的任何一个时，StackView会在适当时自动创建并销毁实例。例如，如果您推送多个URL或组件，则它只会实例化最上面一个成为堆栈中当前项目的那个。一旦您将物品从堆叠中取出，它会在其成为堆叠上当前最顶端的物品时按需创建其下的物品实例。 StackView还允许您在堆栈中使用replace一个或多个项目。在弹出或替换动态创建的项目时，它会在各个转换完成后自动销毁实例。

谢谢你的解释.. –

是否有无论如何在屏幕过渡时关闭动画'Stackview'默认提供？ –

是的，您可以传递'StackView.Immediate'作为push（），pop（）或replace（）的最后一个参数。 – jpnurmi

答

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

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

答

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

实施例：

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

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

相关推荐