メインコンテンツまでスキップ

トラブルシューティング

以下の各セクションは、目に見える症状から出発して、よくある原因を可能性の高い順に挙げ、それぞれを説明するページにリンクしています。

テキスト​

テキストが表示されない​

  • フォントがない。 テキストエレメントは、読み込まれたフォントアセットがないと何も描画しません。エンジンでは、アプリケーションにpc.FontHandlerが必要で、フォントの読み込みが完了している必要があります。
  • 文字が足りない。 フォントにない文字はスペースとして描画され、1文字ごとにコンソールに警告が出ます。その文字をフォントに追加してください。文字の選択を参照してください。
  • 色や不透明度。 背後のパネルと同じ色のテキストや、opacityが0のテキストは、存在していても見えません。
  • スクリーンの外にある。 アンカーを指定せずに作成したエレメントは親の左下隅に置かれるため、見える範囲から外れていることがあります。アンカーを参照してください。

テキストが折り返されない​

折り返しには、Wrap Linesと、折り返す位置となる幅が必要です。Auto Widthをオフにして幅を設定するか、エレメントのアンカーを水平方向に分割してください。サイズの調整、折り返し、行数の制限を参照してください。

テキストが収まるように縮小されない​

Auto Fit WidthとAuto Fit Heightは、それぞれAuto WidthとAuto Heightがオフのときにのみ機能します。縮小して収めるを参照してください。

マークアップがそのままテキストとして表示される​

マークアップにはEnable Markupが必要です。オンにしていても、閉じられていないタグなどのマークアップエラーがあるテキストは書かれたとおりに描画され、コンソールにエラーが報告されます。マークアップを参照してください。

入力​

クリックが無視される​

  • ElementInputがない。 エンジンでは、アプリケーションにElementInputが必要です。セットアップを参照してください。
  • 入力がオフになっている。 入力を受け取るのは、Use Inputがオンのエレメントだけです。UI入力の有効化を参照してください。
  • 別のエレメントが上にある。 見えないグループなど、その上に描画されている入力が有効なエレメントが、代わりにクリックを受け取ります。どのエレメントがイベントを受け取るかを参照してください。
  • カメラがそのレイヤーをレンダリングしていない。 エレメントのヒットテストは、そのレイヤーをレンダリングするカメラを通してのみ行われます。
  • マスクで切り取られている。 マスク内では、マスクの矩形の内側にある部分だけが入力を受け取ります。マスクと入力を参照してください。
  • ポインターがロックされている。 ポインターがロックされている間は、マウスボタンの押下は無視されます。ポインターロックを参照してください。
  • ボタンが非アクティブになっている。 activeがオフのボタンは、ボタンのイベントを発生させません。ボタンの無効化を参照してください。
  • エディターのビューポートで操作している。 ビューポート内では、UIは入力に反応しません。シーンを起動してください。

UIへのクリックがゲームにも届く​

UIのmousedownとtouchstartのハンドラーでイベントの伝播を止め、ElementInputをマウスデバイスとタッチデバイスより先に作成します。UIの入力がゲームに届かないようにするを参照してください。キャンバスの上に重ねたHTMLについては、HTMLの入力をゲームに届かないようにするを参照してください。

タップするとボタンの背後にあるものがクリックされる​

タップの後、ブラウザはエミュレートされたマウスイベントを送信します。タップされたときに自身を非表示にしたボタンでは、これらのイベントがボタンの背後にあるものに届きます。キャンバスのtouchendイベントをキャンセルしてください。タッチスクリーンを参照してください。

ボタン​

ホバーや押下でボタンの見た目が変わらない​

  • イメージエンティティがない。 エンジンでは、ボタンのimageEntityは設定するまでnullで、イメージエンティティのないボタンは見た目が変わりません。イメージを参照してください。
  • タッチ。 タッチにはホバー状態がありません。タッチとXRを参照してください。

ホバーするとボタンがグレーや不透明になる​

ティントはイメージの色と不透明度を置き換え、デフォルトのティントはグレーで不透明です。ボタンに合ったティントを設定してください。ティントを参照してください。

サイズとスケール​

インターフェースが極端に小さい、大きい、または収まらない​

  • Scale ModeがNone。 Blendでない場合、インターフェースはピクセル単位で作られ、キャンバスのサイズに追従しません。Blendによるスケーリングを参照してください。
  • ピクセル比。 Scale ModeがNoneの場合、ピクセル比が高いほどインターフェースは小さくなります。ピクセル比を参照してください。
  • Scale Blend。 縦長では、Scale Blendが1だと、横長向けに設計したインターフェースの幅が広くなりすぎます。Scale Blendの選び方を参照してください。
  • ワールド空間のスクリーンのスケール。 メートル単位でのサイズは、解像度にエンティティのスケールを掛けたものです。サイズとスケールを参照してください。

