レイヤーの作成と整理

レイヤーを使用すると、ドキュメント内のアートワークを整理できます。1 つのレイヤーにあるオブジェクトの描画や編集をしても、他のレイヤーのオブジェクトに影響しません。レイヤー上に何もないステージ領域では、その下にあるレイヤーを見ることができます。

レイヤーまたはフォルダーで描画、ペイントまたは修正をおこなうには、対象となるレイヤーをタイムラインで選択してアクティブにします。タイムライン内のアクティブなレイヤーやフォルダーには、名前の隣に鉛筆のアイコンが表示されます。一度に複数のレイヤーを選択することは可能ですが、同時にアクティブにできるのは 1 つのレイヤーだけです。

Animate CC(旧 Flash Professional CC)ドキュメントを新たに作成した場合、含まれるレイヤーは 1 つだけです。ドキュメント内のアートワーク、アニメーション、その他のエレメントを整理するには、レイヤーを追加します。レイヤーは、表示/非表示の切り替え、ロック/ロック解除の切り替え、並べ替えを行うことができます。作成できるレイヤー数は、コンピューターのメモリ容量によって制限されます。レイヤーを追加しても、パブリッシュされた SWF ファイルのファイルサイズが大きくなることはありません。レイヤー内にオブジェクトを配置することでのみファイルサイズが大きくなります。

レイヤーを整理および管理するには、レイヤーフォルダーを作成し、その中にレイヤーを配置します。タイムラインでは、ステージの表示内容を変更することなく、レイヤーフォルダーを開閉できます。サウンドファイル、ActionScript、フレームラベル、フレームコメント用に、それぞれ別個のレイヤーまたはフォルダーを使用します。別個のレイヤーを使用すると、各アイテムを簡単に見つけることができ、編集しやすくなります。

高度な効果を加えるには、描画や編集を簡単におこなったりマスクレイヤーを作成したりできる特殊なガイドレイヤーを使用します。

Animate では次の 5 つのタイプのレイヤーを使用できます。

  • 標準レイヤーには、fla ファイル内のほとんどのアートワークが含まれます。

  • マスクレイヤーには、下位レイヤーの選択した部分を非表示にするためのマスクとして使用するオブジェクトが含まれます。詳しくは、マスクレイヤーの使用を参照してください。

  • マスクされるレイヤーは、任意のマスクレイヤーの下にある、そのマスクレイヤーに関連付けられたレイヤーです。マスクされるレイヤーは、マスクで覆われていない部分だけが見えます。詳しくは、マスクレイヤーの使用を参照してください。

  • ガイドレイヤーには、他のレイヤー上にあるオブジェクトの配置をガイドするために使用できる線が含まれています。これは、他のレイヤー上にあるクラシックトゥイーンアニメーションのモーションをガイドするために使用することもできます。詳しくは、ガイドレイヤーおよびパスに沿ったクラシックトゥイーンモーションの作成を参照してください。

  • ガイドされるレイヤーは、ガイドレイヤーに関連付けられているレイヤーです。ガイドされるレイヤー上のオブジェクトは、ガイドレイヤー上の線に沿って配置またはアニメーション化できます。ガイドされるレイヤーには、静止アートワークとクラシックトゥイーンを含めることができますが、モーショントゥイーンを含めることはできません。

  • モーショントゥイーンレイヤーには、モーショントゥイーンでアニメーション化されたオブジェクトが含まれます。詳しくは、トゥイーンアニメーションについてを参照してください。

  • アーマチュアレイヤーには、インバースキネマティックボーンが割り当てられたオブジェクトが含まれます。詳しくは、インバースキネマティックアニメーションへのボーンツールの使用を参照してください。

標準レイヤー、マスクレイヤー、マスクされるレイヤーおよびガイドレイヤーには、モーショントゥイーンまたはインバースキネマティックボーンを含めることができます。これらのアイテムがこれらのレイヤーのいずれかに存在する場合は、レイヤーに追加できるコンテンツのタイプに制限があります。詳しくは、モーショントゥイーンおよびインバースキネマティックアニメーションへのボーンツールの使用を参照してください。

レイヤーの作成

