Column是qml中的一个定位器，自动垂直排列子项，所需要设置的属性相对比较少。
Rectangle{ anchors.fill: parent color: "black" Column{ //垂直布局子对象 y:10 spacing: 20 //相邻项的间隔 anchors.horizontalCenter: parent.horizontalCenter Rectangle{ id:rec_1 height: 100 width: 100 radius: 5 color: "red" } Rectangle{ id:rec_2 height: 100 width: 100 radius: 5 color: "blue" } Rectangle{ id:rec_3 height: 100 width: 100 radius: 5 color: "yellow" } move: Transition { //移除过度 NumberAnimation { properties:"y"; duration: 1000 } } //例子中当第二个的visible为false时，执行动画第三个矩形往上移动 //反之，当第二个由不可见变可见的时候，第三个往下移动执行动画 add:Transition { //增加子对象的时候执行的动画 NumberAnimation { properties:"y"; duration: 1000 } //刚开始进入时慢慢从上往下滑，而不是一进入就显示 } } MouseArea{ anchors.fill: parent onClicked: {rec_2.visible = !rec_2.visible} } }