国慶節の休暇中は何もすることがなく、家でテクノロジーの勉強をしています~
前回の記事では、アニメーション編集、アニメーション コンポーネント、および基本的な使用プロセスを紹介しました。興味のある方は、「CocosCreator アニメーション システム - アニメーション編集とアニメーション コンポーネントの概要」を参照してください。
今回はアニメーションエディタに関する機能パネルの説明を中心に紹介します。
1. ツールバーエリア
ツールバー領域には主に、アニメーションの再生、一時停止、停止、アニメーションの保存、編集の終了など、一般的に使用される機能がいくつか含まれています。
2. ノードリスト
ノードリストは主にコンポーネントのノードを表示し、アニメーションコンポーネントに複数のノードが含まれる場合、最上位の階層がルートノードとして階層マネージャーのノードツリーと1対1に対応して表示されます。
をクリックすると、
ボタンを使用してアニメーション データのないノードを表示/非表示にするか、入力ボックスにノード名を直接入力してノードをすばやく見つけます。
現在、ノードを右クリックして、ノード データをコピー、貼り付け、移行、およびクリアできます。
3. プロパティリストエリア
この領域は主に、現在のアニメーション クリップで現在選択されているノードのアニメーション属性を表示、追加、設定するために使用されます。
右上隅の+ボタンをクリックしてアニメーション属性を追加します。アニメーション属性には、ノード独自の属性とコンポーネント属性 (ユーザー定義のスクリプト コンポーネントの属性を含む) が含まれます。
コンポーネントに含まれるプロパティの前には、コンポーネントの名前が付けられます (例: ) cc.Label
。
アニメーション アトリビュートを右クリックして、現在のアトリビュート トラックを削除するか、キーフレームをクリアするか、現在のアトリビュート トラックをコピーして貼り付けるかを選択します。
4.アニメーションタイムラインとキーフレームエリア
(1)、アニメーションタイムライン
アニメーション タイムラインは主に、現在のノードによって追加されたすべてのアニメーション プロパティの表示、キーフレーム (ダイヤモンド) の設定、およびプレビューの表示に使用されます。
(2) 時間制御線
時間制御線 (青い縦線) は、現在のアニメーションの時間ノードを示します。現在選択されている時間は、次の方法で変更できます。
-
時間制御線を直接ドラッグします。
-
キーフレームをダブルクリックします
-
メニュー ツールバーで関連するモバイル コントロール ボタンを使用する
-
ショートカットキーkを使用する
-
アニメーション タイムラインの上の領域をクリックします。
タイム コントロール ラインを移動すると、シーン エディタ内のノードもアニメーションの軌跡に従って移動します。
(3) 時間軸のスケール単位の表示
タイム スケール単位のドロップダウン ボタンを使用して、アニメーション タイムラインのスケール表示モードを切り替えることができます。
タイムスケール単位を使用するには、次の 3 つの方法があります。
-
時間(混合)
時間: 混合 (デフォルト): アニメーションのタイムラインのスケールを秒単位で表示し、フレームを組み合わせて表示します。入力ボックスの前の値は秒を表し、その後ろの値はフレームを表します。たとえば、
0-12
0 秒と 12 フレームを表します。
-
フレーム
アニメーション タイムラインのスケールをフレーム単位で表示します。
-
時間
アニメーションのタイムラインのスケールを秒単位で表示します。
一般に、1 秒を何フレームに分割するかを示すためにフレーム レート (サンプル) が使用されます。
(4)、アニメーションのタイムラインのスケーリングと移動
アニメーションタイムラインおよびアニメーション属性キーフレームプレビューの任意の領域でマウスホイールを回転させると、タイムラインの横方向の表示比率を拡大または縮小できます。
アニメーション タイムラインおよびアニメーション属性キーフレーム プレビューの任意の位置でマウスの右ボタンを押し、タイムライン表示領域を左右にドラッグすると、非表示のコンテンツが左右に表示されます。
5. アニメーション属性キーフレーム領域
この領域は主に、現在選択されているノードの各アニメーション アトリビュートの特定のキーフレーム設定を表示するために使用され、キーフレーム編集のメイン領域でもあります。
右側のアニメーション プロパティを右クリックしてキーフレームを追加できます。
同時に、この領域ではフレームの選択やキーフレームをクリックして、移動、コピー、貼り付けなどの操作を実行することもできます。
クリックしてキーフレームを選択すると、キーフレームが青から白に変わり、現在のキーフレームの関連情報がエリアの上に表示されます。キーフレームをダブルクリックすると、時間制御線も現在のキーフレームの位置に移動します。
6. 現在のアニメーション クリップの関連プロパティを設定します。
アニメーション エディタで直接設定できる現在のアニメーション クリップのプロパティには、ループ モード( WrapMode )、フレーム レート (Sample)、再生速度 (Speed) および継続時間 (Duration)が含まれます。
(1)、ループモード(WrapMode)
現在のアニメーション クリップ再生のループ モードを設定するために使用されます。現在は次のものが含まれます。
- デフォルト: 効果はノーマルと同じです
- 1 回だけプレイ (通常): 順方向シングルプレイ
- ループ:ループ順再生
- 前後ループ再生(PingPong):順方向にループ再生した後、逆方向に再生します。
- Reverse: 逆シングル再生
- 逆ループ再生(LoopReverse):逆方向にループ再生します。
(2)、フレームレート(サンプル)
現在のアニメーション データの 1 秒あたりのフレーム レート、つまり 1 秒を何フレームに分割するかを定義します。デフォルトは 60 です。
これは、アニメーション エディターの下部にあるサンプリング フレーム レート オプションで調整できます。
-
再生速度(スピード):
現在のアニメーションの再生速度を設定するために使用されます。デフォルトは 1 です。値が小さいほど、再生速度は遅くなります。
-
継続時間: 前の数値は、アニメーションの再生速度が 1 の場合のアニメーションの継続時間を示します。これは、最後のキー フレームの位置に基づいて決定されます。
その後の括弧内の数字は実際の走行時間を示しており、速度を調整すると変化します。