zoukankan      html  css  js  c++  java
  • qml----动画入门(三、简单的动画实现 RotationAnimation类)

    上一节中我们说到了Animation的两个子类,分别是对Number和Color处理的类。你以为Animation就这点本事?No,No,No。Animation的子女多着呢,壮丁多就是劳动力呀。看看下面这位---RotationAnimation,一个专门处理rotation和 angle的类。

    这个类和它姊妹们多了一个属性,那就是direction。它可以有多种值,谁是它的世界中心就绕着谁旋转。你问我?哦,我单身,属于陀螺型的

    下面看这个简单的例子

    import QtQuick 2.2
    
    Rectangle{
        id: rootItem
         360
        height: 240
        color: "#EEEEEE"
    
        Rectangle{
            id: rect
             160
            height: 60
            anchors.left: parent.left
            anchors.leftMargin: 20
            anchors.verticalCenter: parent.verticalCenter
            color: "red"
    
            MouseArea{
                anchors.fill: parent
                onClicked: RotationAnimation{
                    target: rect
                    to: 90
                    duration: 1500
                    direction: RotationAnimation.Counterclockwise
                }
            }
        }//red rect is end
    
        Rectangle{
            id: blueRect
             120
            height: 60
            anchors.right: parent.right
            anchors.rightMargin: 40
            anchors.verticalCenter: parent.verticalCenter
            transformOrigin: Item.TopRight
            color: "blue"
    
            MouseArea{
                anchors.fill: parent
                onClicked: animation.start()
            }
    
            RotationAnimation{
                id: animation
                target: blueRect
                to: 60
                duration: 1500
            }
        }
    }

    运行效果如下:

  • 相关阅读:
    基于MongoDB.Driver的扩展
    通用查询设计思想
    API接口通讯参数规范
    lambda简单记录
    list去重精简代码版
    spring boot file上传
    fastjson过滤器简单记录
    java读取properties文件
    list循环删除单个元素
    MapReduce运行流程分析
  • 原文地址:https://www.cnblogs.com/SaveDictator/p/8137983.html
Copyright © 2011-2022 走看看