Adobe® Flash® Platform 用 ActionScript® 3.0 リファレンスガイド
ホーム  |  パッケージおよびクラスリストの非表示 |  パッケージ  |  クラス  |  新機能  |  索引  |  付録  |  英語で表示される理由
フィルター: サーバーからデータを取得しています...
サーバーからデータを取得しています...
spark.effects.animation 

MotionPath  - AS3 Flex

パッケージspark.effects.animation
クラスpublic class MotionPath
継承MotionPath Inheritance Object
サブクラス SimpleMotionPath

言語バージョン: ActionScript 3.0
製品バージョン: Flex 4
ランタイムバージョン: Flash Player 10, AIR 1.5

MotionPath クラスは、エフェクト用の Keyframe オブジェクトのコレクションと、アニメーション化するターゲットのプロパティの名前を定義します。各 Keyframe オブジェクトは、エフェクト実行期間の特定の時間におけるプロパティの値を定義します。その後、エフェクトは、2 つのキーフレームで指定された値の間を補間することによってターゲットプロパティの値を計算します。

MXML シンタックスexpandedMXML シンタックスを隠す

The <s:MotionPath> tag inherits the tag attributes of its superclass, and adds the following tag attributes:

  <s:MotionPath 
    id="ID"
    interpolator="NumberInterpolator"
    keyframes="val"
    property="val"
  />
  

デフォルトの MXML プロパティkeyframes

例を表示

さらに例を参照

関連する API エレメント



パブリックプロパティ
 プロパティ定義元
 Inheritedconstructor : Object
指定されたオブジェクトインスタンスのクラスオブジェクトまたはコンストラクター関数への参照です。
Object
  interpolator : IInterpolator
インターポレーターは、アニメーション内にある中間の値を計算する方法を決定します。
MotionPath
  keyframes : Vector.<Keyframe>
アニメーション実行期間にプロパティが受け取る、時間と値のペアを表す Keyframe オブジェクトのシーケンスです。
MotionPath
  property : String
アニメーション化するエフェクトターゲットのプロパティの名前です。
MotionPath
パブリックメソッド
 メソッド定義元
  
MotionPath(property:String = null)
コンストラクターです。
MotionPath
  
各キーフレームのコピーを含む、この MotionPath オブジェクトのコピーを返します。
MotionPath
  
経過時間の割合が指定されると、補間された値を計算して返します。
MotionPath
 Inherited
オブジェクトに指定されたプロパティが定義されているかどうかを示します。
Object
 Inherited
Object クラスのインスタンスが、パラメーターとして指定されたオブジェクトのプロトタイプチェーン内にあるかどうかを示します。
Object
 Inherited
指定されたプロパティが存在し、列挙できるかどうかを示します。
Object
 Inherited
ループ処理に対するダイナミックプロパティの可用性を設定します。
Object
 Inherited
ロケール固有の規則に従って書式設定された、このオブジェクトのストリング表現を返します。
Object
 Inherited
指定されたオブジェクトのストリング表現を返します。
Object
 Inherited
指定されたオブジェクトのプリミティブな値を返します。
Object
プロパティの詳細

interpolator

プロパティ
public var interpolator:IInterpolator

言語バージョン: ActionScript 3.0
製品バージョン: Flex 4
ランタイムバージョン: Flash Player 10, AIR 1.5

インターポレーターは、アニメーション内にある中間の値を計算する方法を決定します。デフォルトでは、MotionPath クラスは値が Number 型であると見なし、中間の Number 値を自動的に計算できます。MotionPath クラスに Number ではない値のキーフレームが指定される場合、または目的のビヘイビアーにおいて異なる補間方法(チャンネルごとのカラー補間など)を使用する必要がある場合、インターポレーターを提供する必要があります。

Flex では、spark.effects.interpolation パッケージに定義済みのインターポレーターが用意されています。

keyframes

プロパティ 
public var keyframes:Vector.<Keyframe>

言語バージョン: ActionScript 3.0
製品バージョン: Flex 4
ランタイムバージョン: Flash Player 10, AIR 1.5

アニメーション実行期間にプロパティが受け取る、時間と値のペアを表す Keyframe オブジェクトのシーケンスです。連続するキーフレームの各ペアは、それらの間の時間間隔にわたってアニメーションを制御します。後のキーフレームに関する、オプションの easer プロパティと valueBy プロパティは、その間隔にわたるビヘイビアーを決定するために使用されます。キーフレームのシーケンスは、時間の値が増加する順にソートする必要があります。

アニメーションは常に時間 = 0 から開始し、最終キーフレームの time 値に等しい継続時間にわたって実行されます。時間 = 0 においてキーフレームが定義されていない場合、そのキーフレームは暗黙的になり、アニメーション開始時のターゲットプロパティの値を使用します。

キーフレームはアニメーションに含まれる時間を明示的に定義するため、キーフレームを使用するエフェクトの継続時間は、エフェクトにある全 MotionPath の最終キーフレームの最大時間に従って設定されます。例えば、エフェクトでキーフレームが 0、500、1000、2000 の各時間に存在する場合、エフェクト自体にどのような duration プロパティが設定されているかにかかわらず、そのエフェクトでは 2000 ミリ秒が実際の継続時間になります。継続時間は最終キーフレームによって決まるため、どの MotionPath にも必ず最終キーフレームが存在する必要があります。つまり、最終キーフレームの時間が暗黙的に MotionPath の継続時間になります。

