Aller au contenu

Trigger

De Banane Atomic
Version datée du 16 juin 2020 à 15:42 par Nicolas (discussion | contributions) (DataTrigger with a Converter)
(diff) ← Version précédente | Voir la version actuelle (diff) | Version suivante → (diff)

Définition

Déclencheur d'actions en fonctions d’événements (souris ou clavier) ou de modifications de valeurs (propriétés ou data binding).

Propriété Trigger

La propriété Trigger fonctionne avec les propriétés des composants graphiques.

<Window.Resources>
    <Style TargetType="{x:Type TextBox}">
        <Style.Triggers>
            <!-- Déclenchement du Trigger sur la propriété IsMouseOver de la TextBox -->
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Background" Value="Cyan" />
            </Trigger> ...

DataTrigger

The Value property can not be bound because it is not a dependency property.

DataTrigger fonctionne avec les propriétés de l'objet référencé par le Binding.

<TextBlock Foreground="Black">
    <TextBlock.Style>
        <Style TargetType="{x:Type TextBlock}">
             <!-- Le trigger ne peut pas redéfinir les propriétés définies dans
             le control (ex : Foreground), pour faire cela, il faut plutôt
             définir les proprétés dans le Style -->
            <Setter Property="Background" Value="White"/>
            <Style.Triggers>
                <!-- Le trigger est déclenché lorsque Propriété passe à True -->
                <DataTrigger Binding="{Binding Path=Propriété}" Value="True">
                    <!-- Lorsque le trigger est déclenché, la propriété
                    Background est mise à Red. Lorsque Propriété passe à False,
                    Background reprend sa valeur initiale (White) -->
                    <Setter Property="Background" Value="Red"/>
                </DataTrigger> ...

DataTrigger with a Converter

<UserControl.Resource>
    <local:IsValueAbove100Converter x:Key="IsValueAbove100Converter" />
    <Style x:Key="RedAbove100Style"
           TargetType="TextBlock">
        <!-- define the DataContext type -->
        <d:Style.DataContext>
            <x:Type Type="local:ItemViewModel" />
        </d:Style.DataContext>

        <Style.Triggers>
            <DataTrigger Binding="{Binding Amount, Converter={StaticResource IsValueAbove100Converter}}"
                         Value="True">
                <Setter Property="Foreground" Value="Red" />
            </DataTrigger>
        </Style.Triggers>
    </Style>
</UserControl.Resource>

<TextBlock Text="{Binding Amount}"
           Style="{StaticResource RedAbove100Style}" />
IsValueAbove100Converter.cs
[ValueConversion(typeof(decimal), typeof(bool))]
class IsValueAbove100Converter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        if (value is decimal number)
        {
            return number > 100m;
        }

        return DependencyProperty.UnsetValue;
    }

    public object ConvertBack(object value, Type targetTypes, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

MultiDataTrigger

Comme pour le DataTrigger mais avec plusieurs conditions de déclenchement.

<TextBox Text="TTT">
    <TextBox.Style>
        <Style TargetType="{x:Type TextBox}">
            <Setter Property="Background" Value="Green" />
            <Style.Triggers>
                <MultiDataTrigger>
                    <MultiDataTrigger.Conditions>
                        <!-- Ce Binding fait référence à la TextBox elle-même. Equivalent à la Propriété Trigger -->
                        <Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsMouseOver}"
                                          Value="True"/>
                        <!-- Ce Binding fait référence à la propriété ChangeColor du DataContext -->
                        <Condition Binding="{Binding Path=ChangeColor}" Value="True"/>
                    </MultiDataTrigger.Conditions>
                    <Setter Property="Background" Value="Orange" />
                </MultiDataTrigger> ...

EventTrigger

L'EventTrigger est utilisé pour déclencher une animation suite à un événement.

<UserControl>
    <UserControl.Triggers>
        <!-- Déclenchement lors du double-click sur le UserControl -->
        <EventTrigger RoutedEvent="UserControl.MouseDoubleClick">
            <EventTrigger.Actions>
                <BeginStoryboard>
                    <Storyboard/>
                </BeginStoryboard>
            </EventTrigger.Actions>
        </EventTrigger>

Pour lier un événement au lancement d'une commande, il vaut mieux utiliser InvokeCommandAction ou EventToCommand.