レイヤーを作成すると、そのレイヤーは選択されたレイヤーの上に表示されます。新しく追加されたレイヤーがアクティブなレイヤーになります。

  1. 次のいずれかの操作をおこないます。
    • タイムラインの下部にある新規レイヤーボタン  をクリックします。

    • 挿入/タイムライン/レイヤーを選択します。

    • タイムラインでレイヤー名を右クリック(Windows)または Control キーを押しながらクリック(Mac OS)して、コンテキストメニューから「レイヤーを挿入」を選択します。

レイヤーフォルダーの作成

  1. 次のいずれかの操作をおこないます。
    • タイムラインでレイヤーまたはフォルダーを選択し、挿入/タイムライン/レイヤーフォルダーを選択します。

    • タイムラインでレイヤー名を右クリック(Windows)または Control キーを押しながらクリック(Mac OS)して、コンテキストメニューから「フォルダーの挿入」を選択します。選択したレイヤーまたはフォルダーの上に、新しいフォルダーが表示されます。

    • タイムラインの下部にある新規フォルダーアイコン をクリックします。選択したレイヤーまたはフォルダーの上に、新しいフォルダーが表示されます。

レイヤーとレイヤーフォルダーの整理

ドキュメントを整理するには、タイムラインのレイヤーとフォルダーを再配置します。

レイヤーフォルダーでは、ツリー構造でレイヤーを配置してワークフローを整理できます。ステージに表示されるレイヤーに影響を与えることなく、フォルダー内のレイヤーを確認するには、フォルダーを開閉します。フォルダーには、レイヤーおよび他のフォルダーを格納することができるので、コンピューターでファイルを整理するのと同じ感覚でレイヤーを整理できます。

タイムラインのレイヤーコントロールを操作すると、フォルダー内のすべてのレイヤーに反映されます。例えば、レイヤーフォルダーをロックすると、そのフォルダー内のすべてのレイヤーがロックされます。

  • レイヤーまたはレイヤーフォルダーを別のレイヤーフォルダーに移動するには、レイヤー名またはレイヤーフォルダー名を移動先のレイヤーフォルダー名にドラッグします。
  • レイヤーまたはフォルダーの順序を変更するには、タイムライン上のレイヤーまたはフォルダー(複数も可)を新しい位置にドラッグします。
  • フォルダーを開閉するには、フォルダー名の左側にある三角形をクリックします。
  • すべてのフォルダーを開閉するには、右クリック(Windows)または Control キーを押しながらクリック(Mac OS)して、「すべてのフォルダーを開く」または「すべてのフォルダーを閉じる」を選択します。

レイヤー名またはフォルダー名の変更

デフォルトでは、新しいレイヤーには作成順に名前が割り当てられます(レイヤー 1、レイヤー 2 など)。コンテンツがわかりやすい名前にするには、レイヤー名を変更します。

  1. 次のいずれかの操作をおこないます。
    • タイムラインのレイヤー名またはフォルダー名をダブルクリックして、新しい名前を入力します。

    • レイヤー名またはフォルダー名を右クリック(Windows)または Control キーを押しながらクリック(Mac OS)し、コンテキストメニューから「プロパティ」を選択します。「名前」ボックスに新しい名前を入力し、「OK」をクリックします。

    • タイムラインでレイヤーまたはフォルダーを選択し、修正/タイムライン/レイヤープロパティを選択します。「名前」ボックスに新しい名前を入力し、「OK」をクリックします。

レイヤーまたはフォルダーの選択

  1. 次のいずれかの操作をおこないます。
    • タイムラインでレイヤー名またはフォルダー名をクリックします。

    • 選択するレイヤーのタイムラインで、フレームをクリックします。

    • 選択するレイヤーに置かれたステージ上のオブジェクトを選択します。

    • 隣接するレイヤーやフォルダーを選択するには、タイムラインで Shift キーを押しながら名前をクリックします。

    • 離れているレイヤーやフォルダーを選択するには、タイムラインで Ctrl キー(Windows)または Command キー(Mac OS)を押しながら、名前をクリックします。

