一、描述

StackView 提供栈式导航。它的特点是用类似于栈的方式管理一系列界面，这些界面之间可能有内在联系，根据业务需要，可以一级一级向前面跳转或返回后面的界面。

import QtQuick
import QtQuick.ControlsApplicationWindow {title: qsTr("Hello World")width: 640height: 480visible: trueStackView{id: stackinitialItem: mainViewanchors.fill: parent}Component {id: mainViewRow {spacing: 10Button {text: "一个界面进栈"onClicked: stack.push(mainView)}Button {text: "一个界面出栈"enabled: stack.depth > 1onClicked: stack.pop()}Text {text: "当前界面的栈深度：" + stack.depth}}}
}

StackView 不会从 push() 到它的项目中继承隐式大小。下面的 Dialog 的 contentItem 将无法按预期工作：

Dialog {StackView {initialItem: Rectangle {width: 200height: 200color: "salmon"}}
}

二、属性成员

1、【只读】busy : bool

转换是否正在运行。

2、【只读】currentItem : Item

堆栈中当前最顶层的项目。

3、【只读】depth : int

当前堆栈中的项目数。

4、【只读】empty : bool

堆栈是否为空。

5、initialItem : var

创建 StackView 时应显示的初始项。可以是 Item、Component 或 url。

指定初始项等效于：
Component.onCompleted: stackView.push(myInitialItem)

6、popEnter : Transition

当一个项目从堆栈中弹出时应用于进入堆栈顶部的项目的转换。

import QtQuick
import QtQuick.ControlsApplicationWindow {title: qsTr("Hello World")width: 640height: 480visible: trueStackView{id: stackinitialItem: mainViewanchors.fill: parentpopEnter : Transition {PropertyAnimation {property: "opacity"from: 0to:1duration: 200}PropertyAnimation {property: "y"from: 100to:0duration: 200}}}Component {id: mainViewRow {spacing: 10Button {text: "一个界面进栈"onClicked: stack.push(mainView)}Button {text: "一个界面出栈"enabled: stack.depth > 1onClicked: stack.pop()}Text {text: "当前界面的栈深度：" + stack.depthComponent.onDestruction: print("销毁item")}}}
}

7、popExit : Transition

当项目从堆栈中弹出时应用于退出堆栈的项目的转换。

import QtQuick
import QtQuick.ControlsApplicationWindow {title: qsTr("Hello World")width: 640height: 480visible: trueStackView{id: stackinitialItem: mainViewanchors.fill: parentpopExit : Transition {PropertyAnimation {property: "opacity"from: 0to:1duration: 200}PropertyAnimation {property: "y"from: 0to:100duration: 200}}}Component {id: mainViewRow {spacing: 10Button {text: "一个界面进栈"onClicked: stack.push(mainView)}Button {text: "一个界面出栈"enabled: stack.depth > 1onClicked: stack.pop()}Text {text: "当前界面的栈深度：" + stack.depthComponent.onDestruction: print("销毁item")}}}
}

8、pushEnter : Transition

在项目被推入堆栈时应用于进入堆栈的项目的转换。

import QtQuick
import QtQuick.ControlsApplicationWindow {title: qsTr("Hello World")width: 640height: 480visible: trueStackView{id: stackinitialItem: mainViewanchors.fill: parentpushEnter : Transition {PropertyAnimation {property: "opacity"from: 0to:1duration: 200}PropertyAnimation {property: "y"from: 100to:0duration: 200}}}Component {id: mainViewRow {spacing: 10Button {text: "一个界面进栈"onClicked: stack.push(mainView)}Button {text: "一个界面出栈"enabled: stack.depth > 1onClicked: stack.pop()}Text {text: "当前界面的栈深度：" + stack.depthComponent.onDestruction: print("销毁item")}}}
}

9、pushExit : Transition

项目被推入堆栈时应用于退出堆栈顶部的项目的转换。

