C# WPF入门学习主线篇（二十二）—— 样式（Styles）的定义和应用

news2025/7/9 14:12:49

C# WPF入门学习主线篇（二十二）—— 样式（Styles）的定义和应用

在这里插入图片描述

欢迎来到C# WPF入门学习系列的第二十二篇。本篇文章将详细介绍WPF中的样式（Styles）的定义和应用。样式在WPF中起到重要作用，通过样式可以轻松地定义和复用控件的外观和行为，从而提高开发效率和代码的可维护性。

什么是样式？

样式（Style）是用于定义控件外观和行为的集合。样式通常定义在XAML文件中，可以在多个控件中共享使用。样式可以包括各种属性的设置，如颜色、字体、边距等，以及触发器（Trigger），用于响应特定的事件或状态。

样式的定义

在WPF中，样式通常定义在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="Styles Demo" 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>

在这里插入图片描述

在上面的代码中，我们在 Window.Resources 中定义了一个名为 PrimaryButtonStyle 的样式，并应用于一个按钮控件。

Setter的使用

Setter 用于设置控件的属性。每个 Setter 包含两个属性：

  • Property：要设置的属性。
  • Value：属性的值。

应用样式

要应用样式，可以使用 StaticResource 标记扩展引用样式：

<Button Content="Primary Button" Style="{StaticResource PrimaryButtonStyle}" HorizontalAlignment="Center" VerticalAlignment="Center"/>

默认样式

如果希望将样式应用于同一类型的所有控件，可以省略 x:Key，使样式成为默认样式：

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Styles Demo" Height="300" Width="400">
    <Window.Resources>
        <!-- 定义一个按钮的默认样式 -->
        <Style 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="Default Style Button" HorizontalAlignment="Center" VerticalAlignment="Center"/>
    </Grid>
</Window>

在这个示例中，所有按钮控件将自动应用此样式。

基于现有样式创建新样式

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="Styles Demo" 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>

在这里插入图片描述

在这个例子中，我们定义了一个基础按钮样式 BaseButtonStyle，并基于它创建了两个新样式 PrimaryButtonStyle 和 SecondaryButtonStyle，实现了样式的继承和扩展。

使用触发器（Triggers）

触发器（Trigger）是样式的重要组成部分，用于响应控件状态的变化。常见的触发器有 PropertyTrigger 和 EventTrigger。

属性触发器（PropertyTrigger）

属性触发器用于在控件属性值发生变化时，执行某些操作。以下是一个简单的属性触发器示例：

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Styles Demo" Height="300" Width="400">
    <Window.Resources>
        <!-- 定义带触发器的按钮样式 -->
        <Style x:Key="HoverButtonStyle" TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1" CornerRadius="5">
                            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Background" Value="Red"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <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="Hover Me" Style="{StaticResource HoverButtonStyle}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
    </Grid>
</Window>

在这里插入图片描述

在这个例子中，当按钮被鼠标悬停时，触发器会改变按钮的背景颜色。

事件触发器（EventTrigger）

事件触发器用于响应控件的事件。以下是一个简单的事件触发器示例：

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Styles Demo" Height="300" Width="400">
    <Window.Resources>
        <!-- 定义带事件触发器的按钮样式 -->
        <Style x:Key="ClickButtonStyle" TargetType="Button">
            <Setter Property="Background" Value="Blue"/>
            <Setter Property="Foreground" Value="White"/>
            <Setter Property="Padding" Value="10"/>
            <Setter Property="FontSize" Value="16"/>
            <Style.Triggers>
                <EventTrigger RoutedEvent="Button.Click">
                    <BeginStoryboard>
                        <Storyboard>
                            <ColorAnimation Storyboard.TargetProperty="(Button.Background).(SolidColorBrush.Color)"
                                            To="Green" Duration="0:0:0.5" />
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <Grid>
        <Button Content="Click Me" Style="{StaticResource ClickButtonStyle}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
    </Grid>
</Window>

在这里插入图片描述