単一レイヤーからのフレームのコピー

  1. 1 つのレイヤー内でフレームの範囲を選択します。レイヤー全体を選択するには、タイムラインでレイヤー名をクリックします。
  2. 編集/タイムライン/フレームのコピーを選択します。

  3. ペーストを開始するフレームをクリックし、編集/タイムライン/フレームのペーストを選択します。コピーしたフレームとまったく同じ数のフレームをターゲットのタイムラインで置き換えるには、「フレームをペーストして上書き」オプションを使用します。

    Overwrite_frames_process_1
    フレームをペーストして上書きのワークフロー

    A. フレームを選択してコピーします。 B. ペースト先のフレームを右クリックして、「フレームをペーストして上書き」を選択します。 C. タイムライン上の同じ数のフレームが、ペーストされたフレームによって上書きされます。 

レイヤーフォルダーからのフレームのコピー

  1. フォルダー全体を選択するには、フォルダーを折りたたみ(タイムライン内のフォルダー名の左側にある三角形をクリック)、フォルダー名をクリックします。 

  2. 編集/タイムライン/フレームのコピーを選択します。

  3. 挿入/タイムライン/レイヤーフォルダーを選択して、フォルダーを作成します。

  4. 作成したフォルダーをクリックし、編集/タイムライン/フレームのペーストを選択します。

レイヤーまたはフォルダーの削除

  1. レイヤーまたはフォルダーを選択するには、タイムラインのレイヤーまたはフォルダーの名前をクリックするか、レイヤー内の任意のフレームをクリックします。
  2. 次のいずれかの操作をおこないます。
    • タイムラインのレイヤーの削除ボタンをクリックします。

    • 削除するレイヤーまたはフォルダーをレイヤーの削除ボタンまでドラッグします。

    • レイヤー名またはフォルダー名を右クリック(Windows)または Control キーを押しながらクリック(Mac OS)して、コンテキストメニューから「レイヤーを削除」を選択します。

    注意:

    レイヤーフォルダーを削除すると、フォルダー内のレイヤーおよびそのコンテンツもすべて同時に削除されます。

レイヤーまたはフォルダーのロックまたはロック解除

  • レイヤーまたはフォルダーをロックするには、名前の右側にあるカギアイコンの列をクリックします。レイヤーまたはフォルダーのロックを解除するには、カギアイコンの列を再度クリックします。

  • すべてのレイヤーとフォルダーをロックするには、カギのアイコンをクリックします。すべてのレイヤーとフォルダーのロックを解除するには、カギのアイコンを再度クリックします。

  • 複数のレイヤーまたはフォルダーをロックまたはロック解除するには、カギアイコンの列をドラッグします。

  • 他のすべてのレイヤーまたはフォルダーをロックするには、カギアイコンの列を Alt キーを押しながらクリック(Windows)するか、Option キーを押しながらクリック(Mac OS)します。すべてのレイヤーまたはフォルダーのロックを解除するには、もう一度、カギアイコンの列を Alt キーを押しながらクリック(Windows)するか、Option キーを押しながらクリック(Mac OS)します。

レイヤーのコピー&ペースト(CS5.5 のみ)

タイムライン内のレイヤー全体およびレイヤーフォルダー全体をコピーして、同じタイムラインや別のタイムラインにペーストできます。どのタイプのレイヤーでもコピーできます。

レイヤーをコピー&ペーストすると、コピーされたレイヤーのレイヤーフォルダー構成が保存されます。

  1. レイヤー名をクリックして、タイムライン内のレイヤーを選択します。連続するレイヤーを選択するには、Shift キーを押しながらクリックします。連続していない複数のレイヤーを選択するには、Ctrl キー(Windows)または Command キー(Mac OS)を押しながらクリックします。

  2. 編集/タイムライン/レイヤーをコピーまたはレイヤーをカットを選択します。レイヤーを右クリックし、コンテキストメニューから「レイヤーをコピー」または「レイヤーをカット」を選択することもできます。

  3. ペースト先のタイムライン内で、レイヤーをペーストする位置のすぐ下のレイヤーを選択します。

  4. 編集/タイムライン/レイヤーをペーストを選択します。

タイムライン内の選択したレイヤーの上に、ペーストしたレイヤーが表示されます。レイヤーフォルダーを選択した場合は、ペーストしたレイヤーはフォルダーの内部に表示されます。