import QtQuick
import QtQuick.ControlsApplicationWindow {title: qsTr("Hello World")width: 640height: 480visible: trueStackView{id: stackinitialItem: mainViewanchors.fill: parentpushExit : Transition {PropertyAnimation {property: "opacity"from: 1to:0duration: 200}PropertyAnimation {property: "y"from: 0to:100duration: 200}}}Component {id: mainViewRow {spacing: 10Button {text: "一个界面进栈"onClicked: stack.push(mainView)}Button {text: "一个界面出栈"enabled: stack.depth > 1onClicked: stack.pop()}Text {text: "当前界面的栈深度：" + stack.depthComponent.onDestruction: print("销毁item")}}}
}

10、replaceEnter ：Transition

当项目A被另一个项目B替换时应用于项目B的转换。

11、replaceExit : Transition

当项目A被另一个项目B替换时应用于项目A的转换。

三、附加属性成员

1、【只读】StackView.index : int

所附加到的项目的堆栈索引，如果项目不在堆栈中，则为 -1。

2、【只读】StackView.status : enumeration

附加的项目的堆栈状态，如果项目不在堆栈中，则为 StackView.Inactive。

StackView.Inactive：非活动状态（或不在堆栈中）。

StackView.Deactivating：正在被停用（弹出）。

StackView.Activating：正在被激活（成为当前项目）。

StackView.Active：处于活动状态，即当前项。

3、【只读】StackView.view : StackView

所附加到的项目的堆栈视图，如果项目不在堆栈中，则为 null。

4、StackView.visible : bool

所附加的项目的可见性。

四、附加信号成员

1、activated()

当附加到的项目在堆栈中被激活时，会发出此附加信号。

2、activating()

当附加到的项目正在堆栈中被激活时，会发出此附加信号。

3、deactivated()

当附加到的项目在堆栈中被停用时，会发出此附加信号。

4、deactivating()

当附加到的项目正在堆栈中被移除时，会发出此附加信号。

5、removed()

当附加到的项目已从堆栈中删除时，会发出此附加信号。它可用于安全地销毁被压入堆栈的 Item，例如：

Item {StackView.onRemoved: destroy()
}

五、成员函数

1、void clear(transition)

从堆栈中移除所有项目。可以选择指定转换。支持的转换：

StackView.Immediate：立即清除堆栈而不进行任何转换（默认）。

StackView.PushTransition

StackView.ReplaceTransition

StackView.PopTransition

import QtQuick
import QtQuick.ControlsApplicationWindow {title: qsTr("Hello World")width: 640height: 480visible: trueStackView{id: stackinitialItem: mainViewanchors.fill: parentpushExit : Transition {PropertyAnimation {property: "opacity"from: 1to:0duration: 200}PropertyAnimation {property: "y"from: 0to:100duration: 200}}}Component {id: mainViewRow {spacing: 10Button {text: "一个界面进栈"onClicked: stack.push(mainView)}Button {text: "一个界面出栈"enabled: stack.depth > 1onClicked: stack.pop()}Button {text: "clear"onClicked: stack.clear(StackView.PushTransition)}Text {text: "当前界面的栈深度：" + stack.depthComponent.onDestruction: print("销毁item")}}}
}

2、Item find(callback, behavior)

搜索特定项目。为堆栈中的每个项目调用回调函数 callback（将项目和索引作为参数），直到回调函数返回 true。返回值是找到的项目。例如：
stackView.find(function(item, index) {return item.isTheOne
})
参数二：

StackView.DontLoad：未加载的项目被跳过（不为它们调用回调函数）。

StackView.ForceLoad：卸载的项目被强制加载。

3、Item get(index, behavior)

返回堆栈中位置 index 处的项目，如果索引超出范围，则返回 null。

4、Item pop(item, operation)

从堆栈中弹出一个或多个项目。返回从堆栈中删除的最后一项。

参数二见上面的 clear()，默认为 StackView.PopTransition。

5、Item push(item, properties, operation)

将项目推入堆栈，并可选择在项目上应用一组属性。返回成为当前的项目。
stackView.push(rect)stackView.push(rect, {"color": "red"})
可以通过将多个项目作为附加参数或作为数组传递来同时推送多个项目。最后一项成为当前项。每个项目后面都可以跟一组要应用的属性：
stackView.push(rect1, rect2, rect3)stackView.push(rect1, {"color": "red"}, rect2, {"color": "green"}, rect3, {"color": "blue"})
推入一组项目：
stackView.push([rect1, rect2, rect3])stackView.push([rect1, {"color": "red"}, rect2, {"color": "green"}, rect3, {"color": "blue"}])
参数三见上面的 clear()，默认为 StackView.PushTransition。

