WPF 雜談——Trigger觸發器

筆者在使用的WPF過程當中，見過的觸發器有三種：Trigger、DataTrigger、EventTrigger。其中最爲經常使用的要屬Trigger。至於觸發器的做用就是當某個屬性的值發生變化，應該去作某事。固然這是筆者自身的理解。比較簡單。那麼這三者之間有什麼不一樣呢？這即是這章要討論的目地。WPF的Style筆者喜歡把他看做CSS的樣式。那麼Trigger觸發器大家能夠理解爲CSS樣式中相似於:hover 僞類。這樣子筆者作一個列子吧。以下，當鼠標移動在文本上面的，前景色變成爲紅色。

<Grid>
        <TextBlock Text="I am Aomi" Width="75" Height="20">
            <TextBlock.Style>
                <Style TargetType="TextBlock">
                    <Style.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="Foreground" Value="Red" />
                        </Trigger>
                    </Style.Triggers>
                </Style>
            </TextBlock.Style>
        </TextBlock>
</Grid>

執行結果

鼠標移在上面

相信從上面的例子你至少能夠明白觸發器的做用。並且做用還不小呢？好了。這一點筆者就不須要在重複的去講解了。那麼DataTrigger又跟Trigger有什麼區別呢？能夠說做用上來說沒有什麼區別，可是在面向對象倒是不同子的。Trigger都是專對於控件自身的依賴屬性(dependency properties)。DataTrigger是通常專對於另的控件的屬性，並且都是用綁定來實現的。以下面的例子。

    <Grid>
        <TextBlock Text="I am Aomi" Width="75" Height="20">
            <TextBlock.Style>
                <Style TargetType="TextBlock">
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding IsMouseOver,RelativeSource={RelativeSource Self}}" Value="True">
                            <Setter Property="Foreground" Value="Red" />
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </TextBlock.Style>
        </TextBlock>
    </Grid>

那麼例子的效果跟上一例子同樣子。代碼上面也沒有多大的差異。主要是修改了觸發器的寫法而以。可是咱們要認識到一點：Trigger通常都是跟屬性直接關聯。而DataTrigger是經過綁定來關聯。因此DataTrigger通常用於寫另外一個控件上的屬性在當前控件的觸發效果。固然也能夠綁定自身，如上。那麼在舉一個綁定另外一個控件的屬性吧。以下

<StackPanel Orientation="Vertical">
        <ToggleButton Name="Changer" Content="變紅" Width="75" Height="30"></ToggleButton>
        <TextBlock Text="I am Aomi" Width="75" Height="20">
            <TextBlock.Style>
                <Style TargetType="TextBlock">
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding IsChecked, ElementName= Changer}" Value="True">
                            <Setter Property="Foreground" Value="Red" />
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </TextBlock.Style>
        </TextBlock>
    </StackPanel>

執行結果：

最後一個Eventtrigger通常用於動畫效果的處理。上面倆個觸發器做用對象都是屬性。而這個倒是做用於事件的。表示當前某個事件發生後要觸發。筆者本身寫例子太麻煩了。就到國外複製一個例子過來講明。以下

    <StackPanel Orientation="Vertical">
        <TextBlock Text="I am Aomi" HorizontalAlignment="Center">
            <TextBlock.Style>
                <Style TargetType="TextBlock">
                    <Style.Triggers>
                            <EventTrigger RoutedEvent="MouseEnter">
                                <EventTrigger.Actions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <DoubleAnimation Duration="0:0:0.300" Storyboard.TargetProperty="FontSize" To="28" />
                                        </Storyboard>
                                    </BeginStoryboard>
                                </EventTrigger.Actions>
                            </EventTrigger>
                            <EventTrigger RoutedEvent="MouseLeave">
                                <EventTrigger.Actions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <DoubleAnimation Duration="0:0:0.800" Storyboard.TargetProperty="FontSize" To="18" />
                                        </Storyboard>
                                    </BeginStoryboard>
                                </EventTrigger.Actions>
                            </EventTrigger>
                    </Style.Triggers>
                </Style>
            </TextBlock.Style>
        </TextBlock>
    </StackPanel>

例子的功能很簡單就是當鼠標進入到文字區域的時候文字變大到28字體。若是離開就變成18字體。

執行效果：

上面的觸發器應該來說算是比較簡單而又經常使用。但是都是單個觸發條件。咱們在編寫業務代碼的時候，每每能夠存在多個條件下的觸發效果。因此上面的Trigger和DataTrigger就不能知足需求了。爲了這種狀況，WPF爲Trigger提供了MultiTrigger，爲DataTrigger提供了MultiDataTrigger。除了語法上有必定的區別之外，效果是同樣子的。以下

 <TextBlock Text="I am Aomi" Width="75" Height="20">
            <TextBlock.Style>
                <Style TargetType="TextBlock">
                    <Style.Triggers>
                        <MultiTrigger>
                            <MultiTrigger.Conditions>
                                <Condition Property="IsEnabled" Value="True" />
                                <Condition Property="IsMouseOver" Value="True" />
                            </MultiTrigger.Conditions>
                            <Setter Property="Background" Value="#4d4d4d" />
                        </MultiTrigger>
                    </Style.Triggers>
                </Style>
            </TextBlock.Style>
        </TextBlock>

從上面咱們能夠看到Condition就是多條件。用法用單條件是同樣子的。

執行效果：

最後讓咱們看一下MultiDataTrigger的用法吧。以下

<TextBlock Text="I am Aomi" Width="75" Height="20">
            <TextBlock.Style>
                <Style TargetType="TextBlock">
                    <Style.Triggers>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsChecked,ElementName=Changer  }" Value="True" />
                                <Condition Binding="{Binding IsMouseOver,RelativeSource={RelativeSource Self} }" Value="True" />
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Foreground" Value="Red" />
                        </MultiDataTrigger>
                    </Style.Triggers>
                </Style>
            </TextBlock.Style>
        </TextBlock>

執行效果：