モーション パスを作成、変更、または削除するには

  • [アーティクル]

このページは WPF プロジェクトにのみに適用

[モーション パスに変換] ツールを使用してターゲット オブジェクトがアートボード上のパスを移動するように指定することで、アニメーション タイムラインを自動的に生成できます。アートボード上のパスは、直線でも図形 (楕円や四角形など) でもかまいません。この後、軌跡、繰り返し回数、パスに対するオブジェクトの向きを変更することで、モーション パスを変更できます。

モーション パスを作成するには

  1. モーション パスを移動するオブジェクトを作成していない場合は、オブジェクトを作成して名前をつけます(移動するオブジェクトは必ずしも先に作成する必要はありませんが、作成しておいたほうが後の手順が簡単になります。また、オブジェクトに名前を付ける必要もありませんが、名前を付けておくと、[モーション パスに変換] ツールの使用手順の中でオブジェクトを簡単に特定できます)。

    tip noteヒント :

    モーションパスを複数のオブジェクトに適用する場合は、オブジェクトをパネル オブジェクトにグループ化した後、パネルに対してモーション パスを適用します。オブジェクトをグループ化するには、[オブジェクトとタイムライン] パネルで ( Ctrl キーを押しながら) 複数のオブジェクトをクリックし、選択したオブジェクトを右クリックし、[グループ化設定] をポイントし、目的のパネルの種類を選択します。

  2. モーション パス タイムラインを追加するストーリーボードがある場合は、[オブジェクトとタイムライン] の [ストーリーボードを開く] ボタン Cc295124.d4531c86-5048-481c-a1ca-29af202d28e7(ja-jp,Expression.40).png をクリックして、表示された一覧から目的のストーリーボードを選択します。それ以外の場合は、[新規作成] Cc295124.86937695-03dd-44ea-aa30-28d4029b3ad0(ja-jp,Expression.40).png をクリックし、新しい名前を付けて、新しいタイムラインを作成します。

  3. モーション パスを開始する位置まで、再生ヘッド Cc295124.5626c9eb-40bb-450a-9ca1-3678e5abe429(ja-jp,Expression.40).png を移動します。

    Noteメモ :

    アプリケーションに既存のストーリーボードがあるときに、ストーリーボードを選択しないでモーション パスを作成すると、作成したモーション パスはストーリーボード ピッカーの最初のタイムラインに追加されます。アプリケーションにストーリーボードがない場合は、モーション パスを作成すると、既定の名前を持つストーリーボードが作成されます。

  4. [ツール] パネルから、オブジェクトが移動するパスを生成できる描画ツールを選択します。

    • オブジェクトを円形または四角形の軌跡を描くように動かす場合は、EllipseCc295124.8938cfdf-9b75-4a33-bc88-b0636e114a0d(ja-jp,Expression.40).png または RectangleCc295124.81ffc148-cf5c-4faf-bd3f-f38d3073a12c(ja-jp,Expression.40).png を選択します。アートボード上の図形を変更するには、[選択内容] ツール Cc295124.2ff91340-477e-4efa-a0f7-af20851e4daa(ja-jp,Expression.40).png を使用して、オブジェクトの周囲に表示される青いガイドをドラッグするか、[プロパティ] パネルの [変換] カテゴリのプロパティを変更します。

      tip noteヒント :

      既定では、モーション パスは四角形の左上隅または楕円の右側から始まります。別の地点から開始する場合は、図形を回転してから、モーション パスを作成します。さらに、モーション パスは時計回りに使用されるので、反時計回りに使用する場合は、図形を反転 ([オブジェクト] メニューの [反転] をポイント) してから、モーション パスを作成します。

    • オブジェクトを描画したパスに沿って動かす場合は、[ペン] Cc295124.894f8612-e0ed-4e00-84cf-a9bc8f38fc54(ja-jp,Expression.40).png または [鉛筆] Cc295124.509dc167-734f-46c9-b012-987ee63450cd(ja-jp,Expression.40).png を使用します。描画したパスを変更するには、[個別選択] Cc295124.6dd6571f-c116-451d-8dd2-1f88b8406362(ja-jp,Expression.40).png を使用して個々の点を移動します。

      tip noteヒント :

      既定では、モーション パスは、描画したパスの起点 (最初の点) から始まります。

  5. パス オブジェクトをアートボード上に描画します。

    tip noteヒント :

    ペン、複合パス、およびクリッピング ツールを使用して、複雑な図形とパスを作成できます。

    詳細については、次のトピックを参照してください。

  6. [オブジェクトとタイムライン] パネルでパス オブジェクトを選択した状態で、[プロパティ] パネルの [ブラシ] カテゴリの [Fill] プロパティを [ブラシなし] Cc295124.706bbd5c-c0e0-43a1-9604-297f019d0275(ja-jp,Expression.40).png に設定し、[Stroke] プロパティを [単色ブラシ] Cc295124.3a66ec96-47bb-47fc-8876-6b9456feec3a(ja-jp,Expression.40).png に設定します。この手順は必須ではありませんが、実行すると、パス オブジェクトの輪郭が明確になります。

  7. [オブジェクトとタイムライン] パネルでパス オブジェクトを選択したまま、[オブジェクト] メニューの [パス] をポイントし、[モーション パスに変換] をクリックします。

    [エクスポート] ダイアログ ボックスが表示されます。

  8. モーション パスのターゲットは、移動するオブジェクトです。一覧から移動するオブジェクトの名前を選択し、[OK] をクリックします。

    Noteメモ :

    [オブジェクトとタイムライン] パネルで移動するオブジェクトに名前を付けていない場合は、[モーション パスに変換] ダイアログ ボックスには、オブジェクトの種類が表示されます。モーション パスを作成すると、移動するオブジェクトには、自動的に名前が付けられます。これは、アプリケーション内でオブジェクトを参照するには名前が必要であるためです。

    [OK] をクリックすると、オブジェクトの移動経路を表すモーション パス タイムラインが生成されます。タイムラインは、開いているストーリーボードまたは新規作成したストーリーボードに追加されます。

  9. この時点で、モーション パスを生成するために使用した図形または描画パスはタイムラインの一部ではないので、それらを削除できます。

  10. モーション パスの再生時間を変更するには、[オブジェクトとタイムライン] パネルで、移動するオブジェクトのノードを順に展開して [モーション パス] ノードを表示し、タイムラインで、灰色のタイムスパン バーの末端にある青色のバーをドラッグします。モーション パスの繰り返し回数を変更することもできます。

    例については、「ループの設定」を参照してください。

  11. [再生] Cc295124.64ad8e84-1eec-4154-9d0c-11fef322c0bf(ja-jp,Expression.40).png をクリックして、新しいモーション パスをテストします。

