AnchorChanges属性说明

AnchorChanges类型用于修改项的锚的状态，不能用于修改项目的边距。

本文: https://www.lovejia.win/blog/article/AnchorChanges.html
参考原文：http://doc.qt.io/qt-5/qml-qtquick-anchorchanges.html
参考译文：http://blog.csdn.net/vampire_armand/article/details/38895945

属性说明

anchors

anchors.left : AnchorLine
anchors.right : AnchorLine
anchors.horizontalCenter : AnchorLine
anchors.top : AnchorLine
anchors.bottom : AnchorLine
anchors.verticalCenter : AnchorLine
anchors.baseline : AnchorLine
这些属性更改项目的相应锚点。

target : Item

此属性保存将应用锚定更改的项目。

功能简述

AnchorChanges用来修改项目状态中的锚。它不能用来修改项目的边缘。项目的边缘可用PropertyChanges修改。
AnchorChanges可以使用AnchorAnimation进行动画。对锚点边距的更改可以使用NumberAnimation进行动画。
参阅Anchor Layouts锚点布局。

例

在下面的例子中，我们改变使用项目的顶部和底部锚AnchorChanges，以及使用该顶部和底部锚边距PropertyChanges：

import QtQuick 2.0
Rectangle {
    id: window
    width: 120; height: 120
    color: "black"

    Rectangle { id: myRect; width: 50; height: 50; color: "red" }

    states: State {
        name: "reanchored"

        AnchorChanges {
            target: myRect
            anchors.top: window.top
            anchors.bottom: window.bottom
        }
        PropertyChanges {
            target: myRect
            anchors.topMargin: 10
            anchors.bottomMargin: 10
        }
    }

    MouseArea { anchors.fill: parent; onClicked: window.state = "reanchored" }
}

可以使用AnchorAnimation进行动画：

//动画我们的锚点更改
Transition {
    AnchorAnimation {}
}

下面示例可以指定undefined来重置锚点：

AnchorChanges {
    target: myItem
    anchors.left: undefined          // remove myItem的left anchor 
    anchors.right: otherItem.right
}