リスト

リストは、スクロール機能とフォーカス機能を備えた要素のコンテナです。

原則

明確な構成: リストでは、情報を明確で スキャンしやすい縦方向の配置で表示する必要があります。

アイテムの表示の一貫性: リストアイテムは、一貫した視覚的な 構造に従う必要があります。

フォーカスとナビゲーション: 方向キーによるナビゲーションに依存するインターフェースでは、リストでフォーカスされているアイテムを明確に示す必要があります。

インタラクティビティ: リストアイテムは、選択可能または操作可能な要素を表すことがよくあります。

使い方と配置

リストには、繰り返し可能な要素を含むさまざまな兄弟コンテンツを含めることができます。スタックとは異なり、リストはアプリビュー コンテナ全体に表示されます。

スクリムを使用してオーバーフロー コンテンツを示す リストにビューに収まる以上のアイテムが含まれている場合は、リストの境界付近に黒いスクリムを使用します。

必要に応じてリストにタイトルを使用する 明確にするために、リストで静的タイトルまたは固定タイトルを使用できます。

深度を使用してフォーカスを示す

リストアイテムは、フォーカスされていない状態とフォーカスされている状態の間で、深度 0 ～+4 の間を移動します。

リストアイテムは操作可能にできる

リスト内のアイテムはアクションとして機能します。アクションはリストアイテムに限定する

他のものをスクロールできる場合でも、タップで有効になるコントロールをハイライト表示します。リストまたはカードが別の要素の背後にスクロールできる場合は、タップに応答するアイテムのみにフォーカスします。

解剖学

リストは、スクロール可能なコンテナと、間隔が一定のリストアイテムで構成されています。 アイテムの数がビューポートを超える場合は、リストを縦方向にスクロールする必要があります。オーバーシュートは最小限に抑えます。

A. コンテナ - スクロール可能な領域

B. リストアイテム

C. システムバー

リスト アイテム: リスト内の個々の要素。

A. シェイプ

B. ボーダー

C. 先頭のアイコン

D. テキスト コンテンツ

E. 末尾のインジケーター

カスタマイズ

カスタマイズの大部分はリストアイテムで行われます。

プロパティ	カスタマイズ	デフォルト
リストアイテム: 図形	はい	40 dp
リストアイテム: 先頭と末尾のアイコン	はい	中程度のシンボル アイコン
リストアイテム: パディング値	はい	2d dp、20 dp
リストアイテム: コンテンツ	はい	1 行: Body Small を使用したプライマリ ラベル用の 1 つの Text コンポーザブル 2 行: プライマリ ラベルとセカンダリ ラベル用の 2 つの Text コンポーザブルを含む Column プライマリ: Title Small セカンダリ: Body Small
リスト: verticalArrangement	はい	20 dp