モーション パスの軌跡を変更するには

  1. モーション パスを含むストーリーボードを開きます。

    詳細については、「ストーリーボードを開くまたは閉じる」を参照してください。

  2. [ツール] パネルの [個別選択] Cc295124.2ff91340-477e-4efa-a0f7-af20851e4daa(ja-jp,Expression.40).png をクリックします。

  3. [オブジェクトとタイムライン] パネルで、移動するオブジェクトをクリックします。点 (頂点) を持つ破線がアートボード上に表示されます。この破線はモーション パスを表します。

  4. 次のいずれかの方法でパスを変更します。

    • 点をドラッグします。

    • [ペン] Cc295124.894f8612-e0ed-4e00-84cf-a9bc8f38fc54(ja-jp,Expression.40).png をクリックした後、破線をクリックして、パスに新しいポイントを追加します。

    • 2 点を結ぶ曲線をドラッグして、曲線を移動します。

    • Alt キーを押しながらカーブをドラッグして、2 つの点を結ぶカーブの形状を変更します。

    • パスを変換 (反転) させてアニメーションの方向を反転させます。

    • 点をクリックして接線のエンドポイントのいずれかをドラッグします。

    Cc295124.d91d85ca-603a-4451-8870-7dab7077028d(ja-jp,Expression.40).png

    パス変更機能の詳細については、「個別選択ツールの修飾キー」および「ペン ツールの修飾キー」を参照してください。

モーション パスの再生時間を変更するには

  1. [オブジェクトとタイムライン] パネルで、移動するオブジェクトのノードを順に展開して、[モーション パス] ノードを表示します。

  2. タイムラインで、灰色のタイムスパン バーの末端にある青色のバーをドラッグします。モーション パスの繰り返し回数を変更することもできます。

    例については、「ループの設定」を参照してください。

移動するオブジェクトの向きをパスに合わせるには

  1. [オブジェクトとタイムライン] パネルで、移動するオブジェクトのノードを順に展開して、[モーション パス] ノードを表示します。

  2. [モーション パス] ノードを右クリックし、[パスの方向] をクリックします。

モーション パスを削除するには

  • ストーリーボードにあるタイムラインがモーション パスだけである場合は、ストーリーボードを削除できます。

    詳細については、「ストーリーボードの作成、変更、または削除」を参照してください。

  • ストーリーボードの中にモーション パス以外のタイムラインがある場合は、モーション パス タイムラインだけを削除できます。[オブジェクトとタイムライン] パネルで、移動するオブジェクトのノードを順に展開して、[モーション パス] ノードを表示し、Del キーを押します。

関連項目

タスク

パス上の点の追加または削除

Copyright ©2011 by Microsoft Corporation. All rights reserved.