zoukankan      html  css  js  c++  java
  • QML Animation

    Types of Animations 主要有以下几种动画:

    Value Source / Behavior
    When an animation is used as a value source or in a Behavior, the default target and property name to be animated can both be inferred.
        Rectangle {
            id: theRect
            100; height: 100
            color: Qt.rgba(0,0,1)

    //Animations as Property Value Sources
            NumberAnimation on x { to: 500; loops: Animation.Infinite } //animate theRect's x property

    //Behavioral Animations
            Behavior on y { NumberAnimation {} } //animate theRect's y property
        }
    Transition
    When used in a transition, a property animation is assumed to match all targets but no properties. In practice, that means you need to specify at least the properties in order for the animation to do anything.
        Rectangle {
            id: theRect
            100; height: 100
            color: Qt.rgba(0,0,1)
            Item { id: uselessItem }
            states: State {
                name: "state1"
                PropertyChanges { target: theRect; x: 200; y: 200; z: 4 }
                PropertyChanges { target: uselessItem; x: 10; y: 10; z: 2 }
            }
            transitions: Transition {
                //animate both theRect's and uselessItem's x and y to their final values
                NumberAnimation { properties: "x,y" }

                //animate theRect's z to its final value
                NumberAnimation { target: theRect; property: "z" }
            }
        }
    Standalone
    When an animation is used standalone, both the target and property need to be explicitly specified.
        Rectangle {
            id: theRect
            100; height: 100
            color: Qt.rgba(0,0,1)
            //need to explicitly specify target and property
            NumberAnimation { id: theAnim; target: theRect; property: "x" to: 500 }
            MouseArea {
                anchors.fill: parent
                onClicked: theAnim.start()
            }
        }

    Animations in a Signal Handler:其实也是standalone的一种,需要指定target和property
    An animation can be created within a signal handler to be triggered when the signal is received. For example:
    import Qt 4.7

    Rectangle {
         id: rect
         100; height: 100
         color: "red"

         MouseArea {
             anchors.fill: parent
             onClicked: PropertyAnimation { target: rect; properties: "x,y"; to: 50; duration: 1000 }
         }
    }

    Animation Elements: 动画元素:

    Property Animation Elements

    PropertyAnimation,It is inherited by NumberAnimation, ColorAnimation, RotationAnimation and Vector3dAnimation

    Grouping Animations

    ParallelAnimation or SequentialAnimation.

    Other Animation Elements
    In addition, QML provides several other elements useful for animation:
    PauseAnimation: enables pauses during animations
    ScriptAction: allows JavaScript to be executed during an animation, and can be used together with StateChangeScript to reused existing scripts
    PropertyAction: changes a property immediately during an animation, without animating the property change
    See their respective documentation pages for more details.

  • 相关阅读:
    FOC中的Clarke变换和Park变换详解(动图+推导+仿真+附件代码)
    有感FOC算法学习与实现总结
    永磁同步电机 spmsm 和 ipmsm 的区别总结
    Jekyll 解决Jekyll server本地预览文章not found的问题
    STM32 TIM 多通道互补PWM波形输出配置快速入门
    STM32 TIM1高级定时器配置快速入门
    STM32 ADC多通道规则采样和注入采样
    STM32 时钟树配置快速入门
    STM32 TIM 编码器模式采集编码器信号
    STM32 标准库V3.5启动文件startup_stm32f10xxx.s分析
  • 原文地址:https://www.cnblogs.com/cute/p/2127277.html
Copyright © 2011-2022 走看看