折りたたみ式デバイスは、革新的なアプリを開発するチャンスです。1 つのデバイスに大画面と小画面があることで、互いを補完する、特色のあるインタラクティブな体験を実現できます。テーブルトップやブックの形状を取る折りたたみ機能により、独創的なレイアウトや斬新なユーザー インターフェースが可能になります。
アダプティブ デザイン
折りたたみ式デバイスの折りたたみ画面と展開画面を最適にサポートするには、レイアウトを適応させる必要があります。折りたたみ画面と展開画面では画面サイズとアスペクト比が大きく異なる場合があり、各種の画面サイズと設定に最適化された代替レイアウトが必要になります。アダプティブ レイアウトを使用すれば、折りたたみ式デバイスの折りたたみ / 展開状態、縦向き / 横向き、テーブルトップ / ブック形状のいずれの場合でも、最適なユーザー エクスペリエンスが得られます。
たとえば、大画面の折りたたみ式デバイスを横向きに展開すると、タブレットのようになります。ナビゲーション レール付きの 2 ペイン レイアウトであれば、ワイドスクリーンが最大限に活かされます。折りたたまれたデバイスは、標準的なスマートフォンに似ています。下部にナビゲーション バーがあるシングル カラム レイアウトは、単純ながら効果的です。レイアウトがそれぞれ独立しているため、用途に合わせた最適化が可能です。
折りたたみ式デバイス向けのアダプティブ デザインと開発について詳しくは、以下をご覧ください。
- デザイン: UI ギャラリーで、さまざまなフォーム ファクタのレイアウトのインスピレーションとパターンをご覧ください。
- 開発: さまざまな表示サイズをサポートするのデベロッパー ガイドに沿って、アダプティブ レイアウトを作成します。
折りたたみ式の状態と形状
折りたたみ式デバイスを折りたたむと、画面が 2 つの部分に分かれます。折り目は、画面の可動部か、デュアル スクリーン デバイスの場合は 2 つのディスプレイを分けるヒンジの部分になります。
折り目には寸法と、occlusionType プロパティがあり、折り目がディスプレイの一部を覆い隠すかどうかを定義します。デュアル スクリーン デバイスでは、occlusionType は FULL であり、アプリが両方の画面にまたがる場合でも、折り目(ヒンジ)領域にはコンテンツが表示されません。
折りたたみ式デバイスは、FLAT(完全に
開いた状態)や HALF_OPENED(完全に開いた状態と閉じた状態の間)など、さまざまな折りたたみ状態になります。
デバイスが HALF_OPENED 状態にあるとき、デバイスは折り目の向きに応じて 2 つの形状になります。1 つはテーブルトップ形状(折り目が水平方向)、もう 1 つはブック形状(折り目が垂直方向)です。
テーブルトップ形状とブック形状によって新たなレイアウトの可能性が開けますが、HALF_OPENED
デバイスの状態にはいくつかの制限があります。たとえば、UI
コントロールが折り目に近い位置にあると、ユーザーが操作しにくくなります。またテキストが折り目に重なると読みにくくなります(occlusionType が
FULL の場合は判読不能です)。
どのデバイス状態でも UI 要素にアクセスできるようにレイアウトを設計してください。 ダイアログ ボックスとポップアップ メニューは、折り目に重ならないように配置します。 デバイスを部分的に折りたたんだ状態でも、重要なコンテンツが見えるようにします。 デバイスが半開きの場合は、コンテンツを 2 つの領域(テーブルトップ形状では上下、ブック形状では左右)に分割します。
折りたたみ式デバイスは、形状に加えて、次のような独自のディスプレイ モードをサポートしています。
- 背面ディスプレイ モード: デバイスを開いた状態でアプリが外側の画面を使用できるようにします。背面カメラ セルフィー プレビューなどの機能を利用できます。
- デュアル スクリーン モード: 内側と外側の両方の画面に同時にコンテンツを表示します。双方向翻訳などの機能を利用できます。
折り目と折りたたみの形状について詳しくは、アプリを折りたたみ 対応にするをご覧ください。独自のディスプレイモードをサポートする方法については、折りたたみ式 ディスプレイ モードをサポートするをご覧ください。
アプリの継続性
デバイスを折りたたむか展開する際には、アプリはいったん停止し、別の画面に移行して再起動します。ユーザーエクスペリエンスの継続性を維持するには、アプリの状態を シームレスに保存して復元する必要があります。これは、 アダプティブ アプリの品質に関するガイドラインで説明されています。
また、折りたたみ式デバイスの各種の画面レイアウトも、互いに補完し合う必要があります。たとえば、折りたたんだ画面にオンライン ショップの商品の画像と説明が表示されている場合には、展開した画面にも同じ画像と説明を表示して継続性を維持すると同時に、商品の仕様やレビューなどの補完的なコンテンツを追加することが重要です。
アプリの状態と継続性の管理について詳しくは、UI の状態を保存する と 構成の変更に対処するをご覧ください。
マルチタスク
大画面の折りたたみ式デバイスには、マルチウィンドウ モードでのマルチタスクに最適なタブレット サイズの画面が搭載されています。折りたたみ式デバイスは分割画面モードをサポートしています。フリーフォーム モードをサポートするデバイスもあります。フリーフォーム モードでは、デスクトップ ウィンドウ システムと同様に、位置もサイズも変更可能なウィンドウにアプリが表示されます。
|
|
|
|
|
Android 12(API レベル 31)以降では、デフォルトでマルチウィンドウ モードになります。大画面の場合は、アプリの設定にかかわらず、すべてのアプリがマルチウィンドウ モードで実行されます。それ以前のバージョン(ただし、Android 7.0(API レベル 24)以降)の場合は、マルチウィンドウ モードに対応してアプリのサイズを変更できるように設定する必要があります。
マルチウィンドウ モードでのマルチタスクについて詳しくは、マルチウィンドウ モードをサポートするをご覧ください。
ドラッグ&ドロップ
大画面の折りたたみ式デバイスには、ドラッグ&ドロップ操作に対応する十分な画面スペースがあります。折りたたみ式デバイスのマルチウィンドウ モードでは、アプリ間でのドラッグ&ドロップが可能です。
ドラッグ&ドロップ操作により、生産性が高く魅力的なユーザー エクスペリエンスを実現できます。Android のドラッグ&ドロップ フレームワークを使用して、アプリにドラッグ&ドロップ機能を追加します。詳細については、ドラッグ&ドロップを有効にするをご覧ください。