レイヤーをマスクレイヤーまたはガイドレイヤー内に配置するには、最初にマスクレイヤーまたはガイドレイヤーの下のレイヤーを選択してから、ペーストをおこなう必要があります。マスクレイヤーまたはガイドレイヤーの下には、マスクレイヤー、ガイドレイヤーおよびフォルダーレイヤーはペーストできません。

また、レイヤーを選択し、編集/タイムライン/レイヤーを複製を選択して、レイヤーを複製することもできます。複製したレイヤーのレイヤー名には「コピー」の文字が付加されます。

複数のレイヤーへのプロパティの設定

  1. Animate CC で、FLA ファイルを作成するか、既存の FLA ファイルを開きます。

  2. 変更するプロパティのあるレイヤーを複数選択し、右クリックして「プロパティ」を選択します。

  3. レイヤープロパティダイアログで、プロパティを変更します。

  4. OK」をクリックします。

レイヤーまたはフォルダーの表示または非表示

タイムラインでレイヤー名やフォルダー名の横に赤の × が表示されている場合、そのレイヤーまたはフォルダーは非表示になっています。パブリッシュ設定で、SWF ファイルをパブリッシュするとき、非表示レイヤーを含めるかどうかを選択することができます。

  • レイヤーまたはフォルダーを非表示にするには、タイムラインでレイヤー名またはフォルダー名の右にある目のアイコンの列をクリックします。そのレイヤーまたはフォルダーを表示するには、再度クリックします。

  • タイムラインのすべてのレイヤーおよびフォルダーを非表示にするには、目のアイコンをクリックします。すべてのレイヤーとフォルダーを表示するには、目のアイコンをもう一度クリックします。

  • 複数のレイヤーまたはフォルダーを表示または非表示にするには、目のアイコンの列全体をドラッグします。

  • 現在のレイヤーまたはフォルダー以外のレイヤーおよびフォルダーをすべて非表示にするには、Alt キー(Windows)または Option キー(Mac OS)を押しながら、目のアイコンの列をクリックします。すべてのレイヤーおよびフォルダーを表示するには、再度 Alt キーまたは Option キーを押しながらクリックします。

アウトラインによるレイヤーのコンテンツの表示

オブジェクトがどのレイヤーに属しているかを区別するには、1 つのレイヤーにあるすべてのオブジェクトを、カラー付きのアウトラインで表示します。

  • レイヤーにあるすべてのオブジェクトをアウトラインで表示するには、そのレイヤー名の右にあるアウトラインの列をクリックします。アウトライン表示を無効にするには、アウトラインの列を再度クリックします。

  • すべてのレイヤーにあるオブジェクトをアウトラインで表示するには、アウトラインアイコンをクリックします。すべてのレイヤーのアウトライン表示を無効にするには、アウトラインアイコンを再度クリックします。

  • 現在のレイヤーを除くすべてのレイヤーのオブジェクトをアウトラインとして表示するには、Alt キー(Windows)または Option キー(Mac OS)を押しながら、アウトラインの列をクリックします。すべてのレイヤーのアウトライン表示を無効にするには、Alt キーまたは Option キーを押しながら、アウトラインの列を再度クリックします。

注意:

レイヤー上のモーションパスもレイヤーのアウトラインカラーを使用します。

レイヤーのアウトラインカラーの変更

  1. 次のいずれかの操作をおこないます。
    • タイムラインで、レイヤー名の左にあるアイコンをダブルクリックします。

    • レイヤー名を右クリック(Windows)または Control キーを押しながらクリック(Mac OS)し、コンテキストメニューから「プロパティ」を選択します。

    • タイムラインでレイヤーを選択し、修正/タイムライン/レイヤープロパティを選択します。

  2. レイヤープロパティダイアログで、「アウトラインカラー」パレットをクリックし、新しいカラーを選択してから「OK」をクリックします。

レイヤーとレイヤーフォルダーの表示

レイヤーまたはフォルダーの表示または非表示

