Язык программирования C#9 и платформа .NET5

Троелсен Эндрю

}

catch (Exception ex)

{

_dataToShow=ex.Message;

}

}

Большая часть работы связана с отображением скомпилированного ресурса BAML на строку разметки XAML. На рис. 27.12 демонстрируется финальное приложение в действии на примере вывода стандартного шаблона для элемента управления

System.Windows.Controls.DatePicker

. Здесь отображается календарь, который доступен по щелчку на кнопке в правой части элемента управления.

К

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

Построение шаблона элемента управления с помощью инфраструктуры триггеров

Специальный шаблон для элемента управления можно создавать с помощью только кода С#. Такой подход предусматривает добавление данных к объекту

ControlTemplate

и затем присваивание его свойству

Template

элемента управления. Однако большую часть времени внешний вид и поведение

ControlTemplate

будут определяться с использованием разметки XAML и фрагментов кода (мелких или крупных) для управления поведением во время выполнения.

В оставшемся материале главы вы узнаете, как строить специальные шаблоны с применением Visual Studio. Попутно вы ознакомитесь с инфраструктурой триггеров WPF и научитесь использовать анимацию для встраивания визуальных подсказок конечным пользователям. Применение при построении сложных шаблонов только IDE-среды Visual Studio может быть связано с довольно большим объемом клавиатурного набора и трудной работы. Конечно, шаблоны производственного уровня получат преимущество от использования продукта Blend, устанавливаемого вместе с Visual Studio. Тем не менее, поскольку текущее издание книги не включает описание Blend, время засучить рукава и приступить к написанию некоторой разметки.

Для начала создайте новый проект приложения WPF по имени

ButtonTemplate

. Основной интерес в данном проекте представляют механизмы создания и применения шаблонов, так что замените элемент

Grid

следующей разметкой:

<StackPanel Orientation="Horizontal">

<Button x:Name="myButton" Width="100" Height="100" Click="myButton_Click"/>

</StackPanel>

В обработчике события

Click

просто отображается окно сообщения (посредством вызова

MessageBox.Show

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

В настоящее время этот элемент

Button

визуализируется с использованием стандартного шаблона, который представляет собой ресурс BAML внутри заданной сборки WPF, как было проиллюстрировано в предыдущем примере. Определение собственного шаблона по существу сводится к замене стандартного визуального дерева своим вариантом. Для начала модифицируйте определение элемента

Button

, указав новый шаблон с применением синтаксиса "свойство-элемент". Шаблон придаст элементу управления округлый вид.

<Button x:Name="myButton" Width="100" Height="100" Click="myButton_Click">

<Button.Template>

<ControlTemplate>

<Grid x:Name="controlLayout">

<Ellipse x:Name="buttonSurface" Fill="LightBlue"/>

<Label x:Name="buttonCaption"

VerticalAlignment="Center"

HorizontalAlignment="Center"

FontWeight="Bold" FontSize="20" Content="OK!"/>

</Grid>

</ControlTemplate>

</Button.Template>

</Button>

Здесь

определен шаблон, который состоит из именованного элемента

Grid

, содержащего именованные элементы

Ellipse

и

Label

. Поскольку в

Grid

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

Click

будет инициироваться только в ситуации, когда курсор мыши находится внутри границ элемента

Ellipse

(т.е. не на углах, окружающих эллипс). Это замечательная возможность архитектуры шаблонов WPF, т.к. нет нужды повторно вычислять попадание курсора, проверять граничные условия или предпринимать другие низкоуровневые действия. Таким образом, если шаблон использует объект

Polygon

для отображения какой-то необычной геометрии, тогда можно иметь уверенность в том, что детали проверки попадания курсора будут соответствовать форме элемента управления, а не более крупного ограничивающего прямоугольника.

Шаблоны как ресурсы

В текущий момент ваш шаблон внедрен в специфический элемент управления

Button

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

Button

на уровень приложения, вырезав определение шаблона из разметки

Button

и вставив его в дескриптор

Application.Resources

внутри файла

Арр.xaml

. Добавьте атрибуты

Key

и

TargetType

:

<Application.Resources>

<ControlTemplate x:Key="RoundButtonTemplate" TargetType="{x:Type Button}">

<Grid x:Name="controlLayout">

<Ellipse x:Name="buttonSurface" Fill="LightBlue"/>

<Label x:Name="buttonCaption" VerticalAlignment="Center"

HorizontalAlignment="Center"

FontWeight="Bold" FontSize="20" Content="OK!"/>

</Grid>

</ControlTemplate>

</Application.Resources>

Модифицируйте разметку для

Button

, как показано далее:

<Button x:Name="myButton" Width="100" Height="100"

Click="myButton_Click"

Template="{StaticResource RoundButtonTemplate}">

</Button>

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

Button

, которые используют данный шаблон (обрабатывать событие

Click

для них не нужно):