After EffectsでカスタムUIスライダーを作成する、バウンダリー、Clamp()関数を使用する。
また、After Effectsの表現をより深く理解するために、clamp()表現は非常に有効です。 この関数はAfter Effectsの中でどのように動作するのかを理解しやすく、これを学ぶことによって、今後必要となる言語の基礎を容易に身につけることができます。を前面に押し出す。
さて、本題に入りましょう。
まず、簡単なスライダーのリグをセットアップする環境を構築しましょう。 コンポジションパネルにスライダーをセットアップしたら、UIを機能させるための表現を追加し始めます。 コンポジションパネル内にスライダーがあると、アニメーションフェーズに移る前に、リグ化したレイヤーの見え方をテストするのに便利です。
今回のリグ付きスライダーでは、2種類のエクスプレッションを使用する予定です。 一次式 を使用する方法と クランプ式 .
![](/wp-content/uploads/history/456/vv7xv89iwz.gif)
CLAMP()関数のセットアップ
まず、スライダーの移動要素にクランプ機能を設定しましょう。 この例では、円がその下の線より遠くに動かないようにすることが目的です。 線をトラックと考え、円をトラック上にとどめたいのです。
スライドさせたい位置まで左に移動させ、Xポジションの値を見て表記します。 次にスライドさせたい位置まで右に移動させ、この値も表記します。 また、Yポジションも表記しておきます。
では、実際に式を書いてみましょう。 最初の変数「x」を定義し、「clamp()」関数を入力します。 After Effectsは、括弧の中で3つの情報を探します。 まず、情報を読み込むべき入力、次に、許容する最小値、最後に、許容する最大値です。
x = clamp(input,min,max)とする。
ピックウィップをpositionプロパティのXの値までドラッグして配列の最初の値をセットします。 これがAfter Effectsが読み込む入力です。
![](/wp-content/uploads/history/456/vv7xv89iwz-1.gif)
次に、先ほどメモしたX座標を入力します。 まず、一番左の値を入力し、その後にコンマを入れます。 次に、一番右のX位置を入力します。 これで、3つの値が括弧の間に記入されました。 最後に、セミコロン(*1)を入力して、この行を終えます。 ;) をクリックすると、After Effectsに終了を伝えることができます。
x = clamp(transform.position[0],400,800)。
After EffectsでXポジションの使い方を説明しましたが、次にYポジションの使い方を定義します。 次の行に進み、y =(ここにYポジションの表記を入れる)と入力すると、Yポジションが上下に移動しないようにロックされます。
x = clamp(transform.position[0], 400, 800);
y = 800;
最後に、最も重要なことですが、この式をラップして、XとYが何であるかをAfter Effectsに伝えます。 式を読むことができても、XとYの両方の位置を埋めるために2つの値を探します。 これは、2つの値から始めたので、式をラップして、その2つの値が何であるかを示す手助けが必要だからです。 ですから、これらの値を覚えておいてください。という変数を定義して、それを使うようにAfter Effectsに指示しましょう。
x = clamp(transform.position[0], 400, 800);
y = 800;
[x,y]です。
// あるいは、以下も有効です。
x = clamp(value[0], 400, 800);
y = 800;
[x,y]です。
完了です!コンポジションウィンドウで、スライド要素をつかんで前後にドラッグできるようになりました。 Y位置が上下に動かないようにし、X位置はclamp()関数で指定した最小値と最大値で停止するようにしてください。
![](/wp-content/uploads/history/456/vv7xv89iwz-2.gif)