display_override

Array
必須 いいえ

display メンバーは、開発者が推奨するウェブサイトの表示モードを決定するために使用されます。これは、要求された表示モードに対応していない場合に、ブラウザーが事次善の表示モードに代替するプロセスに従います。高度な用途では、この代替プロセスでは十分でない場合があります。

display_override メンバーは、 display メンバーを使用する前にブラウザーが考慮する一連の表示モードを開発者に提供することで、これを解決しています。この値は表示モードの配列であり、順番に考慮され、最初にサポートされた表示モードが適用されます。

表示上書きオブジェクトは表示モード文字列の集合で、利用可能な値は以下の通りです。

表示モード 説明
fullscreen 利用可能な画面の領域をすべて使用し、ユーザーエージェントのクロームは表示されなくなります。
standalone アプリケーションの外見は、単独のアプリケーションのようになります。これは、アプリケーションに別のウィンドウを持たせたり、アプリケーションランチャーに独自のアイコンを追加したりすることができるようになります。このモードでは、ユーザーエージェントはナビゲーションを制御するための UI 要素を除外しますが、ステータスバーなどの他の UI 要素を含めることはできます。
minimal-ui アプリケーションの外見は、単独のアプリケーションのようになりますが、ナビゲーションを制御するために最小限の UI 要素が表示されます。要素はブラウザーによって異なります。
browser アプリケーションはブラウザーやプラットフォームに応じた一般的なブラウザータブや新しいウインドウで表示されます。これが既定値です。
window-controls-overlay この表示モードは、アプリケーションが別の PWA ウィンドウにあり、デスクトップ OS 上にある場合にのみ適用されます。この場合、ウィンドウ制御のオーバーレイ機能が利用できるようにします。これは、ウィンドウの全領域がアプリのウェブコンテンツに使用され、ウィンドウの制御ボタン(最大化、最小化、閉じる、およびその他の PWA 固有のボタン)がウェブコンテンツの上にオーバーレイとして表示されるものです。

以下の例では、ブラウザーは以下の表示モード代替チェーンを fullscreenminimal-uistandalone の順番で考慮します。

json
{
  "display_override": ["fullscreen", "minimal-ui"],
  "display": "standalone"
}

仕様書

Specification
Manifest Incubations
# display_override-member

ブラウザーの互換性

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
display_override
Experimental
tabbed display mode
Experimental
window-controls-overlay display mode
Experimental

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
No support
No support
Experimental. Expect behavior to change in the future.
See implementation notes.

関連情報