6、Item replace(target（被替换者）, item（替换者）, properties, operation)

替换堆栈上的一个或多个项目，并可选择在项目上应用一组属性。返回成为当前的项目。

如果指定了 target 参数，则替换该项目项目。如果 target 为 null，则堆栈中的所有项目都将被替换。如果未指定，则仅替换顶部的项目。

如果替换项是 Component 或 url，StackView 会自动创建一个实例。

参数三指定替换项的初始属性值映射。

替换栈顶的项目：
stackView.replace(rect)stackView.replace(rect, {"color": "red"})
可以通过将多个项目作为附加参数或作为数组传递来同时替换多个项目。每个项目后面都可以跟一组要应用的属性。

传递可变数量的参数：
stackView.replace(rect1, rect2, rect3)stackView.replace(rect1, {"color": "red"}, rect2, {"color": "green"}, rect3, {"color": "blue"})
替换一组项目：
stackView.replace([rect1, rect2, rect3])stackView.replace([rect1, {"color": "red"}, rect2, {"color": "green"}, rect3, {"color": "blue"}])
参数四见上面的 clear()，默认为 StackView.ReplaceTransition。

以下示例使用 replace() 来使用 push 和 pop 转换。

import QtQuick
import QtQuick.ControlsApplicationWindow {title: qsTr("Hello World")width: 640height: 480visible: trueStackView {id: stackViewanchors.fill: parentinitialItem: Component {id: pagePage {Row {spacing: 20anchors.centerIn: parentButton {text: "<"onClicked: stackView.replace(page, StackView.PopTransition)}Button {text: ">"onClicked: stackView.replace(page, StackView.PushTransition)}}}}}
}

QML控件类型：StackView相关推荐

QML控件类型：ToolTip
一.描述 ToolTip 继承自 Popup,可以为任何控件提供工具提示.工具提示是通知用户控件功能的一小段文本.它通常放置在父控件的上方或下方. 提示文本可以是任何富文本格式的字符串. 1.1.附加 ...
QML控件类型：Dial
一.描述仪表盘控件,继承自 Control. 表盘可以用键盘操作.支持以下操作: Qt.Key_Left:按 stepSize 减小值 Qt.Key_Down:按 stepSize 减小值 Qt.K ...
QML控件类型：ComboBox
一.描述 ComboBox 是一个组合按钮和弹出列表. 它提供了一种以占用最少屏幕空间的方式向用户呈现选项列表的方法. ComboBox 填充有数据模型.数据模型通常是 JavaScript 数组.L ...
QML控件类型：Menu
一.描述可用作上下文菜单或弹出菜单的菜单弹出窗口. 当用作上下文菜单: MouseArea {anchors.fill: parentacceptedButtons: Qt.LeftButton | ...
QML控件类型：Tumbler
一.描述 Tumbler 用于通过旋转轮子来选择一个值. Tumbler {model: 10 } API 类似于 ListView 和 PathView 等视图的 API.可以设置模型和委托,并且 ...
QML控件类型：Drawer
一.描述 Drawer 提供一个可以使用滑动手势打开和关闭的侧面板.继承自 Popup. Drawer 可以从上下左右四个方向打开. import QtQuick import QtQuick.Con ...
Qt quick基础2（包含平移旋转放缩以及qml控件大写开头啊）
Qt quick基础2(包含平移旋转放缩以及qml控件大写开头啊) 目录 Qt quick基础2(包含平移旋转放缩以及qml控件大写开头啊) 前言简单的平移.旋转和放缩其他元素的一些基本使用 qm ...
Qml控件：ComboBox
Qml控件:ComboBox ComboBox默认状态定制ComboBox 1.定制框架 2.定制指示器 3.定制背景 4.定制内容 5.定制弹框 6.定制弹框Item 7.弹框项的点击 8.定制删 ...
如果知道一个控件类型的对话框句柄是编辑框控件
如果知道一个控件类型的对话框句柄是编辑框控件 TCHAR chs[256]; ::GetClassName(pCtrl->m_hWnd, chs, 256); CString str(chs ...

QML控件类型：StackView