全体像 / ガイド
デバイスに対応する
ディスプレイの変化に追従し、対応デバイスに合わせてVertical Barsを配置します。
iPhone Duoを含むデバイスへの対応は標準導入に含まれます。Foldableの購読で初期レイアウトとその後の変更を受け取り、resolverとテーマで配置を反映します。
この章では対応デバイス・OSの条件と、レイアウトを調整する方法を説明します。ネイティブのレール配置に対応しないデバイスではWebレイアウトを維持します。
デバイスの通知からWebの配置まで
Foldableがディスプレイの変更を通知します。resolveVerticalBarsLayoutはその情報を読み、edge・inset・toolbarTopをビューポートのCSSピクセルで返します。setVerticalBarsLayoutがテーマを通じて配置を反映します。購読後に初期値を読むことで、起動時とその後の変化を同じ更新処理に通します。コントロールのネイティブ描画はNative UIが別に担当します。
通知されたレイアウトを判断元にする
edgeがnullなら通常のWebレイアウトへ戻ります。デバイス名・画面幅・折りたたみ端末かどうかで推測せず、通知された配置を使います。Webの余白調整とネイティブレールの利用可否は別です。ブラウザーでは余白を確認でき、ネイティブ描画は対応デバイスとOSで確認します。左右のレール・回転・ディスプレイの切り替え・通常配置への復帰を確認してください。