キーフレームでは、その value を未定義の状態で残すことができます(値を設定しないか、null に設定するか、NaN に設定することができます)。その場合は、アニメーションの開始時に値が動的に決定されます。未定義の値は次のように決定されます。

  1. 未定義の値が最初のキーフレームにある場合、次のキーフレームに valuevalueBy の両方のプロパティが設定されていれば、そのキーフレームから、これらの値の差として値が計算されます。それ以外の場合は、ターゲットからプロパティの現在の値が取得されます。
  2. 未定義の値が最終キーフレームにあり、アニメーションがトランジションで実行中である場合、トランジションのターゲットビューステートにある値が使用されます。
  3. それ以外の場合は、現在のキーフレームで valueBy が設定されていれば、前のキーフレームの value を使用してそれに現在のキーフレームの valueBy を追加することによって、その value が計算されます。

関連する API エレメント

property

プロパティ 
public var property:String

言語バージョン: ActionScript 3.0
製品バージョン: Flex 4
ランタイムバージョン: Flash Player 10, AIR 1.5

アニメーション化するエフェクトターゲットのプロパティの名前です。

コンストラクターの詳細

MotionPath

()コンストラクター
public function MotionPath(property:String = null)

言語バージョン: ActionScript 3.0
製品バージョン: Flex 4
ランタイムバージョン: Flash Player 10, AIR 1.5

コンストラクターです。

パラメーター
property:String (default = null) — アニメーション化するターゲットのプロパティの名前を表します。
メソッドの詳細

clone

()メソッド
public function clone():MotionPath

言語バージョン: ActionScript 3.0
製品バージョン: Flex 4
ランタイムバージョン: Flash Player 10, AIR 1.5

各キーフレームのコピーを含む、この MotionPath オブジェクトのコピーを返します。

戻り値
MotionPath — 各キーフレームのコピーを含む、この MotionPath オブジェクトのコピーです。

getValue

()メソッド 
public function getValue(fraction:Number):Object

言語バージョン: ActionScript 3.0
製品バージョン: Flex 4
ランタイムバージョン: Flash Player 10, AIR 1.5

経過時間の割合が指定されると、補間された値を計算して返します。この関数は、その割合が収まるキーフレーム間隔を特定してから、その間隔上にある境界キーフレームの値の間を対象にその間隔内を補間します。

パラメーター

fraction:Number — エフェクトの継続時間全体のうちの割合です(0.0 ~ 1.0 の値で示されます)。

戻り値
Object — 補間された値です。
KeyFrameEffectExample.mxml
<?xml version="1.0"?>
<!-- Simple example to demonstrate the s:Keyframe and s:MotionPath classes. -->
<s:Application
    xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:mx="library://ns.adobe.com/flex/mx"
    xmlns:s="library://ns.adobe.com/flex/spark">

    <fx:Declarations>
        <fx:Vector id="kf" type="spark.effects.animation.MotionPath">
            <s:MotionPath property="scaleX">
                <s:Keyframe time="250" value="0.5"/>
                <s:Keyframe time="500" value="1.0"/>
                <s:Keyframe time="750" value="0.5"/>
                <s:Keyframe time="1000" value="1.0"/> 
                <s:Keyframe time="1250" value="0.5"/>
                <s:Keyframe time="1500" value="1.0"/>
            </s:MotionPath> 
            <s:MotionPath property="scaleY">
                <s:Keyframe time="250" value="0.5"/>
                <s:Keyframe time="500" value="1.0"/>
                <s:Keyframe time="750" value="0.5"/>
                <s:Keyframe time="1000" value="1.0"/>
                <s:Keyframe time="1250" value="0.5"/>
                <s:Keyframe time="1500" value="1.0"/>
            </s:MotionPath>
        </fx:Vector>
        
        <s:Animate id="shrinkEffect"
            motionPaths="{kf}"
            target="{myImage}"/>
    </fx:Declarations>

    <s:Panel id="examplePanel"
        title="Keyframe and MotionPath Effect Example"
        width="75%" height="75%">
        <s:layout>
            <s:VerticalLayout paddingTop="10" paddingLeft="10"/>
        </s:layout>

        <!-- Directions -->
        <s:VGroup id="detailsBox" width="50%" left="0">
            <s:Label width="99%" color="blue"
                text="Click the Adobe logo to watch the effect."/>
        </s:VGroup>

        <mx:Image id="myImage" 
            source="@Embed(source='assets/logo.jpg')"
            click="shrinkEffect.end();shrinkEffect.play();"/>
    </s:Panel>
</s:Application>




[ X ]英語で表示される理由
ActionScript 3.0 リファレンスガイドのコンテンツが英語で表示されます。

ActionScript 3.0 リファレンスガイドのすべての部分がすべての言語に翻訳されているわけではありません。言語エレメントが翻訳されていない場合、そのエレメントは英語で表示されます。例えば、ga.controls.HelpBox クラスはどの言語にも訳されていません。このため、リファレンスガイドの日本語バージョンでは、ga.controls.HelpBox クラスは英語で表示されます。