style 样式
- 如何定义一个 style 样式
<Button Content="样式" Width="100" Height="50">
<Button.Style>
<Style>
</Style>
</Button.Style>
</Button>
- 拥有的属性
- targetType = “” 针对什么类型生效
- setter 设置属性的值 property = “属性名称” value = “值”
- triggers 触发器,当命中后触发什么条件.
- multitriggers 多重条件触发器
- eventTriggers 事件触发器,内部都是动画。
<Button > <Button.Style> <Style TargetType="Button"> <Style.Setters> <Setter Property="Width" Value="100"></Setter> <Setter Property="Height" Value="100"></Setter> <Setter Property="Content" Value="不好"></Setter> <Setter Property="Background" Value="#FFA500"></Setter> </Style.Setters> <Style.Triggers> <!--当鼠标移动上时触发以下条件--> <Trigger Property="IsMouseOver" Value="True"> <Setter Property="Content" Value="你好"></Setter> </Trigger> <MultiTrigger> <MultiTrigger.Conditions> <!--当鼠标移动上时并且发生点击的时候触发以下条件--> <Condition Property="IsMouseOver" Value="True"></Condition> <Condition Property="IsPressed" Value="True"></Condition> </MultiTrigger.Conditions> <MultiTrigger.Setters> <Setter Property="Foreground" Value="Red"/> </MultiTrigger.Setters> </MultiTrigger> <!--事件触发器,点击鼠标右键--> <EventTrigger RoutedEvent="MouseRightButtonDown"> <BeginStoryboard> <Storyboard> <!--在1秒钟的事件里,对属性值进行变更,这里是将宽高变成250--> <DoubleAnimation Duration="0:0:1" To="250" Storyboard.TargetProperty="Width"></DoubleAnimation> <DoubleAnimation Duration="0:0:1" To="250" Storyboard.TargetProperty="Height"></DoubleAnimation> </Storyboard> </BeginStoryboard> </EventTrigger> </Style.Triggers> </Style> </Button.Style> </Button>
- Style 的复用
如何定义一个资源的使用。<Window x:Class="zhiyu.training.StyleWindow" 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:zhiyu.training" mc:Ignorable="d" Title="StyleWindow" Height="450" Width="800" xmlns:sys ="clr-namespace:System;assembly=mscorlib"> <Window.Resources> <!--如何定义一个int类型的变量--> <sys:Double x:Key="value">123</sys:Double> </Window.Resources> <Grid> <Button Width="{StaticResource value}" Height="30" Margin="10" HorizontalAlignment="Left"> <Button.Style> <Style TargetType="Button"> <!--在 style 中定义资源--> <Style.Resources> <SolidColorBrush Color="Green" x:Key="Brush"></SolidColorBrush> </Style.Resources> <!-- 引用资源 --> <Setter Property="Background" Value="{StaticResource Brush}"></Setter> </Style> </Button.Style> </Button> </Grid>
如何复用一个 style
<Window x:Class="zhiyu.training.StyleWindow"
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:zhiyu.training"
mc:Ignorable="d"
Title="StyleWindow" Height="450" Width="800"
xmlns:sys ="clr-namespace:System;assembly=mscorlib">
<Window.Resources>
<!--如何定义一个int类型的变量-->
<sys:Double x:Key="value">123</sys:Double>
<Style TargetType="Button">
<Style.Resources>
<SolidColorBrush Color="Green" x:Key="Brush"></SolidColorBrush>
</Style.Resources>
<Setter Property="Background" Value="{StaticResource Brush}"></Setter>
</Style>
<Style TargetType="Button" x:Key="ab">
<Style.Resources>
<SolidColorBrush Color="Yellow" x:Key="Brush"></SolidColorBrush>
</Style.Resources>
<Setter Property="Background" Value="{StaticResource Brush}"></Setter>
</Style>
</Window.Resources>
<Grid>
<!--全局风格-->
<Button Width="{StaticResource value}" Height="30" Margin="10" HorizontalAlignment="Left"></Button>
<!--使用ab风格-->
<Canvas>
<Button Style="{StaticResource ab}" Height="30" Width="200" Canvas.Top="50"></Button>
</Canvas>
<!--什么风格都不用-->
<Canvas>
<Button Style="{x:Null}" Height="30" Width="200" Canvas.Top="100"></Button>
</Canvas>
</Button>
</Grid>
</Window>
如何继承一个 Style BaseOn
<Window.Resources>
<Style TargetType="Button" x:Key="baseOn">
<Setter Property="Content" Value="你好"></Setter>
</Style>
<!-- 使用 BaseOn 继承-->
<Style TargetType="Button" x:Key="ab" BasedOn="{StaticResource baseOn}">
<Style.Resources>
<SolidColorBrush Color="Yellow" x:Key="Brush"></SolidColorBrush>
</Style.Resources>
<Setter Property="Background" Value="{StaticResource Brush}"></Setter>
</Style>
</Window.Resources>
<Grid>
<Canvas>
<Button Style="{StaticResource ab}" Height="30" Width="200" Canvas.Top="50"></Button>
</Canvas>
</Grid>