【WPF.NET开发】创建样式

news2025/2/8 23:29:54

本文内容

  1. 创建样式
  2. 隐式应用样式
  3. 显式应用样式
  4. 以编程方式应用样式
  5. 扩展样式
  6. TargetType 属性与 x:Key 属性之间的关系

使用 Windows Presentation Foundation (WPF),可以使用自己的可重用样式自定义现有控件的外观。 可以对应用、窗口和页面全局应用样式,也可以将样式直接应用于控件。

1、创建样式

可以将 Style 视为一种将一组属性值应用到一个或多个元素的便利方法。 可以对从 FrameworkElement 或 FrameworkContentElement(如 Window 或 Button)派生的任何元素使用样式。

声明样式的最常见方法是在 XAML 文件的 Resources 部分中声明为资源。 由于样式是一种资源,因此它们同样遵从适用于所有资源的范围规则。 简而言之,声明样式的位置会影响样式的应用范围。 例如,如果在应用定义 XAML 文件的根元素中声明样式,则该样式可以在应用中的任何位置使用。

<Application x:Class="IntroToStylingAndTemplating.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:local="clr-namespace:IntroToStylingAndTemplating"
             StartupUri="WindowExplicitStyle.xaml">
    <Application.Resources>
        <ResourceDictionary>
            
            <Style x:Key="Header1" TargetType="TextBlock">
                <Setter Property="FontSize" Value="15" />
                <Setter Property="FontWeight" Value="ExtraBold" />
            </Style>
            
        </ResourceDictionary>
    </Application.Resources>
</Application>

如果在应用的一个 XAML 文件中声明样式,则该样式只能在该 XAML 文件中使用。 

<Window x:Class="IntroToStylingAndTemplating.WindowSingleResource"
        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:IntroToStylingAndTemplating"
        mc:Ignorable="d"
        Title="WindowSingleResource" Height="450" Width="800">
    <Window.Resources>
        
        <Style x:Key="Header1" TargetType="TextBlock">
            <Setter Property="FontSize" Value="15" />
            <Setter Property="FontWeight" Value="ExtraBold" />
        </Style>
        
    </Window.Resources>
    <Grid />
</Window>

样式由 <Setter> 子元素组成,这些元素在应用了样式的元素上设置属性。 在上面的示例中,请注意,样式已设置为通过 TargetType 属性应用于 TextBlock 类型。 样式会将 FontSize 设置为 15,并将 FontWeight 设置为 ExtraBold。 为样式更改的每个属性添加一个 <Setter>

2、隐式应用样式

Style 是一种将一组属性值应用到多个元素的便利方法。 例如,请考虑以下 TextBlock 元素及其在窗口中的默认外观。

<StackPanel>
    <TextBlock>My Pictures</TextBlock>
    <TextBlock>Check out my new pictures!</TextBlock>
</StackPanel>

stylingintro-textblocksbefore.png?view=netdesktop-8.0

可以通过直接对每个 TextBlock 元素设置属性(如 FontSize 和 FontFamily)来更改默认外观。 但是,如果需要让 TextBlock 元素共享某些属性,可以在 XAML 文件的 Resources 部分中创建 Style,如下所示。

<Window.Resources>
    <!--A Style that affects all TextBlocks-->
    <Style TargetType="TextBlock">
        <Setter Property="HorizontalAlignment" Value="Center" />
        <Setter Property="FontFamily" Value="Comic Sans MS"/>
        <Setter Property="FontSize" Value="14"/>
    </Style>
</Window.Resources>

将样式的 TargetType 设置为 TextBlock 类型并省略 x:Key 属性时,该样式将应用到样式的所有 TextBlock 元素,通常是 XAML 文件本身。

现在 TextBlock 元素如下所示。

stylingintro-textblocksbasestyle.png?view=netdesktop-8.0

3、显式应用样式

如果向样式添加具有值的 x:Key 属性,则样式将不再隐式应用于 TargetType 的所有元素。 只有显式引用样式的元素才会应用样式。

下面是上一节中的样式,但使用 x:Key 属性进行了声明。

<Window.Resources>
    <Style x:Key="TitleText" TargetType="TextBlock">
        <Setter Property="HorizontalAlignment" Value="Center" />
        <Setter Property="FontFamily" Value="Comic Sans MS"/>
        <Setter Property="FontSize" Value="14"/>
    </Style>
