Compose のカットアウト

ディスプレイ カットアウトとは、一部のデバイスにある表示サーフェスに拡張された領域です。ディスプレイ カットアウトにより、デバイスの前面に重要なセンサーのスペースを確保しながら、エッジ ツー エッジのエクスペリエンスを実現できます。

縦向きモードでのカットアウトの例
図 1. ポートレート モードでのカットアウトの例
横表示のカットアウトの例
図 2。横表示でのカットアウトの例

Android 9(API レベル 28)以降を搭載したデバイスでは、ディスプレイ カットアウトがサポートされています。ただし、Android 8.1 以前を搭載しているデバイスでも、デバイス メーカーがディスプレイ カットアウトをサポートしている場合があります。

このページでは、カットアウト領域(カットアウトを含む表示サーフェスの長方形全体)の活用方法など、カットアウト付きのデバイスに対するサポートの実装方法について説明します。

デフォルトの場合

API レベル 34 以前をターゲットとするアプリ、または enableEdgeToEdge を呼び出さないアクティビティは、デフォルトでは、アプリがディスプレイ カットアウトを含むシステムバーに描画しない限り、カットアウト領域に描画されません。

Android 15 以降を搭載したデバイスで API レベル 35 以降をターゲットとするアプリ、または enableEdgeToEdge を呼び出すアクティビティは、切り欠き領域に描画します。

つまり、LAYOUT_IN_DISPLAY_CUTOUT_MODE_DEFAULTLAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGESLAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER は、Android 15 以降を搭載したデバイスで API レベル 35 以降をターゲットとするアプリの非フローティング ウィンドウに対して LAYOUT_IN_DISPLAY_CUTOUT_MODE_ALWAYS として解釈されます。

切り抜き情報を手動で処理する

カットアウト領域によって重要なテキスト、コントロール、または微細なタップ認識を必要とするインタラクティブな要素が隠れないように、カットアウト情報を処理する必要があります(カットアウト領域ではタップの感度が低下することがあります)。切り欠きを処理する際は、ステータスバーの高さをハードコードしないでください。ステータスバーがコンテンツと重なったり、ステータスバーによってコンテンツが途中で切れたりすることがあります。代わりに、次のいずれかの方法で切り抜きを処理します。

Compose の場合は、displayCutoutsafeContent、または safeDrawing を使用して、コンポーザブルの切り抜きインセットを処理することをおすすめします。このアプローチでは、必要に応じてディスプレイ カットアウトのパディングを尊重し、必要でない場合は無視できます。

Canvas(modifier = Modifier.fillMaxSize().windowInsetsPadding(WindowInsets.displayCutout)) {
    drawRect(Color.Red, style = Stroke(2.dp.toPx()))
}

コンテンツが切り抜きありでどのようにレンダリングされるかをテストする

アプリの画面と動作をすべてテストしてください。可能な場合は、カットアウトのタイプが異なる各種デバイスでテストを実施します。カットアウト付きのデバイスがない場合は、Android 9 以降を搭載しているデバイスまたはエミュレータで、次の手順を使用して一般的なカットアウト構成をシミュレートできます。

  1. [開発者向けオプション] を有効にします。
  2. [開発者向けオプション] 画面で [描画] セクションまで下にスクロールし、[カットアウトがあるディスプレイのシミュレート] を選択します。
  3. カットアウトのタイプを選択します。
    エミュレータでのディスプレイ カットアウトのシミュレーション
    図 3. デベロッパー オプションを使用して、コンテンツのレンダリング方法をテストします。