Qt·页面切换的方式

本文介绍了Qt中五种不同的页面切换方法:1)实时创建与销毁对象,适用于主页面与子页面切换;2)使用Loader加载页面,支持无动画切换;3)StackView实现带动画的多页面切换;4)TabView进行内部页面切换;5)隐藏与显示方式切换页面,需要初始化。
摘要由CSDN通过智能技术生成

方式1:主页面与子页面互相切换-不需初始化,实时创建

当前页面切换子页面
import页面文件
var component = Qt.createComponent("LoadedPage.qml") ;
var object = component.createObject(parent);或直接贴qml字符串:
var myItem = Qt.createQmlObject("import QtQuick 2.0; MyItem {}", parent);
子页面切换为父页面,销毁子页面即可,qt安全机制,可在内部调用destroy()
1、object.destroy();或myItem .destroy();
方式2:平级页面切换-使用Loader加载,无动画     

使用Loader.setSource方式-无需初始化子页面,销毁不保留
在父页面,创建loader,并初始化
Loader{
id:loader;
source: "initPage.qml" ;
}
切换其他页面显示
loader.setSource("otherPage.qml")
使用setComponent方式-初始化子页面,保留页面
在父页面,创建多个页面的component,过程不赘述
在父页面,创建loader,并初始化component
Loader{
id:loader;
sourceComponent:initPonent;
}
在子页面或父页面,触发切换
 loader.sourceComponent = otherPonent;
方式3:多个平级页面切换-使用stackview,需要初始化,有动画

在父页面,创建多个component,过程不赘述

Component{

id:initComponent;

}

Component{

id:component1;

}

在父页面,创建一个StackView,并设置初始页面

 StackView{

id: stackView;

anchors.fill: parent;

initialItem: initComponent;

}

在父页面,定义切换函数,用于切换页面

function changePage1(){

stackView.push(component1)

}

在子页面,触发切换

parent.changePage1();

方式4:内部页面切换-TabView方式或Loader方式加载

TabView
import QtQuick 2.0
import QtQuick.Controls 2.15

TabView {
    Tab {
        title: "Tab 1"
        Rectangle {
            color: "lightblue"
            anchors.fill: parent
            Text {
                text: "Content of Tab 1"
                anchors.centerIn: parent
            }
        }
    }

    Tab {
        title: "Tab 2"
        Rectangle {
            color: "lightgreen"
            anchors.fill: parent
            Text {
                text: "Content of Tab 2"
                anchors.centerIn: parent
            }
        }
    }
}

Loader效果在上文有描述
方式5:多个平级页面切换-需要初始化,隐藏与显示方式

初始化多个页面 //初始化不赘述
在事件或槽函数进行不同页面的隐藏与显示
 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值