QtQuick项目界面跳转怎样实现
想要模拟手机屏幕的设计，点击不同按键打开不同界面，并能对界面进行操作。
我个人目前只会实现到点击不同按键打开相同界面，想向各位请教一下
下面是我的代码，再怎样实现，求解决
main.qml
import QtQuick 1.0
import com.nokia.symbian 1.0
import "connect"//引入connect进行关联
Window {
id: window
StatusBar {
id: statusBar
width: 360
height: 45
anchors.top: window.top
}
Rectangle {
id: bluetooth
x: 0
y: 45
width: 360; height: 595
color: "black"
ListModel {
id:viewModel
ListElement {title: "开启蓝牙"}
ListElement {title: "本机可见性"}
ListElement {title: "配对设备"}
ListElement {title: "我的手机名"}
ListElement {title: "帮助"}
}
ListView {
id: listView
visible: true
anchors.fill: parent
model:viewModel//调用与之相关的model
delegate: ViewModel{}
}
}
}
ViewModel.qml
import QtQuick 1.0
Component {//组件
id: menuDelegate
Item {
id: menu
property real detailsOpacity : 0
width: listView.width
height: 70
Rectangle {
id: background
x: 2;
y: 2;
width: parent.width - x*2;
height: parent.height - y*2
color: "ivory"
border.color: "red"
radius: 5
}
MouseArea {//鼠标感应区
anchors.fill: parent
onClicked: menu.state = 'View';//当点击按键时执行View状态
}
Text {//主界面上的字体显示
text: title
font.bold: true;
verticalAlignment: Text.AlignVCenter;
horizontalAlignment: Text.AlignHCenter;
font.pointSize: 16
color: "blue"
}
states: State {
name: "View"
PropertyChanges {
target: menu;
detailsOpacity: 1;
x: 0
} //更改可见性，只使需要展现的menu可见
PropertyChanges {
target: menu;
height: listView.height
} //使点击的列图填满整个列表的详细视图
PropertyChanges {
target: menu.ListView.view;
explicit: true;
contentY: menu.y
} //移动单个列表位置，使其铺满整个视图
}
}
}
[解决办法]
Page Based Application Navigation是一个基于页面栈的导航功能，与滑屏无关。
楼主怎么会做出只针对滑屏的判断呢？文档上在醒目的位置给出了Page Navigation with ToolBars的示例，这已经足够说明问题了。
楼主应该仔细阅读，并且进行一些试验。
[解决办法]
最简单的，当你点击比如蓝牙按钮的时候，你让你的蓝牙的界面的visible为ture，或者是设置其x或者y为适当的值，然后添加相应的动画就好了
可以参考我写的一个圣经阅读器：
https://gitorious.org/raamattu/raamattu
[解决办法]
property alias message: label.text
Page {
id: page1
property alias message: label.text
Text {
id: label
x: 100
y: 100
color: "white"
}
}
window.pageStack.push(page1, { message: "Test" }, true)
onClicked: {
// 创建对象
var object = Qt.createComponent("Bluetooth.qml").createObject(window)
object.title = "蓝牙设置页面，点击关闭"
}
import QtQuick 1.0
// 蓝牙设置页面
Rectangle {
id: page
anchors.fill: parent
// 属性
property alias title: titleText.text
// 构造函数
Component.onCompleted: {
console.log("Create Bluetooth Page.")
}
// 析构函数
Component.onDestruction: {
console.log("Destroy Bluetooth Page.")
}
// 标题
Text {
id: titleText
}
// 鼠标区域
MouseArea {
anchors.fill: parent
onClicked: {
page.destroy()
}
}
}
import QtQuick 1.0
Component {
id: menuDelegate
Rectangle {
x: 2
width: parent.width - x * 2
height: 70
radius: 5
border.color: "red"
Text {
anchors.fill: parent
text: title
font.bold: true;
verticalAlignment: Text.AlignVCenter;
horizontalAlignment: Text.AlignHCenter;
font.pointSize: 16
color: "blue"
}
// 鼠标区域
MouseArea {
anchors.fill: parent
onClicked: {
if (title == "开启蓝牙")
{
// 创建对象
var object = Qt.createComponent("TestPage.qml").createObject(window)
object.title = "蓝牙设置页面，点击关闭"
}
}
}
}
}
