UnityでVRM対応ブラウザゲームを作る
https://gyazo.com/80f6a10ff659dcbad1cc419b007840dc
三行で
VRMが使えるゲームがぽこじゃが増えるとうれしい。
やっぱりVRMはUnityでやると楽
つくりかた
参考記事
ここに書いてあることがほとんどです。
*.iconUnityのバージョンは2018.4.2f1
UniVRM
UnityでVRMを読み込むためにUniVRMをインポートします
最新のUniVRM-***.unitypackageをダウンロードする
ダウンロード先
インストール方法
UnityEditorのProject上からImport Package -> Custom Package
またはUniVRM-***.unitypackageをダブルクリック
モデルの確認
AssetsにVRMをドラッグ＆ドロップすると読み込まれる。
Prefabが生成されるのでそれをシーンにおけば使える。
ユーザーモデルを読み込まないならこれでOK
uGUI上からファイルを読み込む
ユーザーのローカルなモデルをダイアログから読み込ませたい
ここに書いてある通りにやります。
FileImporter.jslibの作成
ImportButton
uGUIのボタンを作成
Pointer Downイベントに対してImportButton.OnButtonPointerDown()を割り当てる
WebGLビルド
プラットフォームをWebGLにする
File > Build Settings.. (Ctrl + Shift B)
PlatformのWebGLを選択する
https://gyazo.com/6f128bc37481d897b1257fd963e92433
Build And Run
フォルダの選択が出るので出力用のフォルダを用意しておくとわかりやすい
結構時間がかかった
ビルドが終わるとブラウザが開いてゲームが実行される。
unityroomにアップロード
unityroomはUnity(WebGL)専用のゲーム投稿サイト
とても簡単に公開できる
結構投稿するひとが多くて楽しい
Unity1週間ゲームジャムなどイベントが定期的に開催されている
ホントは参加したかったけど間に合わなかった
unityroomにアップロード
出力先に指定したフォルダ > Build 以下にあるファイルをアップロードする。
実際にブラウザから遊べるか確認する
はまったところ
x.iconダイアログの拡張子をVRMにしたい
ファイル入力の時にデフォルトの拡張子をVRMにしたい。
fileInput.setAttributeのところで.vrmを指定する。
Assets>Plugins>FileImporter
code:jslib
fileInput.setAttribute('accept', '.vrm')
x.iconエディター上でモデル読み込みしたい
いちいちビルドするのは大変
読み込みボタンを押した時の動作をWebGLとEditorで分岐させる
参考
code:c#
public void OnButtonPointerDown()
{
#if UNITY_WEBGL && !UNITY_EDITOR FileImporterCaptureClick();
LoadFromFile();
}
x.iconボタンを押した後に一度画面をクリックしないとダイアログが開かない
ImportButton.OnButtonPointerDown()をButton.OnClickから呼んでいたのが原因でした
EventTriggerをアタッチしてPointerDownから呼ぶように設定する
参考記事ではPointerDownで呼ぶって書いてあったのに見落としてました。
x.icon ビルドして実行しているとAn exception has occurred…というダイアログが出る
ソースコードをいじっていないのに
An exception has occurred, but exception handling has been disabled in this build. If you are the developer of this content, enable exceptions in your project's WebGL player settings to be able to catch the exception or see the stack trace.
というダイアログが出るようになってしまいました。
原因はわからなかったのですがとりあえず
PlayerSetting > PublishingSetting > EnableExceptionsをExplicitly Thrown Exception Onlyに設定したところ動作しました。
が、動かない例もあるらしいです
_.iconVRMモデルの大きさがそれぞれ違う
当たり判定が見た目と合わない
未解決
つくったもの
https://gyazo.com/80f6a10ff659dcbad1cc419b007840dc https://unityroom.com/games/runjumpvrm
ただ走って障害物を超えていくだけ
当たり判定の大きさは固定
デフォルトモデルくらい用意しておけば良かった
よかったら遊んでみてください。