Xamarin.Forms ListView

Download Sampleサンプルのダウンロード

ListView は、データのリスト、特にスクロールが必要な長いリストを表示するためのビューです。

重要

CollectionView は、さまざまなレイアウト仕様を使用してデータを一覧表示するためのビューです。 これは、ListView に代わる、より柔軟でパフォーマンスの高い選択肢を提供することを目的としています。 詳細は、「Xamarin.Forms CollectionView」を参照してください。

ユース ケース

ListView コントロールは、スクロール可能なデータ リストを表示するあらゆる状況で使用できます。 ListView クラスは、コンテキスト アクションとデータ バインディングをサポートします。

ListView コントロールを TableView コントロールと混同しないでください。 定義済みのオプションを XAML で指定できるため、オプションまたはデータのバインドされていないリストがある場合は常に、TableView コントロールの方が適切です。 たとえば、ほとんど事前定義されているオプション セットがある iOS 設定アプリでは、ListView よりも TableView を使用する方が適しています。

ListView クラスでは、XAML でのリスト項目の定義はサポートされていません。リスト内の項目を 定義するには、ItemsSource プロパティ、または ItemTemplate によるデータ バインディングを使用する必要があります。

ListView は、1 つのデータ型で構成されるコレクションに最適です。 この要件があるのは、リスト内の行ごとに 1 つのセルの種類しか使用できないためです。 TableView コントロールでは、複数のセルの種類をサポートできるため、複数のデータ型を表示する必要がある場合に適したオプションです。

ListView インスタンスへのデータのバインディングについて詳しくは、「ListView データ ソース」を参照してください。

コンポーネント

ListView コントロールには、各プラットフォームのネイティブ機能の実行に使用できる複数のコンポーネントがあります。 これらのコンポーネントは、次のセクションで定義されます。

ヘッダーとフッター

ヘッダーとフッターのコンポーネントは、リストのデータとは別に、リストの先頭と末尾に表示されます。 ヘッダーとフッターは、ListView のデータ ソースとは別のデータ ソースにバインドできます。

グループ

より簡単に移動できるように、ListView 内のデータをグループ化できます。 グループは通常、データ バインドされます。 次のスクリーンショットは、データがグループ化されている ListView を示しています。

セル

ListView 内のデータ項目はセルと呼ばれます。 各セルは、1 行のデータに対応します。 選択対象となる組み込みセルがあるか、または独自のカスタム セルを定義することができます。 組み込みセルとカスタム セルの両方を、XAML またはコードで使用または定義できます。

  • TextCellImageCell などの組み込みセルは、ネイティブ コントロールに対応し、特に高パフォーマンスです。
    • TextCell には、テキストの文字列が表示され、必要に応じて、詳細テキストが表示されます。 詳細テキストは、アクセント カラー付きの小さいフォントで 2 行目としてレンダリングされます。
    • ImageCell には、テキストを含む画像が表示されます。 左側に画像がある TextCell として表示されます。
  • カスタム セルは、複雑なデータを表示するために使用されます。 たとえば、カスタム セルを使用して、アルバムとアーティストを含む曲の一覧を表示できます。

次のスクリーンショットは、ImageCell 項目を含む ListView を示します。

ListView におけるセルのカスタマイズの詳細については、「ListView セルの外観をカスタマイズする」を参照してください。

機能

ListView クラスでは、複数の対話スタイルがサポートされます。

  • プルして更新では、ユーザーが ListView をプルダウンして内容を更新できるようにします。
  • コンテキスト アクションでは、開発者が個々のリスト項目でカスタム アクションを指定できるようにします。 たとえば、iOS に Swipe-to-Action を実装し、Android にロングタップ アクションを実装できます。
  • 選択では、開発者がリスト項目の選択および選択解除イベントに機能をアタッチできるようにします。

次のスクリーンショットは、コンテキスト アクションを含む ListView を示しています。

ListView の対話機能の詳細については、ListView を使用したアクションと対話機能に関するページを参照してください。