タイムラインでレイヤー名やフォルダー名の横に赤の × が表示されている場合、そのレイヤーまたはフォルダーは非表示になっています。パブリッシュ設定で、SWF ファイルをパブリッシュするとき、非表示レイヤーを含めるかどうかを選択することができます。

  • レイヤーまたはフォルダーを非表示にするには、タイムラインでレイヤー名またはフォルダー名の右にある目のアイコンの列をクリックします。そのレイヤーまたはフォルダーを表示するには、再度クリックします。

  • タイムラインのすべてのレイヤーおよびフォルダーを非表示にするには、目のアイコンをクリックします。すべてのレイヤーとフォルダーを表示するには、目のアイコンをもう一度クリックします。

  • 複数のレイヤーまたはフォルダーを表示または非表示にするには、目のアイコンの列全体をドラッグします。

  • 現在のレイヤーまたはフォルダー以外のレイヤーおよびフォルダーをすべて非表示にするには、Alt キー(Windows)または Option キー(Mac OS)を押しながら、目のアイコンの列をクリックします。すべてのレイヤーおよびフォルダーを表示するには、再度 Alt キーまたは Option キーを押しながらクリックします。

アウトラインによるレイヤーのコンテンツの表示

オブジェクトがどのレイヤーに属しているかを区別するには、1 つのレイヤーにあるすべてのオブジェクトを、カラー付きのアウトラインで表示します。

  • レイヤーにあるすべてのオブジェクトをアウトラインで表示するには、そのレイヤー名の右にあるアウトラインの列をクリックします。アウトライン表示を無効にするには、アウトラインの列を再度クリックします。

  • すべてのレイヤーにあるオブジェクトをアウトラインで表示するには、アウトラインアイコンをクリックします。すべてのレイヤーのアウトライン表示を無効にするには、アウトラインアイコンを再度クリックします。

  • 現在のレイヤーを除くすべてのレイヤーのオブジェクトを表示するには、Alt キー(Windows)または Option キー(Mac OS)を押しながら、アウトラインの列をクリックします。すべてのレイヤーのアウトライン表示を無効にするには、Alt キーまたは Option キーを押しながら、アウトラインの列を再度クリックします。

  1. 次のいずれかの操作をおこないます。
    • タイムラインで、レイヤー名の左にあるアイコンをダブルクリックします。

    • レイヤー名を右クリック(Windows)または Control キーを押しながらクリック(Mac OS)し、コンテキストメニューから「プロパティ」を選択します。

    • タイムラインでレイヤーを選択し、修正/タイムライン/レイヤープロパティを選択します。

  2. レイヤープロパティダイアログで、「アウトラインカラー」パレットをクリックし、新しいカラーを選択してから「OK」をクリックします。

高度なレイヤーの使用

Animate CC で高度なレイヤーモードを使用すると、タイムライン内のすべてのレイヤーはシンボルとしてパブリッシュされます。高度なレイヤーモードでは、次の機能にアクセスすることができます。

高度なレイヤーモードは、デフォルトで有効になっています。変更/ドキュメント設定を使用して高度なレイヤーを有効または無効にできます。変更を適用した後でデフォルトにするを選択し、後続のドキュメントや Animate セッション全体で現在の設定を保持します。

高度なレイヤーモード
高度なレイヤーモード

Animate のスクリプトでこれらのシンボルにアクセスする際は、レイヤーをオブジェクトとして使用して、それらのシンボルを呼び出す必要があります。例えば、高度なレイヤーを使用していない場合、次のサンプルのようなスクリプトを使用して、シンボルに直接アクセスできます。

getchildbyname("symbol1");

一方、高度なレイヤーを使用する場合、次のサンプルのようなスクリプトを使用し、レイヤーを介してシンボルにアクセスする必要があります。

Layer=getchildbyname("L1");

Layer.getchildbyname("symbol1");

高度なレイヤーを使用してシンボルにアクセスするサンプルコード(ドキュメントタイプが AS3 の場合):

Var Layer:MovieClip =MovieClip(getchildbyname("L1"));
Layer.getchildbyname("symbol1");

高度なレイヤーを使用してシンボルにアクセスするサンプルコード(ドキュメントタイプが HTML5 Canvas の場合):

Layer=this.getchildbyname("L1");
Layer.getchildbyname("symbol1");

次の図は、高度なレイヤーを使用する場合と使用しない場合について、スクリプトでシンボルにアクセスする方法を示しています。 

