「フルスクリーン」アプリ (ほとんどの GL、Metal などのゲームなど) でセーフ エリアをどのように尊重するかは、実際には 2 つの問題です。1 つは設計、もう 1 つは実装です。(でも、その逆の順番で取り組む方が簡単なので、ここに...)
フルスクリーン OpenGL ビューの作成
フルスクリーン ビュー (たとえば、ウィンドウのルート ビュー コントローラー) を設定するlayerClass
とCAEAGLLayer
(ほとんどの OpenGL ES 作業のコースと同じように)、iPhone X の 1125 x 2436 の長方形全体をカバーするビューが得られます。画面。(実際にこれらすべてのピクセルを取得できるように、スケールも設定してください... 375 x 812 @ 1x スケールは、おそらくその画面では恐ろしく見えます。)
それはおそらく、アプリ/ゲームに求められるユーザー エクスペリエンスです (そして、Apple が推奨するものです)... 3D コンテンツは、画面の端まで、下部の曲線と上部の曲線の周りまで拡張されます。すべてのコンテンツを黒い枠で囲むよりも、はるかに優れた UX になります。
iPhone X のフルスクリーン コンテンツのデザイン
一方で、OpenGLコンテンツがどのように表示されるかという既存のデザインは、iPhone X の奇妙な形状の画面にうまく適合する場合と適合しない場合があります。カメラ/センサー/スピーカーカットアウトの後ろ。同様に、下部に重要なものがある場合、その端は湾曲した角の後ろで切り取られます.
その場合、フルスクリーン コンテンツの重要でない部分 (ゲームの 3D ゲームプレイ ワールドのビューなど) をフルスクリーンのままにし、UI オーバーレイやインタラクティブな 3D 要素などの重要なコンテンツを挿入する必要があります。それをどのように行うかについては、いくつかの実行可能なアプローチがありますが、トレードオフがあります。
iPhone X の障害物の大きさをハードコーディングし、iPhone X で実行しているときを検出し、それに応じてレイアウトを修正します。これは簡単ですが、堅牢ではありません。Apple が画面の端にあるソフトウェア UI 要素 (スワイプしてホームに移動するインジケーターなど) の動作方法を変更することを決定した場合、または来年 iPhone XI (または X2? または XX?) をわずかに異なる形状で作成する場合は、次のことを行う必要があります。適応するために再度更新します。
画面上のコンテンツを描画/配置するために UIKit または自動レイアウトを使用していない場合でも、セーフ エリア ガイドを使用してください。ビューにそれを要求しsafeAreaLayoutGuide
、そのガイドの境界を、OpenGL で描画するコンテンツの配置に使用する座標系に変換します。これはもう少し手間がかかりますが、Apple が将来投げるあらゆるカーブボールにアプリが対応できるようにするためです。
もう一つ...
フルスクリーンを使用し、ステータスバーを非表示にします。
iPhone X 向けに設計するときは、「フルスクリーン」アプリでステータス バーを非表示にするかどうかを再考する価値があります。他の iOS デバイスでは、ステータス バーを表示すると、アプリのコンテンツから有効なスペースが奪われます。しかし、iPhone X では、ほとんどのアプリには、これらの「悪魔の角」コーナーでできる便利な機能がありません。ユーザーは、時計やバッテリーなどを表示できることに感謝するかもしれません.