QML中的RotationAnimation旋转动画

最新推荐文章于 2024-10-08 20:45:48 发布

炫彩灵感

最新推荐文章于 2024-10-08 20:45:48 发布

阅读量6.6k

点赞数

本文链接：https://blog.csdn.net/xuancailinggan/article/details/50893804

版权

本文介绍了如何使用QML的RotationAnimation实现矩形围绕中心旋转90度的效果。详细讲解了transformOrigin属性，该属性用于设置旋转的中心点，默认为中心，并提供了实际操作的代码示例。

摘要由CSDN通过智能技术生成

RotationAnimation是用来控制某个元素的旋转。

现有一个需求，要求将一个矩形绕着自己的中心旋转九十度。

代码如下：

import QtQuick 2.3
import QtQuick.Window 2.2

Window {
    visible: true
    width: 500
    height: 500

    Rectangle{
        id:colorChange
        color: "red"
        width: 200
        height: 200
        radius: 30
        anchors.centerIn: parent
        //transformOrigin: Item.right//此属性用于指定在旋转的时候是以哪一点进行旋转
    }
    RotationAnimation{
        id:rotationAnimation
    target: colorChange
    to:90
    direction: RotationAnimation.Clockwise
    duration: 3000
    }
    MouseArea{
        anchors.fill: parent
        onClicked:rotationAnimation.start()

    }
}

效果图：