高度なレイヤーを使用する場合と使用しない場合のシンボルへのアクセス方法を示した図
高度なレイヤーを使用する場合と使用しない場合のシンボルへのアクセス方法を示した図

注意:

Animate で高度なレイヤーを使用すると、パブリッシュしたアニメーションプロジェクトのサイズが大きくなる場合があります。カメラまたレイヤー深度機能にアクセスできない場合は、高度なレイヤーがオンになっていることを確認してください。無効になっている場合、有効化して期待する動作を実現します。 

レイヤー効果の適用

フィルターとカラー効果はムービークリップのみに適用されます。高度なレイヤーを使用すると、フィルターやカラー効果を選択したフレームに適用できるようになりました。これにより、シェイプ、描画オブジェクト、グラフィックシンボルプなどを含むすべてのコンテンツに適用できます。レイヤー効果は、複数のテキストフレームでクラシック、シェイプ、および IK トゥイーンを使用してトゥイーンすることもできます。

目的のフレームを選択して、個別または複数のフレームにレイヤー効果を適用できます。また、レイヤー全体を選択してレイヤーのすべてのフレームでレイヤー効果を適用することもできます。レイヤー効果は、シンボルのタイムライン(ムービークリップやグラフィックシンボルなど)で適用したり、、およびすべてのシーンにわたって適用したりすることもできます。

注意:

レイヤー効果は高度なレイヤーモードがオンになっている場合にのみ適用できます。この機能を使用するには、ファイルに対して高度なレイヤーモードを明示的に有効にする必要があります。

フレームにフィルターの使用

特定のフレームにフィルターを適用するには、最初にフレームを選択します。プロパティインスペクターパネルは、フレーム固有のプロパティを読み込みます。フィルタードロップダウンリストの+アイコンをクリックします。

フレームフィルター
フレームフィルター

フレームでフィルターを適用すると、プロパティインスペクターは、次のスクリーンショットのように表示されます。 

要件に応じて、フィルターごとにプロパティを設定して、フレームレベルで適用できます。トゥイーンは、すべてのフレームフィルターに適用されます。 

プロパティインスペクターのフレームフィルタープロパティ
プロパティインスペクターのフレームフィルタープロパティ

注意:

レイヤー効果は ActionScript3 ドキュメントタイプでのみサポートされます。モーショントゥイーンとカメラレイヤーはレイヤー効果をサポートしていません。 

カラー効果の使用

特定のフレームにカラーエフェクトを適用するには、最初にフレームを選択します。プロパティインスペクターパネルは、フレームの固有のプロパティを読み込みます。プロパティインスペクターパネルから希望するカラープロパティを選択します。

カラー効果
カラー効果

レイヤー深度を適用

アニメーターは、2D アニメーションの異なるプレーンにレイヤーを配置して、深度を表現することができます。 

レイヤー深度パネルを使用して、レイヤーの深度を動的に変更することができます。レイヤー深度を開くには、ウィンドウ/レイヤー深度をクリックします。

各レイヤーを表すレイヤー深度
各レイヤーを表すレイヤー深度

注意:

レイヤー深度の最小値と最大値を -5000 ~ 10000 の範囲内で設定できます。

上のスクリーンショットに示すように、レイヤー深度値は、特定のフレームの各レイヤー名の横に表示されます。

  • それぞれの値にマウスポインターを合わせ、クリックして、スライダーを右または左にドラッグします。
  • 深度を減らすには、スライダーを左にドラッグします。深度を増やすには、スライダーを右にドラッグします。 
  • 小さい正の値にすると近くにあるオブジェクト、大きい正の値にすると離れた位置にあるオブジェクトを表現できます。

レイヤー深度値は、作業しているアニメーションのいずれかのトゥイーンスパンでトゥイーンできます。 

レイヤー深度パネルでは、各レイヤーがそれぞれ異なる色付きの線で表されます。各レイヤーを表す色は、タイムラインで確認できます。 

色分けされた線を上下に移動して、各レイヤーのオブジェクトの深度を増減させることもできます。

  • レイヤー上のオブジェクトの深度を減らすには、そのレイヤーの線をクリックして上方向にドラッグします。
  • レイヤー上のオブジェクトの深度を増やすには、そのレイヤーの線をクリックして下方向にドラッグします。

