Xamarin.Forms CollectionView の概要
CollectionView
は、さまざまなレイアウト仕様を使用してデータを一覧表示するためのビューです。 より柔軟でパフォーマンスの高い 代替手段を 提供することを ListView
目的としています。 たとえば、次のスクリーンショットは、2 列の垂直グリッドを使用し、複数の選択を許可する を示しています CollectionView
。
CollectionView
は、スクロールまたは選択が必要なデータのリストを表示するために使用する必要があります。 表示するデータにスクロールや選択が不要な場合は、バインド可能なレイアウトを使用できます。 詳細については、「 のバインド可能なレイアウト Xamarin.Forms」を参照してください。
CollectionView
は 4.3 から Xamarin.Forms 入手できます。
重要
CollectionView
は iOS と Android で使用できますが、ユニバーサル Windows プラットフォームでのみ部分的に使用できます。
CollectionView と ListView の違い
CollectionView
API と ListView
API は似ていますが、いくつかの顕著な違いがあります。
CollectionView
には柔軟なレイアウト モデルがあります。これにより、データをリストまたはグリッドに垂直方向または水平方向に表示できます。CollectionView
では、単一選択と複数選択がサポートされます。CollectionView
にはセルの概念がありません。 代わりに、データ テンプレートを使用して、リスト内のデータの各項目の外観を定義します。CollectionView
は、基になるネイティブ コントロールによって提供される仮想化を自動的に利用します。CollectionView
の API サーフェスをListView
減らします。 のListView
多くのプロパティとイベントは にCollectionView
存在しません。CollectionView
には組み込みの区切り記号は含まれません。CollectionView
は、UI スレッドから更新された場合ItemsSource
に例外をスローします。
ListView から CollectionView に移動する
ListView
既存 Xamarin.Forms のアプリケーションの実装は、次の表の助けを借りて実装に移行 CollectionView
できます。
概念 | ListView API | CollectionView |
---|---|---|
Data | ItemsSource |
プロパティを CollectionView 設定すると、 にデータが ItemsSource 設定されます。 詳細については、「 CollectionView にデータを設定する」を参照してください。 |
アイテムの外観 | ItemTemplate |
内 CollectionView の各項目の外観は、 プロパティを ItemTemplate に DataTemplate 設定することで定義できます。 詳細については、「アイテムの 外観を定義する」を参照してください。 |
セル | TextCell , ImageCell , ViewCell |
CollectionView にはセルの概念がないため、開示インジケーターの概念はありません。 代わりに、データ テンプレートを使用して、リスト内のデータの各項目の外観を定義します。 |
行区切り記号 | SeparatorColor , SeparatorVisibility |
CollectionView には組み込みの区切り記号は含まれません。 これらは、必要に応じて項目テンプレートに指定できます。 |
[選択] | SelectionMode , SelectedItem |
CollectionView では、単一選択と複数選択がサポートされます。 詳細については、「CollectionView の選択」を参照してくださいXamarin.Forms。 |
行の高さ | HasUnevenRows , RowHeight |
では、 CollectionView 各項目の行の高さは プロパティによって ItemSizingStrategy 決まります。 詳細については、「アイテムの サイズ設定」を参照してください。 |
キャッシュ | CachingStrategy |
CollectionView では、基になるネイティブ コントロールによって提供される仮想化が自動的に使用されます。 |
ヘッダーとフッター | Header , HeaderElement , HeaderTemplate , Footer , FooterElement , FooterTemplate |
CollectionView では、および の各プロパティを使用して、リスト内の項目と共にスクロールするヘッダーとフッターをHeader Footer HeaderTemplate FooterTemplate 表示できます。 詳細については、「 ヘッダーとフッター」を参照してください。 |
グループ化 | GroupDisplayBinding , GroupHeaderTemplate , GroupShortNameBinding , IsGroupingEnabled |
CollectionView プロパティを に設定して、正しくグループ化されたデータをIsGrouped true 表示します。 グループ ヘッダーとグループ フッターは、 プロパティと GroupFooterTemplate プロパティを GroupHeaderTemplate オブジェクトにDataTemplate 設定することでカスタマイズできます。 詳細については、「CollectionView のグループ化」を参照してくださいXamarin.Forms。 |
引っ張って更新 | IsPullToRefreshEnabled , IsRefreshing , RefreshAllowed , RefreshCommand , RefreshControlColor , BeginRefresh() , EndRefresh() |
更新機能へのプルは、 の子RefreshView として をCollectionView 設定することでサポートされています。 詳細については、「 更新するプル」を参照してください。 |
コンテキスト メニュー項目 | ContextActions |
コンテキスト メニュー項目は、 内のデータの各項目の外観を定義する のDataTemplate ルート ビューとして をCollectionView 設定SwipeView することでサポートされます。 詳細については、「コンテキスト メニュー」を参照してください。 |
スクロール | ScrollTo() |
CollectionView は、項目を ScrollTo ビューにスクロールするメソッドを定義します。 詳細については、「 スクロール」を参照してください。 |