QML中的AnchorChanges锚布局改变元素

版权声明：本文原创，未经许可严禁转载。QQ群：QT&C/C++爱好者271251545 https://blog.csdn.net/xuancailinggan/article/details/50924858

AnchorChanges用来改变锚布局，其实你完全可以用属性来进行，这个元素不过是对属性的细化而已。

一个简单的单击鼠标改变锚布局属性的例子：

import QtQuick 2.4
import QtQuick.Window 2.2

Window {
    id:rootItem
    visible: true
    width: 400
    height: 500
    MouseArea {
        anchors.fill: parent
        onClicked: {

                 redRect.state="clicked"//QML的调试真的很烂，这里我开始多写了一个等号，不能执行，但是不报错
        }
    }
    Rectangle{
        id:blueRect
        x:8
        y:8
        width: 100
        height: 100
        color: "blue"
    }
    Rectangle{
        id:redRect
        width: 100
        height: 100
        color: "red"
        anchors.left: blueRect.right
        anchors.top: blueRect.top
        states: [
            State {
                name: "default"
                AnchorChanges {
                    target: blueRect
                    anchors.left: blueRect.right
                    anchors.top: blueRect.top
                }
            },
            State {
                name: "clicked"
                AnchorChanges {
                    target: redRect
                    anchors.left: blueRect.left
                    anchors.top: blueRect.bottom
                }
            }
        ]
    }
}