レイヤー深度を適用したアニメーションと適用していないアニメーションを以下に示します。

レイヤー深度を適用していない場合
レイヤー深度を適用していない場合
レイヤー深度を適用した場合
レイヤー深度を適用した場合

レイヤー深度を適用したアニメーションを示す図:

カメラをマルチプレーンレイヤーで使用して、パララックスエフェクトを作成したり、プレーン上のコンテンツにズームしたりすることができます。また、カメラを特定のレイヤーにロックしたり、インタラクティブ API を使用して実行時にカメラエフェクトを適用したりすることもできます。詳しくは、カメラとレイヤー深度を使用したパララックスエフェクトの作成を参照してください。

注意:

レイヤー深度はメインタイムライン上でのみ使用できます。

レイヤー深度のサイズを保持

オブジェクトのサイズや位置に影響を与えずに、オブジェクトのレイヤー深度を変更できます。サイズ保持機能を使用にするには、レイヤー深度パネルの右上隅の「サイズを保持」ボタンをクリックします。

「サイズを保持」オプションは、2 つのモードで使用できます。

  • サイズを保持」ボタンをクリックし、目的のレイヤー深度を変更します。「サイズを保持」ボタンは自動で切り替わります。
  • Alt キーを押しながらレイヤー深度の値をドラッグすると、「サイズを保持」オプションが一時的に有効になります。
レイヤー深度のサイズを保持
レイヤー深度のサイズを保持

実行時でのレイヤー深度の適用

カメラ API を使用すると、実行時にオブジェクトにカメラを導入したり、エフェクトを適用したりすることもできます。詳しくは、実行時のインタラクティブカメラの使用を参照してください。

AS3 のレイヤー深度 API

API を使用して実行時にレイヤーを管理できます。例えば、実行時に、アニメーションに追加のレイヤーを導入したい場合や、アニメーションに含まれているいずれかのレイヤーの深度を減らしたい場合があります。 

メソッド プロトタイプ 説明
setLayerZDepth fl.Layer.setLayerZDepth(timeline,
layerName,zDepth)
fl.Layer.setLayerZDepth("layerName", 100); 特定のレイヤーの Z 深度の値を設定します。
getLayerZDepth fl.Layer.getLayerZDepth(layerName) : zDepth fl.Layer.getLayerZDepth("layerName"); 特定のレイヤーの Z 深度の値を返します。
addNewLayer fl.Layer.addNewLayer(layerName,
zDepth=0)
fl.Layer.addNewLayer("layerName",-80); 新規レイヤーをタイムラインに追加し、Z 深度を設定します。
removeLayer fl.Layer.removeLayer(layerName) fl.Layer.removeLayer("layerName"); タイムラインからレイヤーを削除します。

HTML カンバスのレイヤー深度 API

メソッド プロトタイプ 説明
setLayerZDepth AdobeAn.Layer.setLayerZDepth(layerName,
zDepth)
console.log(fl.Layer.setLayerZDepth
("layerName", 100));
特定のレイヤーの Z 深度の値を設定します。
getLayerZDepth AdobeAn.Layer.getLayerZDepth(layerName)
:zDepth
console.log(fl.Layer.getLayerZDepth
("layerName"));
特定のレイヤーの Z 深度の値を返します。

レイヤーのペアレンティング

Animate を使用すると、あるレイヤーを別のレイヤーの親にすることができます。レイヤーのペアレンティングを使用すると、アニメーションの 1 つのレイヤー/オブジェクトで他のレイヤー/オブジェクトを簡単に制御できます。アニメーションデザイナーやゲームデザイナーは、キャラクターの様々な部分の動きを制御できるので、アニメーション時間を高速化できます。

レイヤーのペアレンティングビューでは、高度なレイヤーを有効にする必要があります。デフォルトでは、新しいファイルに対して高度なレイヤーがオンになっています。タイムラインの左上隅にある階層シンボルアイコンをクリックすることで、レイヤーのペアレンティングビューを有効にできます。

レイヤーのペアレンティングを表示
レイヤーのペアレンティングを表示

注意:

