第二部分：核心技术

第5章：样式与模板

5.1 样式的基础应用

1. 样式的基本概念

  • 定义：样式（Style）是WPF中用于统一控件外观和行为的一组属性集合，通过Style类实现。
  • 作用：减少重复代码，实现UI一致性，支持动态换肤。
  • 核心属性：
    • TargetType：指定应用样式的控件类型（如Button、TextBox）。
    • Setters：包含属性赋值（如Background、FontSize）。
    • Resources：样式通常定义在资源字典中，支持全局或局部作用域。

2. 样式的定义与使用

<!-- 在Window或Application资源中定义样式 -->
<Window.Resources>
    <Style x:Key="MyButtonStyle" TargetType="Button">
        <Setter Property="Background" Value="LightBlue"/>
        <Setter Property="FontSize" Value="14"/>
        <Setter Property="Padding" Value="10,5"/>
    </Style>
</Window.Resources>

<!-- 应用样式到按钮 -->
<Button Style="{StaticResource MyButtonStyle}" Content="Styled Button"/>

3. 隐式样式与显式样式

  • 显式样式：通过x:Key命名，需手动引用（如Style="{StaticResource MyButtonStyle}"）。
  • 隐式样式：省略x:Key，自动应用于所有TargetType匹配的控件：
<Style TargetType="Button"> <!-- 隐式样式 -->
    <Setter Property="Foreground" Value="Red"/>
</Style>

4. 样式的继承

  • 基于样式继承：通过BasedOn属性复用现有样式：
<Style x:Key="BaseButtonStyle" TargetType="Button">
    <Setter Property="FontWeight" Value="Bold"/>
</Style>

<Style x:Key="DerivedButtonStyle" TargetType="Button" 
       BasedOn="{StaticResource BaseButtonStyle}">
    <Setter Property="Foreground" Value="Green"/>
</Style>

5. 动态样式切换

  • 触发器（Trigger）：根据条件动态修改样式：
<Style TargetType="Button">
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="Background" Value="Gold"/>
        </Trigger>
    </Style.Triggers>
</Style>

6. 最佳实践

  • 资源字典分离：将样式定义在独立的ResourceDictionary文件中，便于维护。
  • 命名规范：使用[控件类型]Style命名（如ButtonStyle）。
  • 性能优化：避免在样式中设置频繁变化的属性（如动画）。

示例：完整样式定义

<ResourceDictionary>
    <!-- 基础按钮样式 -->
    <Style x:Key="BaseButtonStyle" TargetType="Button">
        <Setter Property="Margin" Value="5"/>
        <Setter Property="Padding" Value="8,4"/>
    </Style>

    <!-- 主按钮样式（继承基础样式） -->
    <Style x:Key="PrimaryButtonStyle" TargetType="Button"
           BasedOn="{StaticResource BaseButtonStyle}">
        <Setter Property="Background" Value="#FF0078D7"/>
        <Setter Property="Foreground" Value="White"/>
        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Background" Value="#005499"/>
            </Trigger>
        </Style.Triggers>
    </Style>
</ResourceDictionary>

注意：样式仅影响外观，若需改变控件结构（如重组视觉树），需使用ControlTemplate（见5.2节）。

Last Updated::