トマシープが学ぶ

Unity/VR/AR/デザイン好きのミーハー 記事内容は自分用のメモです

VRでの画面の拡大縮小と手のひらツール

VR内の画面の拡大縮小(ピンチ)と手のひらツール(パン)

VRではないけど昔やった気がする。。。って思ったら割と最近自分のアプリで実装してた。

bibinbaleo.hatenablog.com

手法

拡縮パンを実現するには

・カメラを動かす

・オブジェクト自体を動かす

・マテリアルやオブジェクト?のUVを動かす

の3つの方法がある(ほかにもあると思う)

昔作ったアプリでは上の二つはどちらも試して、結局カメラを動かしたのかな?

UV

Hololensとかで使うMRTK2に指でキャンバスを動かしたり拡大するデモがある。

github.com

プレハブはSlateという名前。石板だって

microsoft.github.io

ここではマテリアルのoffsetとtilingでピンチとパンを実現していた!

f:id:bibinbaleo:20190820094021p:plainMETKをVRで動かせないのでよくわからないけどそんな気がする。

動かしてみたらマテリアルの数値は変わってなかった。

bibinbaleo.hatenablog.com

 

スクリプト読んだらQuadのUVの数値を変えてるみたいな気がした。

qiita.com

MeshFilterで取れるらしい。知らなかった。

docs.unity3d.com


マテリアルの数値を変える

MRTKはMeshのUVの値を変えてたけど、私はマテリアルのUVの数値を変えることにした。

 

unity3d.sblo.jp

Rendererからいじれる。

Renderer renderer=GetComponent<Renderer>();

Vector2 tiling = new Vector2(1.0f - scaleFactor * 0.1f, 1.0f - scaleFactor * 0.1f);
renderer.material.SetTextureScale("_MainTex", tiling);

Vector2 offset = new Vector2(0, offsetFactor);
renderer.material.SetTextureOffset("_MainTex", offset);

パンの操作

3Dオブジェクトの大きさを変える挙動はよくあるけど、VR内での画面を操作する挙動はやったことないなー

どうするのが楽なのか

パンは普通に指で画面を触れて動かしたらいいかな。

そうやるのか知らないけど。

どうやるんだ。

 

拡大縮小は片手でのピンチ操作はできないから、両手の指でビューンってやるか。

どう実装するのか知らないけど。

それこそMRTKのSlateがそうか。

マジであれどうやってるんだろう。

(おまけ):オブジェクトのはみ出した部分をマスクする

これはUV操作をする前、オブジェクトの大きさを調整しようと思ってた時のメモ

 

カメラで変えるのではなく、Canvas自体を大きくするさい、画面からはみ出した部分を表示しないようにするには

uGUIの場合は親のImageにRectMask2Dというのを付けると子が親の形にマスクされるらしい。

でもQuadにはきかなかった
doruby.jp

こちらで紹介されていたマスクシェーダーを使ったのですが、standardSurface系のシェーダーだったのでUnlit系に直したい。

baba-s.hatenablog.com

シェーダーわからなすぎてUnlitの仕方が分からない

この記事でのシェーダーはUnlitだ。

haru-android.hatenablog.com

最後に

まだ途中ー