ワープしたオブジェクトのペアレンティングは、子レイヤーオブジェクトの変形点がペアレンティングレイヤーオブジェクト上にある場合のみ機能します。

親レイヤーと子レイヤー

ペアレンティングビューでは、レイヤー 1 を レイヤー 2 の上に移動すると、レイヤー 1 が親であるレイヤー 2 の子になります。子レイヤーのオブジェクトは、独自のプロパティを保持するのとは別に、親レイヤーのオブジェクトの位置と回転を継承します。そのため、親を移動または回転すると、子も親に連動して移動または回転します。複数の親子関係を作成して階層を作成できます。

レイヤーのペアレンティング

レイヤーハンドル(カラーヘッド)をクリックして、他のレイヤー上にドラッグすることで、1 つのレイヤーを別のレイヤーに接続できます。また、レイヤー名の隣にある横長のスペースで任意の場所をクリックし、他のレイヤーにドラッグできます。また、どれか1 つのレイヤーをクリックするか、ポップアップリストから親レイヤーを選 択できます。 

線をクリックしてドラッグしようとするとすぐに、レイヤーのカラーヘッドのそばに点線が表示されます。クリック&ドラッグ操作を放すとすぐに、2 つのレイヤー間の親子接続が確立します。

親レイヤーを設定
親レイヤーを設定

レイヤーのペアレンティングビュー階層の一番左のカラーヘッドは、親を表します。親子階層は、左から右に移動します。

レイヤーのカラーヘッドをクリックし、点線をドラッグしてからリリースすることで、接続を削除することもできます。また、横長のスペースをクリックして、以下のスクリーンショットのように、親を削除をクリックできます。

親を削除
親を削除

下図では、レイヤーのペアレンティングを使用する前と後のレイヤー階層と位置の表示を確認できます。

レイヤーのペアレンティングの前と後
レイヤーのペアレンティングの前と後

次に、人間のボディパーツ用のレイヤーのペアレンティングの使用を表すサンプル図を示します。

レイヤーのペアレンティングを使用したボディパーツのサンプル図
レイヤーのペアレンティングを使用したボディパーツのサンプル図

上図では、次のようになります。

  • Torso(胴体)は、ボディのすべてのパーツの親。
  • Legs_thigh(太もも)は、Sneaker(スニーカー)、Leg_lower(下脚)、Ankle(足首)など、その他の様々なパーツの親。
  • Head(頭)は、親である Neck(首)の子で、Torso は Neck の親。そのため、ボディから離れて首を動かすといつでも、頭部も連動して動きます。

注意:

ペアレンティングは、子レイヤーの各キーフレームに対して設定する必要のあるフレームプロパティです。キーフレーム上で、子レイヤーを解除して他の親レイヤーに再設定できます。

レイヤーのペアレンティングのチュートリアル

レイヤーのペアレンティングのチュートリアル
レイヤー間に親子階層構造を作成し、簡単に構成を操作する方法を学びます。

レイヤーのアウトラインカラーの変更

注意:

レイヤー上のモーションパスもレイヤーのアウトラインカラーを使用します。

レイヤーの透明部分の設定

  1. Animate CC で、fla ファイルを作成するか、既存の fla ファイルを開きます。

  2. タイムラインにある目のアイコンの列で Shift キーを押しながらクリックして、可視性を透明に設定します。

    注意:

    Shift キーを押しながらクリックしても、非表示レイヤーには影響しません。

    レイヤーの透明部分の設定
    レイヤーの透明部分の設定
  3. 次のいずれかのオプションを使用して、レイヤーの透明度を設定します。

    • 任意のレイヤーを右クリックし、コンテキストメニューから「プロパティ」を選択します。レイヤープロパティダイアログで、可視性/透明を選択します。
    • 任意のレイヤーを右クリックし、「その他の透明を表示」を選択します。
    レイヤープロパティ
    レイヤープロパティ
  4. OK」をクリックします。

注意:

レイヤーの透明度は、非表示レイヤーには影響しません。 

本作品は Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License によってライセンス許可を受けています。  Twitter™ および Facebook の投稿には、Creative Commons の規約内容は適用されません。

法律上の注意   |   プライバシーポリシー