C# WPF入门学习主线篇（二十）—

C# WPF入门学习主线篇（二十）—— 资源和样式

news2024/9/20 9:43:54

C# WPF入门学习主线篇（二十）—— 资源和样式

在这里插入图片描述

欢迎来到C# WPF入门学习系列的第二十篇。在前面的章节中，我们探讨了布局管理及各种控件的使用。本篇博客将重点介绍WPF中的资源（Resource）和样式（Style），这两个概念对于构建可维护、可重用的用户界面至关重要。

什么是资源？

在WPF中，资源是可以在多个地方重复使用的对象或数据。资源可以是简单的颜色、字符串，也可以是复杂的控件样式或模板。WPF中的资源通常定义在XAML文件中，并可以在整个应用程序中共享和使用。

资源主要分为以下几类：

静态资源（StaticResource）：在XAML加载时解析，通常用于定义不会更改的值。
动态资源（DynamicResource）：在运行时解析，适用于需要在应用程序运行期间动态更改的值。

定义和使用静态资源

静态资源在加载XAML时解析，适用于大多数场景。以下是一个简单的例子，展示如何定义和使用静态资源：

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Resources and Styles" Height="300" Width="400">
    <Window.Resources>
        <!-- 定义一个静态资源 -->
        <SolidColorBrush x:Key="PrimaryBrush" Color="Blue"/>
    </Window.Resources>
    <Grid Background="{StaticResource PrimaryBrush}">
        <TextBlock Text="Hello, WPF!" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="24"/>
    </Grid>
</Window>

在上面的代码中，我们在 Window.Resources 中定义了一个名为 PrimaryBrush 的 SolidColorBrush 资源，并在 Grid 的 Background 属性中使用了该资源。

定义和使用动态资源

动态资源在运行时解析，适用于需要在应用程序运行期间动态更改的值。以下是一个简单的例子：

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Resources and Styles" Height="300" Width="400">
    <Window.Resources>
        <!-- 定义一个动态资源 -->
        <SolidColorBrush x:Key="PrimaryBrush" Color="Blue"/>
    </Window.Resources>
    <Grid Background="{DynamicResource PrimaryBrush}">
        <Button Content="Change Color" Click="ChangeColor_Click" HorizontalAlignment="Center" VerticalAlignment="Center"/>
    </Grid>
</Window>

using System.Windows;
using System.Windows.Media;

namespace WpfApp
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void ChangeColor_Click(object sender, RoutedEventArgs e)
        {
            // 动态更改资源的值
            this.Resources["PrimaryBrush"] = new SolidColorBrush(Colors.Red);
        }
    }
}

在这个例子中，我们定义了一个名为 PrimaryBrush 的动态资源，并在按钮点击事件中更改了其颜色。

什么是样式？

样式（Style）是用于定义控件外观和行为的集合。通过使用样式，可以将控件的视觉属性分离出来，达到代码重用和界面统一的目的。样式通常定义在XAML文件中，并可以在多个控件中共享使用。

定义和使用样式

以下是一个定义和使用样式的例子：

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Resources and Styles" Height="300" Width="400">
    <Window.Resources>
        <!-- 定义一个按钮的样式 -->
        <Style x:Key="PrimaryButtonStyle" TargetType="Button">
            <Setter Property="Background" Value="Blue"/>
            <Setter Property="Foreground" Value="White"/>
            <Setter Property="Padding" Value="10"/>
            <Setter Property="FontSize" Value="16"/>
        </Style>
    </Window.Resources>
    <Grid>
        <Button Content="Primary Button" Style="{StaticResource PrimaryButtonStyle}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
    </Grid>
</Window>

在上面的代码中，我们定义了一个名为 PrimaryButtonStyle 的样式，并应用于一个按钮控件。通过这种方式，可以轻松地在多个按钮中共享相同的样式定义。

基于现有样式创建新样式

WPF允许通过 BasedOn 属性基于现有样式创建新样式，从而实现样式的继承和扩展。例如：

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Resources and Styles" Height="300" Width="400">
    <Window.Resources>
        <!-- 定义基础按钮样式 -->
        <Style x:Key="BaseButtonStyle" TargetType="Button">
            <Setter Property="FontSize" Value="16"/>
            <Setter Property="Padding" Value="10"/>
        </Style>

        <!-- 定义继承基础样式的主按钮样式 -->
        <Style x:Key="PrimaryButtonStyle" TargetType="Button" BasedOn="{StaticResource BaseButtonStyle}">
            <Setter Property="Background" Value="Blue"/>
            <Setter Property="Foreground" Value="White"/>
        </Style>

        <!-- 定义继承基础样式的次按钮样式 -->
        <Style x:Key="SecondaryButtonStyle" TargetType="Button" BasedOn="{StaticResource BaseButtonStyle}">
            <Setter Property="Background" Value="Gray"/>
            <Setter Property="Foreground" Value="Black"/>
        </Style>
    </Window.Resources>
    <Grid>
        <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center" Spacing="10">
            <Button Content="Primary Button" Style="{StaticResource PrimaryButtonStyle}"/>
            <Button Content="Secondary Button" Style="{StaticResource SecondaryButtonStyle}"/>
        </StackPanel>
    </Grid>
</Window>