Шаблоны ячеек ListView

WPF --- Элементы управления WPF --- Шаблоны ячеек ListView

Свойство GridViewColumn.DisplayMemberBinding не является единственным способом для отображения данных в ячейке. Вместо него можно использовать свойство CellTemplate, которое принимает шаблон данных. Этот шаблон данных отличается тем, что он применяется лишь к одному конкретному столбцу. При желании разработчика у каждого столбца может быть собственный шаблон данных.

Шаблоны ячеек (CellTemplate) являются ключевым фрагментом головоломки при настройке GridView. К числу наиболее важных из предоставляемых ими возможностей относится перенос текста. Обычно текст в столбце переносится в однострочном элементе TextBlock. Однако эту деталь можно легко изменить, создав собственный шаблон данных со своей схемой деления:

<GridViewColumn Header="Описание" Width="300">
     <GridViewColumn.CellTemplate>
           <DataTemplate>
                 <TextBlock Text="{Binding Path=Description}" TextWrapping="Wrap" Margin="5"
                         Foreground="DarkOrange"></TextBlock>
                 </DataTemplate>
           </GridViewColumn.CellTemplate>
</GridViewColumn>

Обратите внимание, что для того, чтобы перенос дал результат, ширину столбца необходимо ограничить с помощью свойства Width. Тогда в случае изменения пользователем размера столбца текст будет переноситься заново соответствующим образом. Ограничивать ширину элемента TextBlock не нужно, поскольку тогда текст будет иметь одинаковый размер, каким бы широкими или узким его не делал пользователь.

Единственным ограничением в этом примере является то, что шаблон данных должен явным образом привязываться к отображаемому свойству. Поэтому создать шаблон, обеспечивающий перенос, и использовать его повторно для каждого фрагмента содержимого нельзя. Вместо этого понадобится создать отдельный шаблон для каждого поля. В данном примере это не проблема, но в случае создания более сложного шаблона, который можно было бы применять и к другим спискам (например, шаблона, преобразующего данные в изображение и отображающего его в элементе Image, или шаблона, использующего элемент управления TextBox для обеспечения возможности редактирования), это может оказаться утомительным.

Простого способа для повторного использования любого шаблона на множестве столбцов не существует: вместо этого придется вырезать и вставлять шаблон, а затем изменять привязку.

Было бы совсем неплохо создать шаблон данных, включающий свойство DisplayMemberBinding. Тогда DisplayMemberBinding можно было бы применять для извлечения необходимого свойства, a CellTemplate — для форматирования находящегося в нем содержимого в подходящее визуальное представление. К сожалению, такой вариант просто не возможен. В случае, когда устанавливаются оба свойства DisplayMember и CellTemplate, класс GridViewColumn использует для установки содержимого ячейки свойство DisplayMember, а шаблон просто игнорирует.

Возможности шаблонов данных не ограничиваются только возможностью настройки свойств элемента TextBlock. Шаблоны данных можно также использовать и для предоставления совершенно других элементов.

Например, в следующем столбце шаблон данных применяется для отображения рисунка. Конвертер ProductImagePath отвечает за загрузку соответствующего файла изображения из файловой системы:

<GridViewColumn Header="Картинка">
         <GridViewColumn.CellTemplate>
               <DataTemplate>
                      <Image Source="{Binding Path=ProductImagePath,Converter={StaticResource ImagePathConverter}}"></Image>
               </DataTemplate>
         </GridViewColumn.CellTemplate>
   </GridViewColumn>

При создании шаблона данных можно определить его как внутристрочный (что и было сделано в двух предыдущих примерах) или сослаться на ресурс, определенный в другом месте. Поскольку шаблоны столбцов нельзя использовать повторно для различных полей, обычно наиболее правильным подходом является все-таки первый вариант.

Шаблоны можно варьировать, чтобы разные элементы данных получали разные шаблоны. Для этого необходимо создать селектор шаблонов, выбирающий подходящий шаблон на основании свойств находящегося в конкретной позиции объекта данных. Если такая функциональная возможность необходима, создайте селектор и примените его для установки свойства GridViewColumn.CellTemplateSelector.

Настройка заголовков столбцов

Шаблоны ячеек не являются единственными шаблонами, которые можно применять с ListView. Можно также использовать и шаблоны заголовков столбцов для изменения внешнего вида заголовков столбцов, если стандартный прямоугольник с серой заливкой не устраивает.

Пока что было показано только, каким образом настраивать внешний вид значений в каждой ячейке. Однако изменение внешнего вида заголовков столбцов еще не демонстрировалось. Тех, кого стандартные прямоугольники с серой заливкой не впечатляют, несомненно, обрадует тот факт, что содержимое и внешний вид заголовков столбцов можно изменять так же легко, как и значения столбцов. На самом деле существует даже несколько вариантов.

При желании оставить стандартные прямоугольники с серой заливкой, но заполнить их своим собственным содержимым, можно установить свойство GridViewColumn.Header. В предыдущих примерах свойство Header использовалось с обычным текстом, но вместо него можно предоставить и, например, элемент StackPanel, упаковывающий элементы TextBlock и Image, и создать необычный заголовок с текстом и рисунком внутри.

Если требуется заполнить заголовки столбцов собственным содержимым, но не указывать это содержимое отдельно для каждого столбца, можно воспользоваться свойством GridViewColumn.HeaderTemplate для определения подходящего шаблона данных. Этот шаблон данных привязывается к любому объекту, который был указан в свойстве GridViewColumn.Header, и представляет его соответствующим образом.

Чтобы изменить форматирование конкретного заголовка столбца, необходимо с помощью свойства GridViewColumn.HeaderContainerStyle предоставить нужный стиль. Для переформатирования всех заголовков столбцов одинаковым образом следует использовать свойство GridView.ColumnHeaderContainerStyle.

Но если необходимо полностью изменить внешний вид заголовка (например, заменить прямоугольник с серой заливкой на границу со скругленными углами и фоном голубого цвета), можно предоставить для него совершенно новый шаблон элемента управления. Чтобы сделать это для одного конкретного столбца, следует воспользоваться свойством GridViewColumn.HeaderTemplate, а для всех столбцов сразу — свойством GridView.ColumnHeaderTemplate. Вдобавок также можно применить и селектор шаблонов для выбора правильного шаблона для данного заголовка, установив свойство GridViewColumn.HeaderTemplateSelector или GridView.ColumnHeaderTemplateSelector.