CollectionView – это представление для вывода списков данных с использованием различных спецификаций компоновки. Оно призвано стать более гибкой и производительной альтернативой ListView. Например, на следующих скриншотах показан элемент CollectionView, использующий вертикальную сетку с двумя колонками и позволяющий осуществлять множественный выбор:
CollectionView следует использовать для представления списков данных, требующих прокрутки или выбора. Если отображаемые данные не требуют прокрутки или выделения, можно использовать привязываемый макет. CollectionView доступен начиная с версии Xamarin.Forms 4.3.
Важно. CollectionView доступен на iOS и Android, но лишь частично доступен на Universal Windows Platform.
Различия CollectionView и ListView
Несмотря на схожесть API-интерфейсов CollectionView и ListView, существуют некоторые заметные различия:
- CollectionView имеет гибкую модель компоновки, которая позволяет представлять данные вертикально или горизонтально, в виде списка или сетки.
- CollectionView поддерживает одиночный и множественный выбор.
- В CollectionView отсутствует понятие ячеек. Вместо этого для определения внешнего вида каждого элемента данных в списке используется шаблон данных.
- CollectionView автоматически использует виртуализацию, предоставляемую базовыми элементами управления.
- CollectionView уменьшает поверхность API ListView. Многие свойства и события ListView отсутствуют в CollectionView.
- CollectionView не содержит встроенных разделителей.
- CollectionView будет выбрасывать исключение, если его ItemsSource обновляется вне потока пользовательского интерфейса.
Переход от ListView к CollectionView
Реализации ListView в существующих приложениях Xamarin.Forms могут быть перенесены на реализацию CollectionView с помощью следующей таблицы:
| Концепция | ListView API | CollectionView |
| Данные | ItemsSource | CollectionView заполняется данными путем установки свойства ItemsSource |
| Внешний вид элемента | ItemTemplate | Внешний вид каждого элемента в CollectionView может быть определен путем установки свойства ItemTemplate в DataTemplate. |
| Ячейки | TextCell, ImageCell, ViewCell | В CollectionView отсутствует понятие ячеек, а значит, и понятие индикаторов раскрытия. Вместо этого для определения внешнего вида каждого элемента данных в списке используется шаблон данных. |
| Разделители строк | SeparatorColor, SeparatorVisibility | CollectionView не содержит встроенных разделителей. При желании их можно указать в шаблоне элемента. |
| Выбор | SelectionMode, SelectedItem | CollectionView поддерживает одиночное и множественное выделение. |
| Высота строки | HasUnevenRows, RowHeight | В CollectionView высота строки каждого элемента определяется свойством ItemSizingStrategy. |
| Кэширование | CachingStrategy | CollectionView автоматически использует виртуализацию, обеспечиваемую базовыми собственными элементами управления. |
| Верхние и нижние колонтитулы | Header, HeaderElement, HeaderTemplate, Footer, FooterElement, FooterTemplate | CollectionView может представлять верхний и нижний колонтитулы, которые прокручиваются вместе с элементами списка, с помощью свойств Header, Footer, HeaderTemplate и FooterTemplate. |
| Группирование | GroupDisplayBinding, GroupHeaderTemplate, GroupShortNameBinding, IsGroupingEnabled | CollectionView отображает правильно сгруппированные данные, установив свойство IsGrouped в true. Верхние и нижние колонтитулы групп можно настраивать, устанавливая свойства GroupHeaderTemplate и GroupFooterTemplate для объектов DataTemplate. |
| Обновление путем оттягивания | IsPullToRefreshEnabled, IsRefreshing, RefreshAllowed, RefreshCommand, RefreshControlColor, BeginRefresh(), EndRefresh() | Функциональность Pull to refresh поддерживается путем установки CollectionView в качестве дочернего элемента RefreshView. |
| Элементы контекстного меню | ContextActions | Пункты контекстного меню поддерживаются путем задания SwipeView в качестве корневого представления в шаблоне DataTemplate, определяющем внешний вид каждого элемента данных в CollectionView. |
| Прокрутка | ScrollTo() | CollectionView определяет методы ScrollTo, которые прокручивают элементы в поле зрения. |