Edited at

OculusGoをuGUIに対応させる #OculusGoDev

More than 1 year has passed since last update.

ストアのレビューから、OculusGoでGUIを使う必要ができてきました。

ビルドのテスト結果_-_Oculus.png

以下翻訳内容

ユーザーが戻るボタンを押すと、アプリはUIの1つのレベルに戻るか、アプリを終了するオプション付きのメニューを表示する必要があります。

ということでGUIの設定の仕方を学びつつGoにて対応するようにします。


TLDR

以下にGaerVRにおける選択操作の方法が記載されています。

Easy Controller Selection [翻訳版]

ぶっちゃけ上記の抜粋になります。が上記の場合はGUI以外の対応も入っているのでこちらのほうがシンプルな作業となります。


UnityでのGUIについて

UnityにおけるGUI(uGUI)はゲーム世界でGUIアプリが使えるかのようです。

それにはいくつかのコンポーネントが組み合わさっているようです。

その中で中心となるのがEventSystemです(UIからCanvasを設定すると自動的に入るコンポーネント)。

今回は上述したEasy Controller Selection から必要なコンポーネントを拾いEventSystem等を調整することでGoコントローラーからGUIを操作できるようにします。


全手順まとめ


事前に必要なアセットを組み込んでおく

通常どおりプロジェクトを作成し必要なアセットを組み込みます。


まずは必要なUIを組み立てる

まずは通常通りGUIを組み合わせて見ます。

Unity_2018_1_0f2_Personal__64bit__-_SampleScene_unity_-_OculusGoWithUGUI_-_PC__Mac___Linux_Standalone__Personal___Metal_.png

上記のように設定します。

階層はこんな感じです

Unity_2018_1_0f2_Personal__64bit__-_SampleScene_unity_-_OculusGoWithUGUI_-_PC__Mac___Linux_Standalone__Personal___Metal_.png

ロジックは以下のように組んでPanelに登録することにしました。本来はどこに登録しておくべきなのでしょうか?


script/UICOntroler.cs


using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class UIController : MonoBehaviour {

[SerializeField] private UnityEngine.UI.Text LogLabel;

public void OnClick() {
LogLabel.text = "onClick!";
}

public void OnCheckd(bool checkd) {
LogLabel.text = "chekd = " + checkd;
}
public void OnValueChenged(float value) {
LogLabel.text = "value = " + value.ToString();
}
}


それぞれを設定します。

2

3

4

Panelに登録したスクリプトのコンポーネントにラベルを設定しておきます。

5

上記時点で動くかどうか確認しておいてください。


Goの初期設定

まず普通にコントローラー等を含めて動くようにしておくには以下のようにします。

この辺はGoでアプリを作るには必須の作業なのでここで細かく言及する必要はないでしょう。


  1. MainCameraの削除

  2. OVRCameraRigの設置

  3. RightHandAnchorとLeftHandAnchorにTrackedRemoteを設置

  4. Build用の各種設定を行う(参考)


今回のメイン作業

では実際にメニューが動くようにしていきます。


uGUIの設定を変更する

Canvasの設定を以下のように変更します。

Unity_2018_1_0f2_Personal__64bit__-_SampleScene_unity_-_OculusGoWithUGUI_-_PC__Mac___Linux_Standalone__Personal___Metal_.png

カメラの正面に来るように調整します。

Unity_2018_1_0f2_Personal__64bit__-_SampleScene_unity_-_OculusGoWithUGUI_-_PC__Mac___Linux_Standalone__Personal___Metal_.png

配置も調整しました。

これは何をやっているかというと初期状態ではスクリーンに配置している感じでしたが

Goでは上記設定を行うことで実態として空間に配置するイメージとなりZ方向の座標の設定等も必要になります。

Unity_2018_1_0f2_Personal__64bit__-_SampleScene_unity_-_OculusGoWithUGUI_-_PC__Mac___Linux_Standalone__Personal___Metal_.png


レーザーポインターの設定

コントローラーから光線が出るようにして、いまカーソルを合わせているのがどこかわかるようにします。

空のGameObjectを作成し名前をLaserPointerとします。

LineRendererコンポーネントを追加してレーザポインターのようなものを作ります。

マテリアルはimportしたサンプルに入っていたSelectionRayを使っています。

更にアセット内のOVRInputSelection/InputSystem内のOVRPointerVisualizerを追加することでポインターが使えるようになります。

Unity_2018_1_0f2_Personal__64bit__-_SampleScene_unity_-_OculusGoWithUGUI_-_Android__Personal___Metal_.png

ここまでいれた状態で動かすとレーザポインターが出るようになりました。がGUIの操作はできないです。引き続き作業を行います。


コンポーネントの入れ替え作業と設定作業

ではコンポーネントを順次入れ替えていきます。複数箇所あるのでご注意ください。

必要なコンポーネントはすべて

Assets/OVRInputSelection/InputSystemにあります。名前がかぶっているコンポーネントがあるので気をつけてください。


EventSystemの変更

Unity_2018_1_0f2_Personal__64bit__-_SampleScene_unity_-_OculusGoWithUGUI_-_Android__Personal___Metal_.png

StandaloneInputModuleを削除して、OVRInputModuleを追加します。

TrackingSpaceにOVRCameraRig内のTrackingSpaceを設定します。

以降何箇所かに登場しますがこれを設定せよという意味になります。


Canvasの変更

Unity_2018_1_0f2_Personal__64bit__-_SampleScene_unity_-_OculusGoWithUGUI_-_Android__Personal___Metal_.png

EventCameraにOVRCameraRig内のCenterCameraを設定し、

GraphicRaycasterを削除し代わりにOVRRaycasterを追加します。


最終結果

以下のようになれば成功です。


参考資料:

https://docs.unity3d.com/ja/current/ScriptReference/EventSystems.BaseInputModule.html

http://tips.hecomi.com/entry/2014/10/02/005313

https://developer.oculus.com/blog/easy-controller-selection/

https://unity3d.com/jp/learn/tutorials/topics/user-interface-ui/ui-button?playlist=17111