</Window.Resources>

若要应用样式,请使用 StaticResource 标记扩展将元素上的 Style 属性设置为 x:Key 值,如下所示。

<StackPanel>
    <TextBlock Style="{StaticResource TitleText}">My Pictures</TextBlock>
    <TextBlock>Check out my new pictures!</TextBlock>
</StackPanel>

请注意,第一个 TextBlock 元素已应用样式,而第二个 TextBlock 元素保持不变。 上一节中的隐式样式已更改为声明了 x:Key 属性的样式,也就是说,该样式影响的唯一元素是直接引用该样式的那个元素。

create-a-style-explicit-textblock.png?view=netdesktop-8.0

在显式或隐式应用样式后,它将变为密封状态,不能更改。 如果要更改已应用的样式,请创建新的样式来替换现有样式。 可以创建一个根据自定义逻辑选择要应用的样式的对象。 

4、以编程方式应用样式

若要以编程方式将已命名的样式分配到元素,请从资源集合中获取样式,并将其分配到元素的 Style 属性。 资源集合中的项属于 Object 类型。 因此,在将检索到的样式分配给 Style 属性之前,必须将它强制转换为 System.Windows.Style。 例如,下面的代码将名为 textblock1 的 TextBlock 的样式设置为定义的样式 TitleText

textblock1.Style = (Style)Resources["TitleText"];

5、扩展样式

也许你希望两个 TextBlock 元素共享某些属性值,如 FontFamily 和居中的 HorizontalAlignment。 你可能还希望文本“My Pictures” 具有一些其他属性。 可以通过创建基于第一个样式的新样式来实现此目的,如下所示。

<Window.Resources>
    <!-- .... other resources .... -->

    <!--A Style that affects all TextBlocks-->
    <Style TargetType="TextBlock">
        <Setter Property="HorizontalAlignment" Value="Center" />
        <Setter Property="FontFamily" Value="Comic Sans MS"/>
        <Setter Property="FontSize" Value="14"/>
    </Style>
    
    <!--A Style that extends the previous TextBlock Style with an x:Key of TitleText-->
    <Style BasedOn="{StaticResource {x:Type TextBlock}}"
           TargetType="TextBlock"
           x:Key="TitleText">
        <Setter Property="FontSize" Value="26"/>
        <Setter Property="Foreground">
            <Setter.Value>
                <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
                    <LinearGradientBrush.GradientStops>
                        <GradientStop Offset="0.0" Color="#90DDDD" />
                        <GradientStop Offset="1.0" Color="#5BFFFF" />
                    </LinearGradientBrush.GradientStops>
                </LinearGradientBrush>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>
<StackPanel>
    <TextBlock Style="{StaticResource TitleText}" Name="textblock1">My Pictures</TextBlock>
    <TextBlock>Check out my new pictures!</TextBlock>
</StackPanel>

此 TextBlock 样式现在居中,使用大小为 26 的 Comic Sans MS 字体,并将前景色设置为如示例中显示的 LinearGradientBrush。 请注意,它会重写基本样式的 FontSize 值。 如果有多个 Setter 指向 Style 中的同一属性,则最后声明的 Setter 优先。

TextBlock 元素现在如下所示:

stylingintro-textblocks.png?view=netdesktop-8.0

此 TitleText 样式扩展为 TextBlock 类型创建的样式,该样式由 BasedOn="{StaticResource {x:Type TextBlock}}" 引用。 还可以使用样式的 x:Key 扩展具有 x:Key 的样式。 例如,如果有一个名为 Header1 的样式,并且你需要扩展该样式,可以使用 BasedOn="{StaticResource Header1}"

6、TargetType 属性与 x:Key 属性之间的关系

如前所述,将 TargetType 属性设置为 TextBlock 时,如果不为样式分配 x:Key,会导致将样式应用于所有 TextBlock 元素。 在此情况下,x:Key 隐式设置为 {x:Type TextBlock}。 这意味着,如果将 x:Key 值显式设置为除 {x:Type TextBlock} 以外的任何值,则 Style 不会自动应用于所有 TextBlock 元素。 相反,必须将该样式(通过使用 x:Key 值)显式应用到 TextBlock 元素。 如果你的样式位于资源部分中,并且你未对样式设置 TargetType 属性,则必须设置 x:Key 属性。

