【WPF学习】02 样式基础
基于Window.Resource下的Style标签进行通用样式设置
下面是一个WPF窗口中一段表示三个完全相同的Button控件元素的代码实例:
<Grid>
<StackPanel>
<Button Content="Button1" FontSize="18" Foreground="Black" Background="Aqua"/>
<Button Content="Button1" FontSize="18" Foreground="Black" Background="Aqua"/>
<Button Content="Button1" FontSize="18" Foreground="Black" Background="Aqua"/>
</StackPanel>
</Grid>
其中参数分别控制:
Content 内容文本
FontSize 字号
Foreground 字体颜色
按照上面的方式,在需要保持这一组Buttton控件格式一致的前提下,如何才能避免当前把每一个成员都修改一遍的繁琐操作呢?——使用Window.Resources下的Style设置标准样式进行样式修改
首先通过Style的TargetType设置该Style控制的控件对象(不设置具体空间控制对象则默认Style为全局样式),
再通过Setter的Property设置具体属性
<Window.Resources>
<Style TargetType="Button">
<Setter Property="Content" Value="Button"/>
<Setter Property="Background" Value="Aqua"/>
<Setter Property="FontSize" Value="18"/>
<Setter Property="Foreground" Value="Black"/>
</Style>
</Window.Resources>
这样一来,修改前面格式完全一致的Button组直接在Style这里修改对应属性即可
但这样存在一个问题,上面的只能满足窗口内所有Button都完全一致的情境,但实际应用中Button在通用样式下肯定会有一些细节差异,如果只按照上面的方法仍然无法解决最初的问题在实际应用中的存在
可以通过Style的x:Key参数为Style设置独立标签,目标控件如需调用该样式则在控件中添加该Style的标签
<Window.Resources>
<Style x:Key="ButtonStyle1" TargetType="Button">
<Setter Property="Content" Value="Button"/>
<Setter Property="Background" Value="Aqua"/>
<Setter Property="FontSize" Value="18"/>
<Setter Property="Foreground" Value="Black"/>
</Style>
</Window.Resources>
<Grid>
<StackPanel>
<Button Style="{StaticResource ButtonStyle1}"/>
<Button Style="{StaticResource ButtonStyle1}"/>
<Button Style="{StaticResource ButtonStyle1}"/>
</StackPanel>
</Grid>
那么如果我们首先设置了一个最通用的样式NormalStyle1,然后我们希望能在保留它的同时再设置一个细化一点通用样式的NewStyle1,
通过Style标签的BaseOn属性可以实现Style间的继承
<Window.Resources>
<Style x:Key="ButtonNormalStyle1" TargetType="Button">
<Setter Property="Background" Value="Aqua"/>
<Setter Property="FontSize" Value="18"/>
<Setter Property="Foreground" Value="Black"/>
</Style>
<Style x:Key="ButtonNewStyle1" TargetType="Button" BasedOn="{StaticResource ButtonNormalStyle1}">
<Setter Property="Content" Value="Button"/>
</Style>
</Window.Resources>
通过上述方法,在实际使用时,在每个Button控件标签里需要我们独立设置的往往就只有一个Content属性(Button的文本内容)和一个Style即可(当然如果有什么其他和通用Style不同的再另做设置即可)
<Grid>
<StackPanel>
<Button Content="Button1" Style="{StaticResource ButtonNewStyle1}"/>
<Button Content="Button2" Style="{StaticResource ButtonNewStyle1}"/>
<Button Content="Button3" Style="{StaticResource ButtonNewStyle1}"/>
</StackPanel>
</Grid>