白黒羊

WebGLのUnity InputField 日本語入力について

プレイヤーの名前を入力するときなどに使える「InputField」ですが、WebGLで出力するとデフォルトでは日本語が使えません。

WebGLでの日本語入力・コピー&ペーストについて – ユニティ・テクノロジーズ・ジャパン合同会社

「InputField等でユーザーからの入力を受けつけるのですが、WebGLでは、日本語での入力ができない・コピー&ペーストが出来ない」というお問合せが現在 多数寄せられております。

IMEの仕組みに頼れないInputシステムのため、Unity自体の改善には時間を要するものと思われます。

そこで、unitypackage「WebGLNativeInputField」が用意されました。

使い方は、既存のInputFieldコンポーネントをWebGLNativeInputFieldコンポーネントに置き換えるだけととても簡単です。
詳しくは上記のページを見れば分かると思います。

しかし、実際に使ってみると下記のようなエラーが出ました。

#####に埋め込まれているページの内容

An error occurred running the Unity content on this page.
See your browser JavaScript console for more info.
The error was: Uncaught TypeError: Cannot read property ‘style’ of null

画面上部にエラーダイアログが表示される

このエラーは、無視して続行することができるのですが、その事情を知らない他の人にプレイしてもらうことを考えると気になります。
エラーを表示しない方法として下記リンクのように、「index.html」に、

<script> window.alert = _ => {}; </script>

を書き加えるという対策を取ることができるようです。

https://blog.httqs.com/log/39

公式のデモでは、そのようなエラーは出ないので、表示させないのではなくエラー自体を発生させない方法はあるのでしょうが、少し見ただけでは分かりませんでした。
分かり次第追記しようと思います。

また、公式のものではありませんが以下のパッケージをお借りすることで、JavaScriptを呼び出すことなく日本語入力ができるので、現時点で一番簡単な解決方法かと思います。
別画面に入力するのではないため、見た目もきれいです。

kou-yeung_WebGLInput_ IME for Unity WebGL

WebGLInputを利用するとこのように入力できる

今回出てきた3種類を並べてみました。
試してみてください。

また、記事中のゲームはこちらから遊べるのでぜひどうぞ。
PCからアクセスしてください。

少し前に『Unity 1週間ゲームジャム/ お題「つながる」』に提出した作品です。

別で記事書こうと思っていたのですが順番が前後しました。
色々と勉強になったのでそのうち思ったことを書きます。