Каковы различные триггеры в WPF?

Каковы различные триггеры в WPF? Как они отличаются и когда я должен их использовать?

Я видел следующие триггеры:

  • Trigger
  • DataTrigger
  • MultiTrigger
  • MultiDataTrigger
  • EventTrigger

ОТВЕТЫ

Ответ 1

A Триггер обычно используется в Style или ControlTemplate. Он запускает свойства шаблона, заданного шаблоном, и устанавливает другие свойства элемента управления (или отдельных элементов шаблона). Например, вы должны использовать Trigger on IsMouseOver для ответа на мышь, находящуюся над элементом управления, и сеттеры могут обновить кисть, чтобы показать "горячий" эффект.

DataTrigger запускает привязку данных, а не свойство управления. Он обычно используется в DataTemplate. Например, вы можете использовать DataTrigger для изменения цвета элемента в DataTemplate, если свойство AlertLevel было равно ZomgWereAllGoingToDie. DataTriggers также могут быть полезны в шаблонах управления, если вы хотите активировать "преобразованное" свойство управления (т.е. Использовать IValueConverter в триггерном тесте). Например, вы можете использовать DataTrigger для поворота TextBox Foreground красным цветом, если свойство Text, считающееся номером, было отрицательным, используя DataTrigger с подходящим IValueConverter и RelativeSource Self или TemplatedParent.

MultiTrigger и MultiDataTrigger одинаковы, за исключением того, что они позволяют указывать несколько условий (свойств или привязок соответственно) и вступать в силу только при выполнении всех условий.

Наконец, EventTrigger используется для запуска действий в ответ на события (в отличие от изменения одного состояния в ответ на другое состояние). Например, вы можете использовать EventTrigger для ответа на событие MouseEnter. EventTriggers обычно используются для выполнения раскадровки, например для выполнения анимации при возникновении события.

Ответ 2

Trigger обычно используется в Style или ControlTemplate. Он запускает свойства любого шаблона и устанавливает другие свойства элемента управления (или определенных элементов шаблона). Например, вы бы использовали триггер на IsMouseOver, чтобы реагировать на то, что мышь находится над элементом управления, а setters может обновить кисть, чтобы показать "горячий" эффект.

Зачем использовать триггеры?

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

Сколько типов триггеров есть в WPF?

WPF поддерживает пять типов триггеров; они:

  1. Триггер свойства
  2. Триггер данных
  3. MultiTrigger
  4. MultiDataTrigger
  5. Триггер события

Триггер свойства

Самая простая форма триггера - это триггер свойства; он следит за тем, чтобы свойство зависимости имело определенное значение. Например, если мы хотим подсветить кнопку желтым цветом, когда пользователь наводит на нее мышь, мы можем сделать это, наблюдая, чтобы свойство IsMouseOver имело значение "True".

Property Trigger Выполняет коллекции сеттеров при изменении значения свойства UIElements.

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

<Style x:Key="ButtonStyle" TargetType="{x:Type Button}">
    <Style.Triggers>
        <Trigger Property="IsPressed" Value="True">
            <Setter Property="Opacity" Value="0.5" />
        </Trigger>
        <Trigger Property="IsEnabled" Value="False">
            <Setter Property="Foreground" Value="Red" />
        </Trigger>
    </Style.Triggers>
</Style>

В приведенном выше коде Trigger создается на кнопке. Он установит Opacity на 0,5, когда свойство кнопки IsPressed изменится. Вы можете установить триггер для любого свойства зависимости элемента управления. например,

 <Style x:Key="NormalStyle">
            <Setter Property="Control.FontSize" Value="20"></Setter>
            <Setter Property="Control.HorizontalAlignment" Value="Center"></Setter>
            <Setter Property="Control.Margin" Value="10"></Setter>
            <Setter Property="Control.Foreground" Value="Black"></Setter>
            <Style.Triggers>
                <Trigger Property="Control.IsMouseOver" Value="true">
                    <Setter Property="Control.FontStyle" Value="Italic"></Setter>
                    <Setter Property="Control.Foreground" Value="Red"></Setter>
                    <Setter Property="Control.Background" Value="Yellow"></Setter>
                </Trigger>
                <Trigger Property="Button.IsPressed" Value="true">
                    <Setter Property="Control.Foreground" Value="Green"></Setter>
                    <Setter Property="Control.Background" Value="Blue"></Setter>
                </Trigger>              
            </Style.Triggers>
        </Style>

MultiTrigger

MultiTrigger используется для установки действия при изменении нескольких свойств. Он будет выполнен, когда все условия будут выполнены в MulitTrigger. Условие.

<Style x:Key="MulitTriggerButtonStyle" TargetType="Button">
    <Style.Triggers>
        <MultiTrigger>
            <MultiTrigger.Conditions>
                <Condition Property="IsPressed" Value="True" />
                <Condition Property="Background" Value="BlanchedAlmond" />
            </MultiTrigger.Conditions>
            <MultiTrigger.Setters>
                <Setter Property="Foreground" Value="Blue" />
                <Setter Property="BorderThickness" Value="5" />
                <Setter Property="BorderBrush" Value="Blue" />
            </MultiTrigger.Setters>
        </MultiTrigger>
    </Style.Triggers>
</Style>

Триггер события