除了为 x:Key 提供默认值以外,TargetType 属性还指定 setter 属性应用到的类型。 如果不指定 TargetType,则必须使用语法 Property="ClassName.Property",通过类名称限定 Setter 对象中的属性。 例如,必须将 Property 设置为 "TextBlock.FontSize" 或 "Control.FontSize",而不是设置 Property="FontSize"

另请注意,许多 WPF 控件由其他 WPF 控件的组合构成。 如果创建应用于某个类型的所有控件的样式,可能会产生意外结果。 例如,如果创建一个样式,该样式以 Window中的 TextBlock 类型为目标,那么,即使 TextBlock 是另一个控件(如 ListBox)的一部分,该样式也将应用于窗口中的所有 TextBlock 控件。

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

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

相关文章

【自定义磨砂动态背景】前端及pyqt6实现

如何实现一个自定义的磨砂动态背景呢&#xff1f; 这种效果看起来特别的高端&#xff0c;很新颖美观。 具体的效果可以看这里的演示&#xff1a;https://www.bilibili.com/video/BV1zj411H7wd/ 其实原理就是底层有多个多彩多边形在移动&#xff0c;然后再盖上一层模糊滤镜。 前…

【DevOps 工具链】搭建 项目管理软件 禅道

文章目录 1、简介2、环境要求3、搭建部署环境3.1. 安装Apache服务3.2. 安装PHP环境&#xff08;以php7.0为例 &#xff09;3.3. 安装MySQL服务 4、搭建禅道4.1、下载解压4.2、 配置4.2.1、 启动4.2.2、自启动4.2.3、确认是否开机启动 5、成功安装 1、简介 禅道是国产开源项目管…

React Router有几种模式?实现原理?

面试官&#xff1a;说说React Router有几种模式&#xff1f;实现原理&#xff1f; 一、是什么 在单页应用中&#xff0c;一个web项目只有一个html页面&#xff0c;一旦页面加载完成之后&#xff0c;就不用因为用户的操作而进行页面的重新加载或者跳转&#xff0c;其特性如下&a…

C++设计模式 #7 工厂方法(Factory Method)

“对象创建”模式 通过“对象创建”模式绕开new&#xff0c;来避免对象创建&#xff08;new&#xff09;过程中所导致的紧耦合&#xff08;依赖具体类&#xff09;&#xff0c;从而支持创建的稳定。它是接口抽象之后的第一步工作。 动机 在软件系统中&#xff0c;经常面临着创…

Flowable-升级为7.0.0.M2-第一节

目录 升级jdk升级springboot到3.1.3升级数据库连接池druid-spring-boot-3-starter到1.2.20升级mybatis-plus到3.5.3.2升级flowable到7.0.0.M2 最近有些读者一直问flowable如何升级到7.0.0.M2&#xff0c;接下来我就一步步的把flowable升级到7.0.0.M2 升级jdk flowable7.x采用的…

【数据结构】LRU缓存的简单模拟实现(leetcode力扣146LRU缓存)

文章目录 一、定义二、LRU模拟实现二、代码实现 一、定义 LRU是Least Recently Used的缩写&#xff0c;意思是最近最少使用&#xff0c;它是一种Cache替换算法。 Cache的容量有限&#xff0c;因此当Cache的容量用完后&#xff0c;而又有新的内容需要添加进来时&#xff0c; 就…

VScode远程连接服务器,Pycharm专业版下载及远程连接(深度学习远程篇)

Visual Code、PyCharm专业版&#xff0c;本地和远程交互。 远程连接需要用到SSH协议的技术&#xff0c;常用的代码编辑器vscode 和 pycharm都有此类功能。社区版的pycharm是免费的&#xff0c;但是社区版不支持ssh连接服务器&#xff0c;只有专业版才可以&#xff0c;需要破解…

ARM Cortex-A学习(1):GIC(通用中断控制器)详解

文章目录 1 Cortex-A核中断1.1 处理器模式1.2 IRQ模式 2 GIC的操作2.1 CPU Interface2.2 Distributor GIC(通用中断控制器, Generic Interrupt Controller)是一种用于处理中断的硬件组件&#xff0c;它的主要功能是协调和管理系统中的中断请求&#xff0c;确保它们被正确地传递…

前端项目重构的深度思考和复盘

