密度非依存ピクセル(dp)と拡張可能ピクセル(sp)は、Android デバイスを構成するさまざまな画面密度、サイズクラス、フォーム ファクタ、アスペクト比に均一に対応するレイアウトとフォントを作成するうえで不可欠です。
要点
- ベースライン グリッドを使用する場合は、4 と 8 の測定値を使用します。
- 仕様はピクセルではなく dp と sp で表記します。
- すべてのバケットのビットマップ(ラスタ)グラフィックをエクスポートします。
- さまざまなサイズクラス、解像度、アスペクト比を考慮して、レスポンシブな設計を行います。
- 密度非依存ピクセル(dp): 密度非依存ピクセルは、どの画面でも均一なディメンションになるように調整される柔軟な 単位です。画面の物理密度に基づいています。この単位は、160 dpi(1 インチあたりのドット数)画面を基準にしています。160 dpi での 1 dp は 1 px とほぼ等しくなります。
- 拡張可能ピクセル(sp): 拡張可能ピクセルは、dp と同じ機能を果たしますが、 フォントに使用されます。sp のデフォルト値は、dp のデフォルト値と同じです。Android システムは、デバイスとデバイスの設定でユーザーが設定した設定に基づいて、使用する実際のフォントサイズを計算します。
これらの測定単位の主な違いは、拡張可能ピクセルではユーザーのフォント設定が保持されることです。ユーザー補助機能でテキストサイズを大きく設定しているユーザーには、テキストサイズの設定に合わせたフォントサイズが表示されます。Compose で フォントサイズを変更する方法をご覧ください。
Android はこれらの単位を使用して、さまざまなデバイスと解像度でスケーリングと変換を行います。
密度バケット
密度の低い画面よりも、密度の高い画面のほうが 1 インチあたりのピクセル数が多くなります。そのため、同じピクセル ディメンションの UI 要素は、密度の低い画面では大きく、密度の高い画面では小さく表示されます。これが、ピクセルで測定値を宣言しない理由です。
Android は、画面密度の範囲を「バケット」にグループ化し、それを使用してデバイスに最適なアセットセットを配信します。最も一般的に使用される密度
バケットは、mdpi、hdpi、xhdpi、xxhdpi、xxxhdpi です(nodpi と
anydpi は、デバイスの解像度に応じてスケーリングされないバケットを指し、通常は
ベクター ドローアブルに使用されます)。それぞれがアプリのリソース ファイルに対応しています。
したがって、dp は次の式で計算できます。
dp =(ピクセル単位の幅 * 160)/ 画面密度
ベースライン グリッド
基盤となるグリッドを使用して構築すると、UI 全体で一貫した間隔と配置が実現します。Android UI では、レイアウト、コンポーネント、間隔に 8 dp グリッドを使用します。
アイコン、文字、コンポーネント内の要素など、小さい要素は 4 dp グリッドに配置するのが最適です。
レイアウト グリッド
グリッドは、あらゆるレイアウトのバックボーンです。コンテンツの階層、量、メッセージなどを考慮してください。
階層型グリッド
階層型グリッドは、コンテンツの階層または重要度を考慮して作成されます。新聞のレイアウトを考えてみましょう。一貫したトップ記事がレイアウトの大部分を占め、小さい列には過去の記事が表示されます。

画面サイズに合わせて調整する場合、階層型レイアウトでは、グリッドセルのリフロー、サイズ変更、表示が可能です。
モジュラー グリッド
モジュラー グリッドは、一貫した列と行で設定され、コンテンツを配置するための長方形のグリッドシステムが作成されます。モジュラー グリッドは、カードギャラリーのように、重要度とサイズが似ているコンテンツに適しています。

アダプティブ モジュラー グリッドでは、グリッドセルを追加できます。また、コンテンツはさまざまなグリッドセルにスナップまたは折り返すことができます。グリッドセルは、サイズ全体で一貫性を保つことも、コンテンツのニーズに応じてサイズを変更することもできます。
列グリッド
列は、本文領域内のコンテンツを分割してレイアウトに垂直方向の定義を提供するグリッド構造を構築します。コンテンツは、列を含む画面の領域に配置されます。基盤となるグリッドに合わせてコンテンツを配置しますが、柔軟なサイズ設定を維持する必要があります。

列グリッドを設定して コンテンツを適用する方法の基本については、レイアウトの基本をご覧ください。列グリッドは、コンテンツのスケーリングを許可しながら、特定の時点で画面サイズに応じて列のサイズと列数を変更することで、さまざまなフォーム ファクタに対応できます。
サイズクラス
ウィンドウ サイズクラスは、アプリのレスポンシブ レイアウト、アダプティブ レイアウトを設計、開発、テストするための、独自のビューポート ブレークポイントのセットです。Android では、ウィンドウ サイズクラスはコンパクト、中程度、拡大の 3 つに分類されます。詳しくは、 ウィンドウ サイズクラスをご覧ください。
アスペクト比
アスペクト比とは、要素の幅と高さの比率のことです。アスペクト比は幅:高さで表されます。
レイアウトの一貫性を維持するには、画像、サーフェス、画面サイズなどの要素に一貫したアスペクト比を使用します。
UI 全体で使用することをおすすめするアスペクト比は次のとおりです。
- 16:9
- 3:2
- 4:3
- 1:1
- 3:4
- 2:3