SmoothedAnimation QML Type

プロパティが値をスムーズに追跡できるようにします。詳細...

• 継承されたメンバーを含む全メンバーのリスト

プロパティ

• duration : int
• maximumEasingTime : int
• reversingMode : enumeration
• velocity : real

詳細説明

SmoothedAnimationは、イーズイン/アウトの4次イージングカーブを使用して、プロパティの値を設定されたターゲット値にアニメートします。ターゲット値が変更されると、古いターゲット値と新しいターゲット値の間のアニメーションに使用されるイージングカーブが滑らかにつなぎ合わされ、現在の速度を維持したまま新しいターゲット値への滑らかな動きを作成します。

次の例は、SmoothedAnimationを使用して、1つのRectangle 、もう1つの位置をトラッキングしています。緑色の長方形のx とy の値は、赤色の長方形の値にバインドされています。これらの値が変化するたびに、緑の長方形は新しい位置にスムーズにアニメーションします：

import QtQuick

Rectangle {
    width: 800; height: 600
    color: "blue"

    Rectangle {
        width: 60; height: 60
        x: rect1.x - 5; y: rect1.y - 5
        color: "green"

        Behavior on x { SmoothedAnimation { velocity: 200 } }
        Behavior on y { SmoothedAnimation { velocity: 200 } }
    }

    Rectangle {
        id: rect1
        width: 50; height: 50
        color: "red"
    }

    focus: true
    Keys.onRightPressed: rect1.x = rect1.x + 100
    Keys.onLeftPressed: rect1.x = rect1.x - 100
    Keys.onUpPressed: rect1.y = rect1.y - 100
    Keys.onDownPressed: rect1.y = rect1.y + 100
}

SmoothedAnimationは、アニメーションが発生するvelocity 、またはアニメーションがかかるduration を設定することで構成できます。velocity とduration の両方が指定された場合、ターゲット値の各変化に対して、アニメーションが最も速くなる方が選択されます。

例えば、0から800へのアニメーションは、200の速度が設定されている場合は4秒かかり、8000のデュレーションが設定されている場合は8秒かかり、200の速度と8000のデュレーションの両方が設定されている場合は4秒かかります。0から20000までのアニメーションは、ベロシティを200に設定すると10秒かかり、デュレーションを8000に設定すると8秒かかり、ベロシティを200とデュレーションを8000の両方に設定すると8秒かかります。

SmoothedAnimationのデフォルトのベロシティは200ユニット/秒です。アニメートされる値の範囲が小さい場合は、ベロシティを適切に調整する必要があることに注意してください。例えば、アイテムの不透明度の範囲は0〜1.0です。この範囲でスムーズなアニメーションを行うには、ベロシティを0.5単位/秒などに設定する必要があります。0.5のベロシティで0から1.0までアニメーションさせると、2000ミリ秒かかります。

他のアニメーションタイプと同様に、SmoothedAnimationは、トランジション、ビヘイビア、プロパティ値のソースなど、さまざまな方法で適用できます。 Qt Quick の「 Animation and Transitions」ドキュメントでは、アニメーションを作成するためのさまざまな方法を紹介しています。

SpringAnimation 、NumberAnimation 、 Qt Quick の Animation and Transitions 、Qt Quick Examples - Animationも参照してください 。

プロパティの説明