WPF中的Style

一、Style基础知识

构成Style最重要的两种元素是Setter和Trigger

　　Setter类帮助我们设置控件的静态外观风格

　　Trigger类帮助我们设置控件的行为风格

Setter类的Property属性是用来指明你想为目标的哪个属性赋值；Value属性则是你提供的属性值：例如在Window的资源词典中放置一个针对TextBlock的Style，Style中使用若干          Setter来设定TextBlock的一些属性，这样程序中的TextBlock就会具有统一的风格，除非使用{x:Null}显示地清空Style.

Trigger类最基本的是触发器，Property是Trigger关键的属性名称，Value是触发条件，Trigger类还有一个Setters属性，此属性是一组Setter，一旦触发条件被满足，这组Setter           的“属性-值”就会被应用，触发条件不再满足后，各属性值会被还原。

二、案例

1、  Style中的Setter

<Window x:Class="Style中的Setter.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <Style TargetType="TextBlock">
            <Style.Setters>
                <Setter Property="FontSize" Value="24"/>
                <Setter Property="TextDecorations" Value="Underline"/>
                <Setter Property="FontStyle" Value="Italic"/>
            </Style.Setters>
        </Style>
    </Window.Resources>
    <StackPanel Margin="5">
        <TextBlock Text="Hello Wpf"/>
        <TextBlock Text="This is a sample"/>
        <TextBlock Text="by time 2009" Style="{x:Null}"></TextBlock>
    </StackPanel>
</Window>

Style中的Trigger

<Window x:Class="Style中的Trigger.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <Style TargetType="CheckBox" x:Key="myStyle">
            <Style.Triggers>
                <Trigger Property="IsChecked" Value="True">
                    <Setter Property="FontSize" Value="20"/>
                    <Setter Property="Foreground" Value="Orange"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <StackPanel>
        <CheckBox Content="悄悄地我走了" Margin="5" Style="{StaticResource myStyle}"/>
        <CheckBox Content="正如我轻轻的来" Margin="5"/>
        <CheckBox Content="我挥一挥衣袖" Margin="5"/>
        <CheckBox Content="不带走一片云彩" Margin="5"/>
    </StackPanel>
</Window>

如果想全部应用的话那就去掉x:Key="myStyle"

2、MultiTrigger:(叫MultiConditionTrigger更合适)因为必须多个条件同时满足的时候才会被触发，MultiTrigger比Trigger多了一个Conditions属性，需要同时成立的条件就被存储在这个集合中。

    <Window.Resources>
        <Style TargetType="CheckBox">
            <Style.Triggers>
                <MultiTrigger>
                    <MultiTrigger.Conditions>
                        <Condition Property="IsChecked" Value="True"/>
                        <Condition Property="Content" Value="正如我轻轻的来"/>
                    </MultiTrigger.Conditions>
                    <MultiTrigger.Setters>
                        <Setter Property="FontSize" Value="20"/>
                        <Setter Property="Foreground" Value="Orange"/>
                    </MultiTrigger.Setters>
                </MultiTrigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <StackPanel>
        <CheckBox Content="轻轻的我走了"/>
        <CheckBox Content="正如我轻轻的来"/>
        <CheckBox Content="我轻轻的招手"/>
        <CheckBox Content="不带走一片云彩"/>
    </StackPanel>

3、由数据触发的DataTrigger

    <Window.Resources>
        <local:L2BConverter x:Key="cvtr"/>
        <Style TargetType="TextBox">
            <Style.Triggers>
                <DataTrigger Binding="{Binding RelativeSource={x:Static RelativeSource.Self},Path=Text.Length,Converter={StaticResource cvtr}}" Value="false">
                    <Setter Property="BorderBrush" Value="Red"/>
                    <Setter Property="BorderThickness" Value="11"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <StackPanel>
        <TextBox Margin="5"/>
        <TextBox Margin="5"/>
        <TextBox Margin="5"/>
    </StackPanel>

    class L2BConverter:IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            int textLength = (int) value;
            return textLength >  ? true : false;
        }

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

4、多数据条件触发的MultiDataTrigger：有时我们会遇到要求多个数据同时满足时才能触发变化的需求，此时可以考虑使用MultiDataTrigger

<Window x:Class="多数据条件触发的MultiDataTrigger.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:多数据条件触发的MultiDataTrigger"
        xmlns:collections="clr-namespace:System.Collections;assembly=mscorlib"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <Style TargetType="ListBoxItem">
            <!--使用Style设置DataTemplate-->
            <Setter Property="ContentTemplate">
                <Setter.Value>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal">
                            <TextBlock Text="{Binding ID}"/>
                            <TextBlock Text="{Binding Name}"/>
                            <TextBlock Text="{Binding Age}"/>
                        </StackPanel>
                    </DataTemplate>
                </Setter.Value>
            </Setter>
            <!--MultiDataTrigger-->
            <Style.Triggers>
                <MultiDataTrigger>
                    <MultiDataTrigger.Conditions>
                        <Condition Binding="{Binding Path=ID}" Value="2"/>
                        <Condition Binding="{Binding Path=Name}" Value="Tom"/>
                    </MultiDataTrigger.Conditions>
                    <MultiDataTrigger.Setters>
                        <Setter Property="Background" Value="Orange"/>
                    </MultiDataTrigger.Setters>
                </MultiDataTrigger>
            </Style.Triggers>
        </Style>
        <!--数据源-->
        <!--<collections:ArrayList x:Key="stuList">
            <local:Student ID="1" Name="One" Age="1"/>
            <local:Student ID="2" Name="Two" Age="2"/>
            <local:Student ID="3" Name="Three" Age="3"/>
        </collections:ArrayList>-->
    </Window.Resources>
    <StackPanel>
        <ListBox x:Name="list" Margin="5" />
    </StackPanel>
</Window>

            List<Student> stuList=new List<Student>()
                {
                    new Student(){ID = ,Name = "One",Age = },
                    new Student(){ID = ,Name = "Two",Age = },
                    new Student(){ID = ,Name = "Three",Age = },
                    new Student(){ID = ,Name = "Tom",Age = }
                };
            this.list.ItemsSource = stuList;
        }

5、由事件触发的EventTrigger

EventTrigger是触发器中最特殊的一个。首先，它不是由属性值或数据的变化来触发而是由事件来触发；其次，被触发后它并非应用一组Setter，而是执行一段动画。

<Window x:Class="由事件触发的EventTrigger.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <Style TargetType="Button">
            <Style.Triggers>
                <!--鼠标进入-->
                <EventTrigger RoutedEvent="MouseEnter">
                    <BeginStoryboard>
                        <Storyboard>
                            <DoubleAnimation To="150" Duration="0:0:0.2" Storyboard.TargetProperty="Width"/>
                            <DoubleAnimation To="150" Duration="0:0:0.2" Storyboard.TargetProperty="Height"/>
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
                <!--鼠标退出-->
                <EventTrigger RoutedEvent="MouseLeave">
                    <BeginStoryboard>
                        <Storyboard>
                            <DoubleAnimation Duration="0:0:0.2" Storyboard.TargetProperty="Width"/>
                            <DoubleAnimation Duration="0:0:0.2" Storyboard.TargetProperty="Height"/>
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <Grid>
        <Button Width="40" Height="40"></Button>
    </Grid>
</Window>