摘要&#xff1a; 项目重构是每一家稳定发展的互联企业的必经之路, 就像一个产品的诞生, 会经历产品试错和产品迭代 一样, 随着业务或新技术的不断发展, 已有架构已无法满足更多业务扩展的需求, 所以只有通过重构来让产品“进化”, 才能跟上飞速发展的时代浪潮. 技术因素 早期…

【http】缓存协议

✨ 专栏介绍 在当今互联网时代&#xff0c;计算机网络已经成为了人们生活和工作中不可或缺的一部分。而要实现计算机之间的通信和数据传输&#xff0c;就需要依靠各种网络协议来进行规范和约束。无论是浏览网页、发送电子邮件还是进行在线交流&#xff0c;都离不开各种各样的网…

使用pytorch神经网络拟合计算模型

一. 内容简介 python调用百度翻译api&#xff0c;将中文论文翻译英文&#xff0c;并保留部分格式 二. 软件环境 2.1vsCode 2.2Anaconda version: conda 22.9.0 2.3数据文件 链接&#xff1a;https://pan.baidu.com/s/1csJOoErGyx77MW_FImVKjg?pwd1234 三.主要流程 3.…

@click 默认传递原生的事件对象

项目场景 [Day1] <template><div id"app"><h1>小黑记事本</h1><button click"handleClick">www</button><div class"head"><!-- 按键&#xff08;回车&#xff09;按下&#xff0c;出发add事件&…

MyBatis见解4

10.MyBatis的动态SQL 10.5.trim标签 trim标签可以代替where标签、set标签 mapper //修改public void updateByUser2(User user);<update id"updateByUser2" parameterType"User">update user<!-- 增加SET前缀&#xff0c;忽略&#xff0c;后缀…

uniapp创建/运行/发布项目

1、产生背景----跨平台应用框架 在移动端各大App盛行的时代&#xff0c;App之间的竞争也更加激烈&#xff0c;他们执着于让一个应用可以做多个事情 所以就应运而生了小程序&#xff0c;微信小程序、支付宝小程序、抖音小程序等等基于App本身的内嵌类程序。 但是各大App他不可…

解决ELement-UI三级联动数据不回显

目录 一.处理数据时使用this.$set方法来动态地设置实例中的属性&#xff0c;以确保其响应式。 二.检查数据格式是否正确 三.绑定v-if 确保每次执行 四.完整代码 一.处理数据时使用this.$set方法来动态地设置实例中的属性&#xff0c;以确保其响应式。 二.检查数据格式是否正确…

通过three.js玩转车展项目

1.项目搭建 1.1 创建文件夹 mkdir 文件名1.2 初始化package.json npm init -y1.3 安装打包工具并配置相关依赖 npm i parcel -d在package.json中打包路径和指令 1.4 安装three.js npm i three -d2.项目搭建 2.1 新建index.html&#xff0c;并再index.html引入car.js,在…

分类预测 | Matlab实现SCSO-SVM基于沙猫群优化算法优化支持向量机的多变量分类预测【23年新算法】

分类预测 | Matlab实现SCSO-SVM基于沙猫群优化算法优化支持向量机的多变量分类预测【23年新算法】 目录 分类预测 | Matlab实现SCSO-SVM基于沙猫群优化算法优化支持向量机的多变量分类预测【23年新算法】分类效果基本描述程序设计参考资料 分类效果 基本描述 1.Matlab实现SCSO-…

MySQL递归公用表表达式

&#x1f607;作者介绍&#xff1a;一个有梦想、有理想、有目标的&#xff0c;且渴望能够学有所成的追梦人。 &#x1f386;学习格言&#xff1a;不读书的人,思想就会停止。——狄德罗 ⛪️个人主页&#xff1a;进入博主主页 &#x1f5fc;专栏系列&#xff1a;MySQL知识 &…

asp.net core 教程

asp.net core 教程 写在前面新建项目Get和PostGETPOST MVC-模型控制视图如何通俗理解MVC代码实例 API模型&#xff08;前后端分离&#xff09;前端代码后端代码 文件配置优先级优先级顺序 从数据库读取配置文件数据缓存 写在前面 学了快一年多的C#了&#xff01; 我最开始学的…

XxlJob 常见的报错

XxlJob 启动日志报错&#xff1a; 报错一&#xff1a; ERROR c.x.job.core.util.XxlJobRemotingUtil - Connection refused: connect java.net.ConnectException: Connection refused: connect 解决方法&#xff1a; 要启动的类是 XxlJobAdminApplication &#xff0c;而不是…