在这个示例中，当按钮被点击时，事件触发器会启动一个 Storyboard，通过 ColorAnimation 将按钮的背景颜色在0.5秒内渐变为绿色。

多个触发器

WPF样式还支持多个触发器的组合使用。以下是一个同时使用属性触发器和事件触发器的示例：

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Styles Demo" Height="300" Width="400">
    <Window.Resources>
        <!-- 定义带多个触发器的按钮样式 -->
        <Style x:Key="AdvancedButtonStyle" TargetType="Button">
            <Setter Property="Background" Value="Blue"/>
            <Setter Property="Foreground" Value="White"/>
            <Setter Property="Padding" Value="10"/>
            <Setter Property="FontSize" Value="16"/>
            <Style.Triggers>
                <!-- 属性触发器：鼠标悬停时改变背景颜色 -->
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="Red"/>
                </Trigger>
                <!-- 事件触发器：点击时启动颜色动画 -->
                <EventTrigger RoutedEvent="Button.Click">
                    <BeginStoryboard>
                        <Storyboard>
                            <ColorAnimation Storyboard.TargetProperty="(Button.Background).(SolidColorBrush.Color)"
                                            To="Green" Duration="0:0:0.5" />
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <Grid>
        <Button Content="Advanced Button" Style="{StaticResource AdvancedButtonStyle}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
    </Grid>
</Window>

在这里插入图片描述

在这个例子中，当按钮被鼠标悬停时，背景颜色会变成红色；当按钮被点击时，背景颜色会在0.5秒内渐变为绿色。

总结

通过本文的学习，我们详细介绍了WPF中的样式（Styles）的定义和应用，包括静态样式、基于现有样式创建新样式、属性触发器和事件触发器的使用。样式是WPF中一个强大而灵活的特性，可以帮助我们高效地管理和复用控件的外观和行为，提高开发效率和代码的可维护性。

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/1841872.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

Hallo技术：革新电影、游戏与虚拟现实中的动态肖像动画

Hallo技术：革新电影、游戏与虚拟现实中的动态肖像动画

在数字娱乐的浪潮中&#xff0c;逼真的动态肖像动画成为了电影制作、游戏开发和虚拟现实等领域不可或缺的一部分。复旦大学研发的Hallo技术&#xff0c;以其独特的扩散模型和分层音频驱动视觉合成模块&#xff0c;为这一领域带来了革命性的突破。 技术概览 Hallo技术是一种基…
阅读更多...
Nvidia芯片Jetson系列 系统烧录环境 搭建

Nvidia芯片Jetson系列 系统烧录环境 搭建

一、序言 Jetson 系列产品烧录系统的方法一般有两种&#xff1a; 一种为使用 NVIDIA 官方提供 的 SDK manager 软件给 Jetson 设备烧录系统&#xff08;请查看说明文档《Jetson 产品使用 SDKmanager 烧录系统》&#xff09;。 另一种即为当前文档所描述的&#xff0c;在安装 Ub…
阅读更多...
LVS+Keepalived高可用集群部署

LVS+Keepalived高可用集群部署

一、高可用群集(HA)的作用 企业应用中&#xff0c;单台服务器承担应用存在单点故障的危险&#xff0c;单点故障一旦发生&#xff0c;企业服务将发生中断&#xff0c;造成极大的危害。 高可用集群是由一台主调度器和一台或多台备用调度器。在主调度器能够正常运转时&#xff0c;…
阅读更多...
JVM 相关知识整理

JVM 相关知识整理

文章目录 前言JVM 相关知识整理1. 新生代和老年代2. 对象的分配过程3. Full GC /Major GC 触发条件4. 逃逸分析4.1.示例4.2. 使用逃逸分析&#xff0c;编译器可以对代码做如下优化 5. 对象的内存分配6. Minor GC 与 Major GC/Full GC的比较:7. 什么对象进入老年代7.1. 大对象直…
阅读更多...
【Tello无人机】使用Matlab完成控制器的设计—建模

