WPF Style 基础样式-1

在 WPF 中，Style（样式） 是一种用于统一管理控件外观和行为的重要机制。通过样式，你可以将一组属性设置（如颜色、字体、边距等）封装起来，并应用到多个控件上，从而提高代码复用性和维护性。

1. 基本语法

样式通过 <Style> 标签定义，通常放置在 Resources 部分（如 Window.Resources、Application.Resources 或控件级资源）

<Window.Resources>
    <!-- 定义样式 -->
    <Style TargetType="Button" x:Key="MyButtonStyle">
        <Setter Property="Background" Value="LightBlue"/>
        <Setter Property="FontSize" Value="16"/>
        <Setter Property="Margin" Value="5"/>
    </Style>
</Window.Resources>

• TargetType: 指定样式应用的目标控件类型（如 Button、TextBox）。

• x:Key: 样式的唯一标识符（可选，若省略则为隐式样式）。

• Setter: 定义属性的具体值（如 Background、FontSize）。

2. 应用样式

显式应用样式

通过 StaticResource 引用样式的 x:Key：

<Button Style="{StaticResource MyButtonStyle}" Content="Click Me"/>

隐式样式

如果省略 x:Key，样式会自动应用到所有 TargetType 指定的控件：

<!-- 隐式样式 -->
<Style TargetType="Button">
    <Setter Property="Foreground" Value="Red"/>
</Style>

<!-- 所有 Button 自动应用此样式 -->
<Button Content="OK"/>
<Button Content="Cancel"/>

3. 样式继承

通过 BasedOn 属性继承现有样式：

<Style TargetType="Button" x:Key="BaseButtonStyle">
    <Setter Property="Background" Value="LightGray"/>
</Style>

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

4.应用举例

<Window x:Class="WpfApp2.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:WpfApp2"
        mc:Ignorable="d"
        Title="MainWindow" Height="76" Width="540">
    <Window.Resources>
        <!-- 定义样式 -->
        <!--TargetType: 指定样式应用的目标控件类型（如 Button、TextBox）-->
        <!--x:Key: 样式的唯一标识符（可选，若省略则为隐式样式）。-->
        <!--Setter: 定义属性的具体值（如 Background、FontSize）。-->
        <Style x:Key="BaseButtonStyle" TargetType="Button">
            <Setter Property="Height" Value="30"/>
            <Setter Property="Width" Value="120"/>
            <Setter Property="Margin" Value="4"/>
            <Setter Property="Foreground" Value="Black"/>
        </Style>
        <!--通过 BasedOn 属性继承现有样式-->
        <Style x:Key="InfoButtonStyle" TargetType="Button" BasedOn="{StaticResource BaseButtonStyle}">
            <Setter Property="Background" Value="AntiqueWhite"/>
        </Style>
        <Style x:Key="SuccessButtonStyle" TargetType="Button" BasedOn="{StaticResource BaseButtonStyle}">
            <Setter Property="Background" Value="Green"/>
        </Style>
        <Style x:Key="WarnButtinStyle" TargetType="Button" BasedOn="{StaticResource BaseButtonStyle}">
            <Setter Property="Background" Value="Yellow"/>
        </Style>
        <Style x:Key="ErrorButtinStyle" TargetType="Button" BasedOn="{StaticResource BaseButtonStyle}">
            <Setter Property="Background" Value="Red"/>
        </Style>
    </Window.Resources>
    <Grid>
        <WrapPanel Margin="10px">
            <!--通过 StaticResource 引用样式的 x:Key-->
            <!--如果省略 x:Key，样式会自动应用到所有 TargetType 指定的控件-->
            <Button Content="Info Button" Style="{StaticResource InfoButtonStyle}"/>
            <Button Content="Success Button" Style="{StaticResource SuccessButtonStyle}"/>
            <Button Content="Warn Button" Style="{StaticResource WarnButtinStyle}"/>
            <Button Content="Error Button" Style="{StaticResource ErrorButtinStyle}"/>
        </WrapPanel>
    </Grid>
</Window>