Row为QML中一个水平自动布局定位器,需要设置的属性不多。下面详细说明。
Rectangle{ anchors.fill: parent color: "black" Row{ //水平布局子对象 y:10 spacing: 20 //相邻项的间隔 anchors.centerIn: parent 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:"x"; duration: 1000 } } //例子中当第二个的visible为false时,执行动画第三个矩形往左移动到第二个矩形的位置 //反之,当第二个由不可见变可见的时候,第三个往右移动回来原来的位置 add:Transition { //增加子对象的时候执行的动画 NumberAnimation { properties:"x"; duration: 1000 } //刚开始进入时慢慢从左往右滑,而不是一进入就显示 } //layoutDirection: Qt.LeftToRight //本人qt版本没有这个属性,这个属性表示子项从左往右布局 //layoutDirection: Qt.RightToLeft //从右往左布局 } MouseArea{ anchors.fill: parent onClicked: {rec_2.visible = !rec_2.visible} } }