TOC

This article is currently in the process of being translated into French (~27% done).

Les styles:

WPF MultiTrigger and MultiDataTrigger

In the previous chapter, we worked with triggers to get dynamic styles. So far they have all been based on a single property, but WPF also supports multi triggers, which can monitor two or more property conditions and only trigger once all of them are satisfied.

There are two types of multi triggers: The MultiTrigger, which just like the regular Trigger works on dependency properties, and then the MultiDataTrigger, which works by binding to any kind of property. Let's start with a quick example on how to use the MultiTrigger.

MultiTrigger

<Window x:Class="WpfTutorialSamples.Styles.StyleMultiTriggerSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="StyleMultiTriggerSample" Height="100" Width="250">
    <Grid>
        <TextBox VerticalAlignment="Center" HorizontalAlignment="Center" Text="Hover and focus here" Width="150">
            <TextBox.Style>
                <Style TargetType="TextBox">
                    <Style.Triggers>
                        <MultiTrigger>
                            <MultiTrigger.Conditions>
                                <Condition Property="IsKeyboardFocused" Value="True" />
                                <Condition Property="IsMouseOver" Value="True" />
                            </MultiTrigger.Conditions>
                            <MultiTrigger.Setters>
                                <Setter Property="Background" Value="LightGreen" />
                            </MultiTrigger.Setters>
                        </MultiTrigger>
                    </Style.Triggers>
                </Style>
            </TextBox.Style>
        </TextBox>
    </Grid>
</Window>

In this example, we use a trigger to change the background color of the TextBox once it has keyboard focus AND the mouse cursor is over it, as seen on the screenshot. This trigger has two conditions, but we could easily have added more if needed. In the Setters section, we define the properties we wish to change when all the conditions are met - in this case, just the one (background color).

MultiDataTrigger

Tout comme le DataTrigger classique, le MultiDataTrigger est super car il utilise les liaisons de données (bindings) pour surveiller une propriété. Cela signifie que vous pouvez utiliser tout les supers techniques de liaisons de données qu'offre le WPF dont la liaison à une propriété d'un autre contrôle etc... Laissez moi vous montrer comment cela est simple :

<Window x:Class="WpfTutorialSamples.Styles.StyleMultiDataTriggerSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="StyleMultiDataTriggerSample" Height="150" Width="200">
    <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
        <CheckBox Name="cbSampleYes" Content="Yes" />
        <CheckBox Name="cbSampleSure" Content="I'm sure" />
        <TextBlock HorizontalAlignment="Center" Margin="0,20,0,0" FontSize="28">
            <TextBlock.Style>
                <Style TargetType="TextBlock">
                    <Setter Property="Text" Value="Unverified" />
                    <Setter Property="Foreground" Value="Red" />
                    <Style.Triggers>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding ElementName=cbSampleYes, Path=IsChecked}" Value="True" />
                                <Condition Binding="{Binding ElementName=cbSampleSure, Path=IsChecked}" Value="True" />
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Text" Value="Verified" />
                            <Setter Property="Foreground" Value="Green" />
                        </MultiDataTrigger>
                    </Style.Triggers>
                </Style>
            </TextBlock.Style>
        </TextBlock>
    </StackPanel>
</Window>

In this example, I've re-created the example we used with the regular DataTrigger, but instead of binding to just one property, I bind to the same property (IsChecked) but on two different controls. This allows us to trigger the style only once both checkboxes are checked - if you remove a check from either one of them, the default style will be applied instead.

Résumé

Comme vous pouvez le voir, les déclencheurs multiples sont presque aussi faciles à utiliser que des déclencheurs standards et peuvent être extrêmement utiles, particulièrement quand vous développez vos propres contrôles.

This article has been fully translated into the following languages: Is your preferred language not on the list? Click here to help us translate this article into your language!