この記事はスライドバー的なUIを作りたいの続編のようなそうでもないようなUIの記事です
平面のUIを作りたい
VRではUIを使いたいときに、あまりそういうコンポーネントが用意されているわけでもないので、各人作らないとなりません。特にバーチャルキャストはすべて自分で作らなくてはいけません。
いちいちUIで時間を消費するのもあまり良くないと思いますので、ここで共有したいと思います。
作るのは↓みたいな感じです。
https://twitter.com/sakkinonana/status/1470400325266059266
#モデル
今回はモデリングが必要でした。今回は原点位置の設定が重要です。スタイラスペン代わりになるモデルの先っちょに原点を設定しましょう
unityのヒエラルキー（階層構造）は以下のようになります。
selection_coneが実際に持つアイテム、Sphereが操作に連動して動くインジケーター（最悪なくてもよい）、cubeが板で、ホワイトボードみたいな役割をします。
前回同様バーチャルキャストではある経路に沿ってだけ動く、みたいな拘束はかけられないため、掴みたいスタイラスと、実際に値をとるものとを別にします。その上で板上のインジケーターの座標を計算してスクリプトで移動させるという形式を取ります。
#スクリプト
以下スクリプトを貼り付けておきます。前回の流用なので、例によって別オブジェクトの色を位置に応じて変えています。
local stylus = vci.assets.GetTransform("selection_cone")
local indicator = vci.assets.GetTransform("Sphere")
local plane = vci.assets.GetTransform("Cube")
function update()
local pos = Quaternion.Inverse(plane.GetLocalRotation())*Vector3.ProjectOnPlane(stylus.GetLocalPosition()-plane.GetLocalPosition(), plane.GetLocalRotation()* Vector3.up)*2
indicator.SetLocalPosition(pos)
print(pos)
vci.assets.material._ALL_SetColorFromIndex(0,Color.HSVToRGB(pos.x+0.5,pos.y+0.5,pos.z+0.5))
end
骨子は前作のスライドバーと同じですが、今度は取れる情報は二次元情報です。
なのでポイントは
local pos = Quaternion.Inverse(plane.GetLocalRotation())*Vector3.ProjectOnPlane(stylus.GetLocalPosition()-plane.GetLocalPosition(), plane.GetLocalRotation()* Vector3.up)*2
ここですね。今回は指示点を求めるのに、
- 板のある平面に、持っているslection_cone(stylus)の位置を投影する
- 板は自由に動くので、回転角分の補正を行う。
- 投影された位置を求める。
ということをやっています。ProjectOnPlaneはこういうことにも使えるので、結構便利に使っています。
#おわりに
実際UIを一から作るのは以外に大変ですから、VCI製作者としては他にも使いたいUIはたくさんあると思うので、ぜひ皆さんも作ったら共有していってください。いちいちUIに消耗してるのはもったいないからね。
読んでいただきありがとうございました。