qml场景切换

建立一个变量，在点击事件中改变变量的值，然后在其他需要切换的场景中设置visible属性，即可控制其图片显示不显示。例程如下图：

2016/10/24 00:04

上面的方法介绍了通过变量的切换来切换界面，当只有两个界面的时候，很好使用，当有多个界面的时候，困扰了我很久，下面介绍一下如何多个界面场景切换。

之前采用的方法是main中包含view1->view2->view3->view4,但是发现在设置一个变量之后，只能在两个文件中传递，也就是声明文件和其子文件，其他的则无法调用。经过摸索，发现下面的方法可行，下面做下介绍：

例如有4个文件，也就是四个场景，需要切换，但是需要使用同一个变量来进行统一的调度和控制。

将所有界面全部放在mian.qml中，然后进行统一的调度，点击判断事件则在每一个分场景中进行判断，

View1.qml

import QtQuick 2.0

import QtQuick.Controls 1.4

Rectangle {

    width: 640

    height: 480

    color:"#0034aa"

    Button{

        text:"2"

        anchors{left: view1.left;leftMargin:80}

        onClicked:{

            root.viewShow= 2

            console.log("root.viewShow = ",root.viewShow);

        }

    }

}

View2.qml

import QtQuick 2.0

import QtQuick.Controls 1.4

Rectangle {

    id:t1

    width: 640

    height: 480

    color:"#33aaaa"

    Button{

        text:"3"

        anchors{left: root.left;leftMargin:160}

        onClicked:{

            root.viewShow = 3

            console.log("root.viewShow = ",root.viewShow);

        }

    }

}

View3.qml

import QtQuick 2.0

import QtQuick.Controls 1.4

Rectangle {

    id:t2

    width: 640

    height: 480

    color:"#331aff"

    Button{

        text:"4"

        anchors{left: parent.left;leftMargin:200}

        onClicked:{

            root.viewShow = 0

            console.log("root.viewShow = ",root.viewShow);

        }

    }

}

main.qml

import QtQuick 2.5

import QtQuick.Controls 1.4

Rectangle {

    id:root

    visible: true

    width: 640

    height: 480

    color:"red"

    property int viewShow:0

    Button{

        text:"1"

        onClicked:{

            viewShow = 1;

            console.log("viewShow = ",viewShow);

        }

    }

    View1{

        id:view1

        anchors.fill:parent

        visible: viewShow == 1

    }

    View2{

        id:view2

        anchors.fill:parent

        visible: viewShow == 2

    }

    View3{

        id:view3

        anchors.fill:parent

        visible: viewShow == 3

    }

}

这样，大致上就可以统一的调度每一个界面，控制它什么时候显示，什么时候不显示，但是，此时还报有两个错误：

qrc:/View3.qml:8:5: QML Button: Cannot anchor to an item that isn't a parent or sibling.

qrc:/View2.qml:8:5: QML Button: Cannot anchor to an item that isn't a parent or sibling.

这两个错误暂时尚未解决，不知其原因。

2016/11/01 22:57

上面两个错误大多是由于其anchors使用不对，相对位置不能设置，或者不是夫类而引起的，只需要认真检查，找对包含关系即可。