基本样式设置
Style 设置指定对象的属性
属性:
TargetType 引用在哪个类型上面,例如Button、Textblock。。
如果在控件对象里面设置Style,则TargetType必须指定当前控件名
只在作用域里面有效果,其他的相同控件没有影响,作用域类似于C#中的大括号
Setters 集合 设置属性的集合 可以省略
原理就是反射,根剧控件的属性进行设置值,反射到控件属性
设置的属性 优先使用控件上的指定属性,控件属性>Style属性
Property 属性
Value 属性的值
Triggers 集合 触发器 监听 不可以省略
Property 监听的属性
Value 当监听的属性 == 这个Value的时候 执行以下方法 在下方写满足之后的方法 Trigger.Setters(此时的Setters也可以省略)
<Button><Button.Style><Style TargetType="Button"><!--<Style.Setters> 可以省略--><Style.Setters><Setter Property="Content" Value="Btn"/><Setter Property="FontSize" Value="50"/><Setter Property="Height" Value="100"/><Setter Property="Width" Value="200"/><Setter Property="Background" Value="Orange"/></Style.Setters></Style></Button.Style>
</Button>
<Style.Triggers><Trigger Property="Background" Value="Orange"><!--满足条件执行--><!--<Trigger.Setters> 可以省略--><Trigger.Setters><Setter Property="Content" Value="被Trigger改变了"/></Trigger.Setters></Trigger>
</Style.Triggers>
由此可以看到我们按钮的Content被触发器给修改了
样式触发器设置
样式触发器:根据用户行为,改变控件外观
MultiTrigger 多重条件
需求:当需要多个条件一起才能触发的时候,使用
<MultiTrigger><MultiTrigger.Conditions><Condition Property="Background" Value="Orange"/><Condition Property="Content" Value="Btn"/></MultiTrigger.Conditions><!--两个都满足才会触发--><!--<MultiTrigger.Setters> 可以省略--><MultiTrigger.Setters><Setter Property="Foreground" Value="Green"/></MultiTrigger.Setters>
</MultiTrigger>
还是上面的图为案例代码:
EventTrigger 事件触发
需求:当需要点击获取鼠标等事件触发的时候,使用此方法
此方法仅可以使用动画去变化,不可以直接Setter
<!--必须设置路由事件 RoutedEvent-->
<EventTrigger RoutedEvent="MouseMove"><BeginStoryboard><Storyboard><DoubleAnimation Duration="0:0:0.5" To="200"Storyboard.TargetProperty="Width" /><DoubleAnimation Duration="0:0:0.5" To="400"Storyboard.TargetProperty="Height" /></Storyboard></BeginStoryboard>
</EventTrigger>
当我鼠标进入的时候,变成这个样子:触发生效
补充
需求:我需要鼠标进入的时候变大,鼠标出去的时候正常大小
利用触发器触发和离开的方法
<Trigger Property="IsMouseOver" Value="True"><!--EnterActions 开始触发--><Trigger.EnterActions><BeginStoryboard><Storyboard><DoubleAnimation Duration="0:0:0.5" To="400"Storyboard.TargetProperty="Width"/><DoubleAnimation Duration="0:0:0.5" To="400"Storyboard.TargetProperty="Height"/></Storyboard></BeginStoryboard></Trigger.EnterActions><!--ExitActions 退出触发--><Trigger.ExitActions><BeginStoryboard><Storyboard><DoubleAnimation Duration="0:0:0.5" To="200"Storyboard.TargetProperty="Width"/><DoubleAnimation Duration="0:0:0.5" To="100"Storyboard.TargetProperty="Height"/></Storyboard></BeginStoryboard></Trigger.ExitActions>
</Trigger>
鼠标进入:
鼠标离开:
注意:触发器的渲染是从上至下,同样的触发下面的动作会覆盖上面的动作。
访问级别
越接近对象,级别越高
样式继承
BasedOn: 继承父样式
样式继承必须单独写在资源里面
SunBtn样式中只写了前景色,因为继承了PreBtn的样式,所以长宽背景色都继承了。
<Window.Resources><Style TargetType="Button" x:Key="preStyle"><Setter Property="Height" Value="80"/><Setter Property="Width" Value="200"/><Setter Property="Background" Value="Orange"/></Style><Style TargetType="Button" x:Key="sunStyle" BasedOn="{StaticResource preStyle}"><Setter Property="Foreground" Value="Red"/></Style>
</Window.Resources>
<StackPanel><Button Content="PreBtn" Style="{StaticResource preStyle}" /><Button Content="SunBtrn" Style="{StaticResource sunStyle}"/>
</StackPanel>
注意:可以多层次继承和C#中的类一样,但是不可以继承多个。
优先级,自己的大于继承的,自己没有找继承。总结:越接近对象,级别越高