インターフェースが押しつぶされる​

カメラのrectがキャンバスの一部しか覆っておらず、スクリーン空間のスクリーンがその範囲に押しつぶされています。レイヤーとカメラを参照してください。

スクロールビューとレイアウト​

スクロールビューがスクロールしない​

  • コンテンツに入力がない。 コンテンツのエレメントを何もない部分でもドラッグできるようにするには、Use Inputをオンにする必要があります。
  • コンテンツがビューポートより大きくない。 スクロールビューがコンテンツのサイズを設定することはありません。コンテンツのサイズ設定を参照してください。
  • 軸、スクロールモード、摩擦がない。 コードで作成したスクロールビューは、これらを設定するまでどれも持ちません。スクロールビューの作成を参照してください。
  • マウスデバイスがない。 エンジンでは、マウスでドラッグするにはpc.Mouseが必要です。

スクロールするコンテンツの一部が表示範囲外にある​

スクロールビューはコンテンツをそのピボットで配置するため、ピボットはコンテンツの左上隅、[0, 1]である必要があります。ピボットが中央にあると、最初からコンテンツの半分がビューポートの左端または上端の外にはみ出します。スクロールビューを参照してください。

レイアウトグループ内のエレメントがアンカーや位置を無視する​

レイアウトグループは、子のアンカー、位置、計算後のサイズを設定します。子を除外するには、Exclude from Layoutをオンにしたレイアウトチャイルドを使います。子の配置の仕組みを参照してください。

イメージとマスク​

マスクに何も表示されない​

  • 不透明度が1未満。 不透明度が1未満のマスクは、子をすべて隠します。形状マスクを参照してください。
  • 子が別のレイヤーにある。 マスクと、マスクが切り取るエレメントは、同じレイヤーになければなりません。マスクとレイヤーを参照してください。
  • テクスチャが部分的に透明。 子が表示されるのは、マスクのテクスチャのうち完全に不透明なピクセルの部分だけです。

カスタムマテリアルが表示されない​

UIレイヤーは透明なマテリアルだけを描画します。マテリアルのblendTypeを設定して、ブレンドするようにしてください。カスタムマテリアルを参照してください。

イメージの縁が暗くなる、または明るくなる​

テクスチャの透明なピクセルにも色があり、フィルタリングによってその色が見える縁に混ざっています。暗い縁を防ぐを参照してください。

ローカライズ​

ローカライズしたテキストにキーが表示される​

  • キーに対応するメッセージがない。 現在のロケールにも、そのフォールバックにもありません。
  • ファイルが読み込まれていない。 app.i18nはローカライズファイルを読み込みません。エディターでは、ローカライズファイルのPreloadをオンのままにしてください。ファイルの読み込みを参照してください。

ローカライズしたテキストに{number}が表示される​

そのキーは複数形のメッセージのものです。このようなキーを持つテキストエレメントは、メッセージの最初の形を、{number}が残ったまま表示します。代わりに、スクリプトからgetPluralTextを使ってテキストを設定してください。スクリプト内の文字列を参照してください。

ロケールを変えるとテキストが消える​

そのロケールには専用のフォントがあり、そのフォントが読み込まれるまでテキストは描画されません。ローカライズされたフォントを参照してください。

描画​

インターフェースが2回描画される​

2台のカメラがUIレイヤーをレンダリングしています。もう一方のカメラからUIレイヤーを取り除いてください。レイヤーとカメラを参照してください。

エレメントが間違った順序で描画される​

エレメントはヒエラルキーの順に描画されるため、上に表示すべきエレメントを、ヒエラルキーで他のエレメントより後に移動してください。描画順を参照してください。Reactでは、<Entity>は新しいエンティティを、JSX内の位置に関係なく兄弟の後に追加します。スクリーン同士が重なる場合は、異なる優先度を与えてください。複数のスクリーンと優先度を参照してください。

ワールド空間のインターフェースが裏側から見ると消える​

ワールド空間のスクリーンは片面のみです。裏側から見た場合を参照してください。

ワールド空間のインターフェースが壁越しに見える​

カメラがCameraFrameを通してレンダリングしています。CameraFrameは、シーンの深度なしでUIレイヤーを描画します。ワールド空間UIとポストプロセスを参照してください。

関連情報​