Через приклади всіх видів

Часто може траплятися так, що нам потрібно відображати елементи неоднорідної колекції у списку, і кожен елемент списку повинен виглядати по-різному, відображаючи різні властивості, незалежно від конкретних типів. Погляньмо тепер на наочний приклад.

фрагменти

Список

Елементи зберігаються у ListView. Це не рідкість для застосувань технології XAML. Спочатку ми деталізуємо трохи приклад та його “казку”.

Модельні класи

У нас є система реєстрації птахів. Наступні характеристики птахів рівномірно реєструються:

  • Ім'я,
  • kor (вік),
  • Особистість,
  • Задоволення. Це може бути залишок
  • годувати (Feed) і
  • лякати (лякати) У результаті годування та лякання наш птах якось коливається в масштабі 1-5 залежно від виду. Особистість - це перерахування.

Загальним інтерфейсом для опису птахів є IBird. Оскільки різні породи птахів по-різному реагують на годування та відлякування, їх реалізація різна, їх розміщують в окремих класах. Зараз у нас буде клас Сова, Сова та Голуб, Голуб, який реалізує інтерфейс IBird.

Зразки даних

Для простоти тепер ми додаємо зразки даних у файл із кодом, ми не використовуємо шаблон MVVM, мета не в тому, щоб описати його. Не забудьте встановити DataContext, використовувати ObservabeCollection як властивість для списку та ініціалізувати його!

Примітка: поточний приклад використовує технологію WPF, для технології UWP це стосуватиметься об'єкта Page, а не Window. Що стосується представлення вашого DataTemplete, це не має нічого спільного з цим.

ListView

Додайте ListView до відображуваного MainWindow (WPF)/MainPage (UWP) та виконайте прив'язку даних!

DataTemplate

Для того, щоб мати можливість змінити відображення за типом, ми спочатку визначаємо шаблони, які будуть використовуватися в коді XAML. Примітка: Для WPF, для UWP

Що це робить? Ми матимемо OwlDataTemplate, DoveDataTemplate і DefaultDataTemplate DataTemplate, які дещо відрізняються за стилем (наприклад, колір тла).

DataTemplateSelector

Програма автоматично не визначить, чи використовувати OwlDataTemplate для типу Owl. Для цього нам потрібно написати власний DataTemplateSelector.

Переконайтеся, що там також є гілка за замовчуванням у корпусі комутатора!

... І зв’язок цілого

Готові деталі «замішують разом».

App.xaml

По-перше, нам потрібно додати DataTemplateSelector як ресурс в App.xaml.

Це зробило DataTemplateSelector посиланням та придатним для використання в програмі.

Змінити ListView

Ви вже маєте ItemsSource, тепер з’являється ItemTemplateSelector.

Ми до цього готові.

Наступна поправка

Якщо ви хочете вести облік інших видів птахів, вони також матимуть зовнішній вигляд за замовчуванням. Для ілюстрації цього додайте новий вид птахів та додайте його до нашого списку, а потім подивіться на результат!

Більше інформації

Офіційна документація для DataTemplateSelector знаходиться тут.