【３】CurveModifiers
Tweenerでベジェ曲線を扱う時にはCurveModifiersを利用します。
- まずは パッケージをインポート。import caurina.transitionsprooerties.CurveModifiers;
- CurveModifiers.init();
今回のサンプルではCurveModifiers.init(); で登録されている _bezier だけを使います。
後今回のサンプルではFrocessingも利用しています。 ColorHSV：色相（Hue） 彩度(Saturation) 明度(Value・Brightness) で色を定義するクラスです. _hsv = new ColorHSV(色相、色相、彩度、明度);
- パッケージをインポート。import frocessing.color.ColorHSV;
- _hsv = new ColorHSV(色相、色相、彩度、明度);
hsv.h= ++hsv.h % 360; 色相を時間が立つにつれて変化をしている。
_bezierの軌道がよくわからなかったので、こちらのサイトを参考にしました。
Tweenerのなかでは、bezier:{ x:controlX , y:controlY } のように表記がなされています。 cueveTo で第1引数と第2引数に該当する、x座標とy座標を組みにしたオブジェクトを指定します。 サイトを見ていただければペジュ曲線がどのようか奇跡をたどるのかがわかるかと思いますが、今回のサンプルを参考にすると 初期の位置が（MouseX,MouseY) 終着点がTweenerで指定されている（endX, stage.stageHeight)。 そこに行く際の軌道の頂点がbezier で指定された_bezier: [{x: ctlX, y:0 }],です。 x の場合はMouseX => endX に ctlXに近づきながら移動するということです。
色彩についてのメモ
色相：色合いの違い。赤・青・黄といった色の違い。
明度：色の明るさ。 白に近づくほど明度は高く、黒に近づくほど明度は低い。
彩度：あざやかさ。色みの強さ。白〜灰色〜黒は彩度０。色味をもっていない。下の例は赤の色味をつけたもの。
コントラスト：白と黒、無彩色間の対比.