【Tello无人机】使用Matlab完成控制器的设计—建模

模型辨识篇 在实际的无人机系统中&#xff0c;控制器的设计至关重要&#xff0c;它直接影响无人机的稳定性和响应能力。然而&#xff0c;要设计出高效、可靠的控制器&#xff0c;首先必须准确理解无人机的动态行为&#xff0c;这就需要通过收集输入输出数据来辨识其运动学模型。…
阅读更多...
LabVIEW与Matlab联合编程的途径及比较

LabVIEW与Matlab联合编程的途径及比较

​ LabVIEW和Matlab联合编程可以通过多种途径实现&#xff0c;包括调用Matlab脚本节点、使用LabVIEW MathScript RT模块、利用ActiveX和COM接口&#xff0c;以及通过文件读写实现数据交换。每种方法都有其独特的优势和适用场景。本文将详细比较这些方法&#xff0c;帮助开发者…
阅读更多...
【Kubernetes】集群学习

【Kubernetes】集群学习

常见的 Kubernetes 集群类型 Kubernetes 集群可以根据不同的标准进行分类&#xff0c;但通常我们根据其部署环境和用途来区分集群类型。以下是几种常见的 Kubernetes 集群类型&#xff1a; 开发集群&#xff08;Development Cluster&#xff09;&#xff1a; 用于开发和测试环…
阅读更多...
RAG优化技巧|7大挑战与解決方式|提高你的LLM能力

RAG优化技巧|7大挑战与解決方式|提高你的LLM能力

在当今快速发展的人工智能领域&#xff0c;大型语言模型&#xff08;LLM&#xff09;已经成为无处不在的技术&#xff0c;它们不仅改变了我们与机器交流的方式&#xff0c;还在各行各业中发挥着革命性的影响。 然而&#xff0c;尽管LLM RAG的能力已经让人惊叹&#xff0c;但我…
阅读更多...
分享一下，如何搭建个人网站的步骤

分享一下，如何搭建个人网站的步骤

在这段充满探索与创造的奇妙旅途中&#xff0c;我就像一位耐心的建筑师&#xff0c;在数字世界的荒原上精心雕琢&#xff0c;两周的时光缓缓流淌。每天&#xff0c;我与代码共舞&#xff0c;手执HTML、CSS与JavaScript这三大构建魔杖&#xff0c;一砖一瓦地筑起了梦想中的网络城…
阅读更多...
string类(C++)

string类(C++)

文章目录 一.引言二.string类&#xff1a;成员函数&#xff1a;构造函数&#xff1a;析构函数 遍历&#xff1a;operator[]迭代器&#xff08;iterator&#xff09;范围for反向遍历(反向迭代器reverse_iterator)const迭代器 容器&#xff1a;capacity扩容clear清数据shrink_to_…
阅读更多...
Azure数据分析Power BI

Azure数据分析Power BI

Azure数据分析Power BI 一、Power BI简介二、Power BI 如何匹配角色三、Power BI 构建基块四、使用 Power BI 服务一、Power BI简介 Microsoft Power BI 是一系列的软件服务、应用和连接器，这些软件服务、应用和连接器协同工作，将不相关的数据源转化为合乎逻辑、视觉上逼真的…
阅读更多...
Web渗透：XSS-反射型存储型

Web渗透：XSS-反射型存储型

跨站脚本攻击&#xff08;Cross-Site Scripting&#xff0c;XSS&#xff09;是一种常见的网络安全漏洞&#xff0c;它允许攻击者将恶意脚本注入到网页中&#xff0c;其他用户在浏览这些页面时&#xff0c;可能会执行这些恶意脚本&#xff0c;从而导致各种安全问题&#xff0c;如…
阅读更多...
关于STM32上用HID HOST调鼠标数据的解析

关于STM32上用HID HOST调鼠标数据的解析

