import QtQuick 2.12
import QtQuick.Window 2.12
import QtCharts 2.3
import QtQml 2.13
Window {
width: 640
height: 480
visible: true
title: qsTr("Hello World")
Item {
id: container
anchors.fill: parent
// 定义过渡 子类会生效
transitions:[ Transition {
AnchorAnimation { duration: 2000 }
}, Transition {
NumberAnimation { duration: 2000}
}]
// 矩形
Rectangle {
id: myRect
width: 100; height: 100
color: "red"
}
// 状态列表
states: [
// 锚点右边走
State {
name: "reanchored"
AnchorChanges { target: myRect; anchors.right: container.right }
},
// 锚点下边走
State {
name: 'jie'
AnchorChanges {
target: myRect
anchors.left: container.left
}
}
]
// 点击切换矩形的状态,转换过渡动画
MouseArea {
anchors.fill: parent
onClicked: {
container.state = 'jie'
myRect.width = container.width / 2 // 增加宽度
}
}
// 组件加载完成时的设置状态
Component.onCompleted: container.state = "reanchored"
}
}
QmlStates过渡动画以及锚点过渡
最新推荐文章于 2024-04-13 23:26:51 发布