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

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

<Window

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Height="200" Width="600" WindowStartupLocation="CenterScreen"

Title="Growing Label Font!">

<StackPanel>

<Label Content="Interesting...">

<Label.Triggers>

<EventTrigger RoutedEvent="Label.Loaded">

<EventTrigger.Actions>

<BeginStoryboard>

<Storyboard TargetProperty="FontSize">

<DoubleAnimation From="12" To="100" Duration="0:0:4"

RepeatBehavior="Forever"/>

</Storyboard>

</BeginStoryboard>

</EventTrigger.Actions>

</EventTrigger>

</Label.Triggers>

</Label>

</StackPanel>

</Window>

А

теперь подробно разберем пример.

Роль раскадровок

При продвижении от самого глубоко вложенного элемента наружу первым встречается элемент

<DoubleAnimation>

, обращающийся к тем же самым свойствам, которые устанавливались в процедурном коде(

From

,

То

,

Duration

и

RepeatBehavior

):

<DoubleAnimation From="12" To="100" Duration="0:0:4"

RepeatBehavior="Forever"/>

Как упоминалось ранее, элементы

Animation

помещаются внутрь элемента

Storyboard

, применяемого для отображения объекта анимации на заданное свойство родительского типа через свойство

TargetProperty

, которым в данном случае является

FontSize

. Элемент

Storyboard

всегда находится внутри родительского элемента по имени

BeginStoryboard

:

<BeginStoryboard>

<Storyboard TargetProperty="FontSize">

<DoubleAnimation From="12" To="100" Duration="0:0:4"

RepeatBehavior="Forever"/>

</Storyboard>

</BeginStoryboard>

Роль триггеров событий

После того как элемент

BeginStoryboard

определен, должно быть указано действие какого-то вида, которое приведет к запуску анимации. Инфраструктура WPF предлагает несколько разных способов реагирования на условия времени выполнения в разметке, один из которых называется триггером. С высокоуровневой точки зрения триггер можно считать способом реагирования на событие в разметке XAML без необходимости в написании процедурного кода.

Обычно когда

ответ на событие реализуется в С#, пишется специальный код, который будет выполнен при поступлении события. Однако триггер — всего лишь способ получить уведомление о том, что некоторое событие произошло (загрузка элемента в память, наведение на него курсора мыши, получение им фокуса и т.д.).

Получив уведомление о появлении события, можно запускать раскадровку. В показанном ниже примере обеспечивается реагирование на факт загрузки элемента

Label

в память. Поскольку вас интересует событие

Loaded

элемента

Label

, элемент

EventTrigger

помещается в коллекцию триггеров элемента

Label

:

<Label Content="Interesting...">

<Label.Triggers>

<EventTrigger RoutedEvent="Label.Loaded">

<EventTrigger.Actions>

<BeginStoryboard>

<Storyboard TargetProperty="FontSize">

<DoubleAnimation From="12" To="100" Duration="0:0:4"

RepeatBehavior="Forever"/>

</Storyboard>

</BeginStoryboard>

</EventTrigger.Actions>

</EventTrigger>

</Label.Triggers>

</Label>

Рассмотрим еще один пример определения анимации в XAML, на этот раз анимации ключевыми кадрами.

Анимация с использованием дискретных ключевых кадров

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

Чтобы проиллюстрировать применение типа дискретного ключевого кадра, предположим, что необходимо построить элемент управления

Button

, который выполняет анимацию своего содержимого так, что на протяжении трех секунд появляется значение

ОК!

по одному символу за раз. Представленная далее разметка находится в файле

StringAnimation.xaml

. Ее можно скопировать в редактор Kaxaml и просмотреть результаты.

<Window

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Height="100" Width="300"

WindowStartupLocation="CenterScreen" Title="Animate String Data!">

<StackPanel>

<Button Name="myButton" Height="40"

FontSize="16pt" FontFamily="Verdana" Width="100">

<Button.Triggers>

<EventTrigger RoutedEvent="Button.Loaded">