[VVVVlog9 チュートリアル⑦] Mouseで動かしてみよう！Vectorも！

プロジェクションマッピングを目指して、

ずんずん進めているのですが、ちょっと寄り道をしようと思います。

LeapMotionのようなセンサーもaddonsで手軽に使えるところも

vvvvの良いところなので、近いうちに説明できたらと思っているので、その布石です。笑

※説明がちょっと複雑になってしまったので、

　わからんちんってなった場合は、とりあえず、画像を参考につないでみてください！

今回使う新しいノードは、

Mouse(Device Desktop)、I/O欄の2D Vector

Mouse(Device Window)、Vector(2d Split)です。

目標は、

「マウスにくっついてくる小さいQuadです。」

まず、Mouseからどのようなデータが得られるか確認してみましょう。

①Mouse(Device Desktop)、2D Vectorを出してください。

　Mouseは左ダブルクリックからの通常のノードの出し方

　2D Vectorは、右ダブルクリックをし、I/O BOXの2D Vectorを選んでください。

　2D Vectorを選択すると、下のような二行のI/O BOXが出現するはずです！

　まぁ要するに２行のI/O BOXなだけですね。

②Mouse(Device Desktop)の左から２番目のアウトレットPositionXYを

　2D Vectorのインレットにつなぎましょう。

　すると、Desktop全体をRendererと考えたときのXY座標が出てくると思います。

　vvvvの座標の考え方は、vvvvlog6を参照。

このように、Mouseカーソルの位置の情報をとることができます。

次に、Mouseからの情報をつかって、Quad、Transform(2d)で動かしてみましょう！

　

③Mouse(Device Window)、Quad、Transformを出してください。

　Mouse(Device Window)は、デスクトップではなく、Renderer内の座標が表示されます。

これをTransformにつないで、

マウスについてくるQuadを出現させようと思うのですが…

問題があります…。

Transformのインレットに直接つないでも思った様にデータ入力できません。

試しにつないでみると…なんか変…。

そこで、Vector(2d Split)の登場です！

Vector(2d Split)は以下のように使います。

④画面を参考に、I/O BOXとVector(2d Split)を接続してみてください。

　ついでに、Quadの大きさ(ScaleXY)をわかりやすいように0.1にしてみました。

どうでしょう？

マウスに追従するQuadを作成することができたでしょうか？

Vector(Split)は複数の値を分ける場合に用いることができます。

マウスなどのデバイスから様々な情報を得ることができると思いますが、

情報を処理しやすく分け、振り分けることで、思ったように動かせるようになります。

※番外編ですが…

　Vectorで分けた数値をScaleにつないでみても面白い反応が見られると思います！

　vvvvはつなげることができる部分が少し大きくなるので、

　それを目安に色々つないでみると面白い反応が得られると思いますよー！

遊び心大切！！

Junky_Inc