Event Trigger используется для выполнения действия при поднятии RoutedEvent FrameworkElement. Event Trigger обычно используется для выполнения некоторой анимации элемента управления (например, colorAnimation, doubleAnumation с использованием KeyFrame и т.д.)

Давайте сначала поймем Storyboard и Animation.

Animations:

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

 изменить цвет фона элемента управления  повернуть экран на angular 90 градусов  перемещать объект из одного места в другое  Изменить непрозрачность (FadeIn/FadeOut) круга.

Анимация используется со свойством элемента UIElement. WPF предоставляет различные типы анимации, используемые со свойствами, например:

ColorAnimation: используется для анимации/изменения свойства цвета (SolidColorBrush, LinearGradientBrush) UIElement в течение определенной длительности. У него есть два свойства:

От (источник) и до (цель)

<Border Name="border1" Width="100" Height="30"
    BorderBrush="Black" BorderThickness="1">
    <Border.Background>
        <SolidColorBrush x:Name="MyBorder" Color="LightBlue" />
    </Border.Background>
    <Border.Triggers>
        <EventTrigger RoutedEvent="Mouse.MouseEnter">
            <BeginStoryboard>
               <Storyboard>
                <ColorAnimation Duration="0:0:1"
                    Storyboard.TargetName="MyBorder"
                    Storyboard.TargetProperty="Color" To="Gray" />
               </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Border.Triggers>
 </Border>

Пример 2:

<TextBlock Visibility="Collapsed" Style="{StaticResource CDCStandardTextBlockStyle}" Name="TxtBlockTerminatingHeading" Text="{Binding NotifyOnTargetUpdated=True}" Foreground="Red" TextWrapping="Wrap" Margin="10,10,10,0">
 <TextBlock.Triggers>
                    <EventTrigger RoutedEvent="Binding.TargetUpdated">
                        <EventTrigger.Actions>
                            <BeginStoryboard>
                                <Storyboard BeginTime="00:00:00" RepeatBehavior="Forever" 
Storyboard.TargetName="TxtBlockTerminatingHeading" 
Storyboard.TargetProperty="(Foreground).(SolidColorBrush.Color)">
                                    <ColorAnimation From="Red" To="#f0f0f0" 
Duration="0:0:1"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </EventTrigger.Actions>
                    </EventTrigger>
                </TextBlock.Triggers>
            </TextBlock>

Пример 3:

<ListBox Name="employeeListBox" ItemsSource="{Binding 
empList}" Grid.Row="0" SelectedItem="{Binding SelectedIndex}">
      <i:Interaction.Triggers>
        <i:EventTrigger EventName="SelectionChanged">
          <i:InvokeCommandAction Command="{Binding MyCommand}" CommandParameter="{Binding 
ElementName=employeeListBox, Path=SelectedValue}"/>
        </i:EventTrigger>
      </i:Interaction.Triggers>
    </ListBox>

DataTrigger

DataTriggers - это триггеры, которые следят за связанным значением вместо Dependency Property. Они позволяют вам наблюдать связанное выражение и будут реагировать, когда эта привязка оценивается равной вашему значению. Как следует из названия, DataTrigger применяет значение свойства для выполнения действия с данными, связывающимися с элементом UIElement. DataTrigger позволяет установить значение свойства, когда данные привязки соответствуют указанному условию. Например:

<DataTemplate>
    <Grid Margin="0 5 0 0">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <Image x:Name="viewImage"
            Grid.Row="0" Width="100"             
            Height="60" HorizontalAlignment="Center"            
            Source="{Binding Picture}" Stretch="Fill" />            
        <TextBlock x:Name="viewText"
            Grid.Row="1" Margin="0 5 0 0"            
            HorizontalAlignment="Center"
            FontWeight="Black" Foreground="Green"            
            Text="{Binding Title}" />
    </Grid>
    <DataTemplate.Triggers>
       <DataTrigger Binding="{Binding Path=Picture}" Value="{x:Null}">
        <Setter TargetName="viewImage" Property="Source" Value="/Images/noImage.png" />
        <Setter TargetName="viewText" Property="Text" Value="No Image Available" />
        <Setter TargetName="viewText" Property="Foreground" Value="Red" />
       </DataTrigger>
    </DataTemplate.Triggers>
</DataTemplate>
<Style.Triggers>
                <DataTrigger Binding="{Binding ElementName=textBox1, Path=Text.Length}" 
Value="0">
                    <Setter Property="IsEnabled" Value="False"></Setter>
                </DataTrigger>
            </Style.Triggers>
        </Style>

MultiDataTrigger

MultiTrigger и MultiDataTrigger одинаковы, за исключением того, что они позволяют указывать несколько условий (соответственно свойств или привязок) и вступают в силу только при выполнении всех условий.

<DataTemplate.Triggers>
    <MultiDataTrigger>
        <MultiDataTrigger.Conditions>
            <Condition Binding="{Binding Path=Picture}" Value="{x:Null}" />
            <Condition Binding="{Binding Path=Title}" Value="Waterfall" />
        </MultiDataTrigger.Conditions>
        <MultiDataTrigger.Setters>
           <Setter TargetName="viewImage" Property="Source" Value="/Images/noImage.png"/>
           <Setter TargetName="viewImage" Property="Opacity" Value="0.5" />
           <Setter TargetName="viewText" Property="Background" Value="Brown" />
        </MultiDataTrigger.Setters>
    </MultiDataTrigger>
</DataTemplate.Triggers>