wpf 使用style 设置样式

wpf中style

构成style最重要的两种元素: setter 和trigger
setter类帮助我们设置控件的静态外观风格,Trigger类帮助我们设置控件的行为风格

Setter

setter 类的Property属性用来指明你想为目标的哪个属性赋值;Setter类的Value属性则是你提供的属性值。如果在window的资源字典中放置一个针对TextBlock的style,style中使用若干Setter来设定TextBlock的一些属性,这样程序中的Text Block就会具有统一的风格,除非你使用{x:Null} 来显示的清空style

Trigger

trigger,即当某些条件满足时会触发一个行为。trigger也有Property和value 属性,property是trigger关注的属性名称,value是触发条件。trigger类还有一个setters属性,次属性值是一组setter,一旦触发条件被满足,这组setter的“属性–值”就会被应用,触发条件不再满足后,各属性值会被还原。

multitrigger

当多个条件同时满足时,触发器才会被触发。multiTrigger比Trigger多了一个conditions属性,需要同时满足的条件就存储在这个集合中。

DataTrigger

程序中经常会遇到基于数据执行某些判断情况,遇到这种情况时可以考虑使用Datatrigger。dataTrigger对象的Binding属性会把数据源源不断送过来,一旦送来的值与value属性一致,dataTrigger即被触发。

MultiDataTrigger

有时会遇到要求多个条件同时满足时才能触发的需求。

EventTrigger

eventTrigger是触发器中最特殊的一个。首先,它不是由属性或数据变化来触发而是由事件来触发;
其次,被触发后它并非应用一组setter,而是执行一段动画。因此,UI层的动画效果往往与EventTrigger 相关联

代码示例

代码下载地址

点击下载

<Window x:Class="WpfApp11Style02.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp11Style02"
        mc:Ignorable="d"
        Title="MainWindow" Height="600" Width="800">
    
    <!--资源字典-->
    <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>

     
       <!--<Style TargetType="CheckBox">
            <Style.Triggers>
                <Trigger Property="IsChecked" Value="true">
                    <Trigger.Setters>
                        <Setter Property="FontSize" Value="20"/>
                        <Setter Property="Foreground" Value="Orange"/>
                    </Trigger.Setters>
                </Trigger>
            </Style.Triggers>
        </Style>-->


        <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>

        <local:L2BConvert 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="1"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>


        <Style TargetType="ListBoxItem">
            <Setter Property="ContentTemplate">
                <Setter.Value>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal">
                            <TextBlock Text="{Binding ID}" Width="60"/>
                            <TextBlock Text="{Binding Name}" Width="120"/>
                            <TextBlock Text="{Binding Age}" Width="60"/>
                        </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>

       <!--eventTrigger-->
            <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>
    
    <!--窗体-->
    <StackPanel Margin="5">
        <TextBlock Text="Hello WPF!"/>
        <TextBlock Text=" This is a sample for Style"/>
        <!--不使用style-->
        <TextBlock Text="by Tim 2009.12.23" Style="{x:Null}"/>


        <CheckBox Content="悄悄地我走了" Margin="5"/>
        <CheckBox Content="正如我悄悄的来" Margin="5,0"/>
        <CheckBox Content="我挥一挥衣袖" Margin="5"/>
        <CheckBox Content="不带走一片云彩" Margin="5,0"/>


        <TextBox Margin="5"/>
        <TextBox Margin="5,0"/>
        <TextBox Margin="5"/>

        <ListBox x:Name="listBoxStudent" Margin="5"/>
        
        <Button Width="40" Height="40" Content="OK"/>
    </StackPanel>
</Window>

图片效果展示
在这里插入图片描述

  • 1
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值