一、前言 关于这章主要是基于我前面的那篇文章 链接: 关于怎么用Cubemx生成的USBHID设备实现读取一体的鼠标键盘设备&#xff08;改进版&#xff09; https://blog.csdn.net/qq_29187987/article/details/139535648?spm1001.2014.3001.5501 引用的文章的简介 引用的这篇文…
阅读更多...
【文末附gpt升级秘笈】AI音乐大模型崛起：版权归属与创意产业的新挑战

【文末附gpt升级秘笈】AI音乐大模型崛起：版权归属与创意产业的新挑战

AI音乐大模型崛起&#xff1a;版权归属与创意产业的新挑战 随着科技的飞速发展&#xff0c;人工智能&#xff08;AI&#xff09;已经深入到社会生活的各个领域&#xff0c;音乐领域也不例外。最近一个月&#xff0c;轮番上线的音乐大模型不仅为普通人打开了音乐创作的大门&…
阅读更多...
am62x芯片安全类型确认（HS-SE, HS-FS or GP)

am62x芯片安全类型确认（HS-SE, HS-FS or GP)

文章目录 芯片安全类型设置启动方式获取串口信息下载脚本运行脚本示例sk-am62x板卡参考芯片安全类型 AM62x 芯片有三个安全级别。 • GP：通用版本 • HS-FS：高安全性 - 现场安全型 • HS-SE：高安全性 - 强制安全型 在SD卡启动文件中，可以查看到， 但板上的芯片，到底是那…
阅读更多...
手把手教你挖赏金系列(2)如何挖掘短信验证码漏洞

手把手教你挖赏金系列(2)如何挖掘短信验证码漏洞

免责声明 由于传播、利用本公众号所发布的而造成的任何直接或者间接的后果及损失&#xff0c;均由使用者本人承担。LK安全公众号及原文章作者不为此承担任何责任&#xff0c;一旦造成后果请自行承担&#xff01;如有侵权烦请告知&#xff0c;我们会立即删除并致歉。谢谢&#…
阅读更多...
计算机网络 —— 应用层（DHCP）

计算机网络 —— 应用层（DHCP）

计算机网络 —— 应用层&#xff08;DHCP&#xff09; 什么是DHCPDHCP工作过程DHCP DISCOVERDHCP OFFERDHCP RQUESTDHCP ACK DHCP租约机制中继代理工作原理功能与优势 我们今天来计网的DHCP&#xff1a; 什么是DHCP DHCP&#xff08;Dynamic Host Configuration Protocol&…
阅读更多...
人工智能这么厉害，比如GPT-4，为什么没有看到程序员大量失业？

人工智能这么厉害，比如GPT-4，为什么没有看到程序员大量失业？

从ChatGPT第一版发布到现在&#xff0c;还不到一年的时间中&#xff0c;可是它使用的GPT架构已经从3.5版本进化到现在的4.0版本&#xff0c;随之而来的是其能力的极大提升。下面是GPT-4在其官网的介绍中的一句话&#xff1a; GPT-4是OpenAI最先进的系统&#xff0c;可以产生更安…
阅读更多...
FlowUs：打造沉浸式协作体验感受

FlowUs：打造沉浸式协作体验感受

直观的用户体验 从我个人的角度来看&#xff0c;FlowUs的界面设计非常符合现代审美&#xff0c;简洁而不失功能性。每次打开FlowUs&#xff0c;我都能迅速找到我需要的功能&#xff0c;这大大提升了我的工作效率。 实时协作的流畅性 在FlowUs中&#xff0c;我最喜欢的功能之一就…
阅读更多...
记录：[android] SSLHandshakeException: Handshake failed 问题；已解决！

记录：[android] SSLHandshakeException: Handshake failed 问题；已解决！

1、问题描述&#xff1a;在使用Retrofit2 时在安卓老设备上&#xff08;安卓6.0&#xff09;网络无法请求、安卓 10 、 11 未出现此问题&#xff1f;what? 原因&#xff1a;服务端 TLS 版本过高 2、废话不多说、解决方案A 、添加依赖&#xff1a;implementation org.conscrypt…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023