首页 > 其他分享 >WPF属性---重复样式和触发器

WPF属性---重复样式和触发器

时间:2022-12-23 10:38:32浏览次数:36  
标签:TargetType 触发器 样式 button --- 设置 按钮 WPF


重复样式

<StackPanel>

<Button FontSize="20" Foreground="Red" Content="hello" Width="100" Height="40"/>

<Button FontSize="20" Foreground="Red" Content="hello" Width="100" Height="40"/>

<Button FontSize="20" Foreground="Red" Content="hello" Width="100" Height="40"/>

</StackPanel>

WPF属性---重复样式和触发器_触发器

通过以上的设置我们发现有很多重复的代码,在编写代码的时候,我们要避免代码的重复,代码的冗余,我们需要借助window资源,<window.Resources>

都要设置一个键值,通过键值找到样式X:key,例如:X:key=“defaultStyle”,通过defaultStyle找到样式

设置类型,TargetType。我们要为button设置样式,那么TargetType的类型就是button:TargetType=“button”。在接下来的设置中,我们就可以依据button的属性来设置

WPF属性---重复样式和触发器_键值_02

<Window.Resources>

<Style x:Key="defaultStyle" TargetType="Button"><!--TargetType要为谁设置样式-->

<Setter Property="FontSize" Value=" 30"/>

<Setter Property="Foreground" Value="blue"/>

<Setter Property="Width" Value="10"/>

</Style>

</Window.Resources>

<Grid>

<StackPanel>

按钮调用

<Button Style="{StaticResource defaultStyle}" Foreground="Red" Content="hello" Width="100" Height="40"/>

<Button FontSize="20" Foreground="Red" Content="hello" Width="100" Height="40"/>

<Button FontSize="20" Foreground="Red" Content="hello" Width="100" Height="40"/>

</StackPanel>

</Grid>

触发器

触发器就像开关一样,比如说一个按钮放上去的时候是什么样的拿下来又是什么样的

<Style.Triggers>

Trigger 为其中的一个触发器,还有其他样式

<Trigger Property="IsMouseOver" Value="True">

设置的各个属性

<Setter Property="Foreground" Value="Red"/>

<Setter Property="FontSize" Value="100"/>

</Trigger>

</Style.Triggers>

表现效果,当鼠标移动到按钮上会发生字体变为共色,字体为100

多条件触发器

<Style.Triggers>

<MultiTrigger><!--多条件触发器 当满足多个条件之后才触发的-->

<MultiTrigger.Conditions>

<!--两个条件同时满足--> 相当于这里是if语句

<Condition Property="IsMouseOver" Value="True"/>

<Condition Property=" IsFocused" Value="True"/>

</MultiTrigger.Conditions>

<!--满足以上两个条件执行什么-->就执行什么语句

<MultiTrigger.Setters>

<Setter Property="Foreground" Value="Red"/>

</MultiTrigger.Setters>

</MultiTrigger>

</Style.Triggers>

事件触发器

<EventTrigger RoutedEvent="Mouse.MouseEnter">

<EventTrigger.Actions>

<BeginStoryboard><!--动画效果-->

<Storyboard>

<DoubleAnimation Duration="0:0:0.2"

Storyboard.TargetProperty="FontSize" To="30">

</DoubleAnimation>

</Storyboard>

</BeginStoryboard>

</EventTrigger.Actions>

</EventTrigger>

标签:TargetType,触发器,样式,button,---,设置,按钮,WPF
From: https://blog.51cto.com/u_15902978/5965019

相关文章

  • WPF限制文本框只能输入数字
    在一个程序中有时候文本框需要添加限制,比如需要限制文本框只能输入数字,限制文本框只能输入数字和字母等等。先来介绍文本框只能输入数字<TextBoxPreviewTextInput="User......
  • 设计模式-----结构型模式
    设计模式结构型包含:适配器模式、桥接模式、组合模式、装饰模式、享元模式、外观模式、代理模式。关系分类适配器:将一个类的接口转换成客户希望的另一个接口。适配器模式使得......
  • 设计模式-----创建型模式
    创建型模式隐藏了这些类的实例是如何被创建和放在一起,整个系统关于这些的对象所知道的是由抽象接口所定义的接口。这样创建型模式在创建什么、谁创建它、它是怎么被创建的,以......
  • xxl-job使用openfeign,报空指针异常(java.lang.NullPointerException)
    当使用xxl-job调用项目时,如果刚好使用了feign中间件调用微服务接口,会报空指针异常可以在代码前面加一句:RequestContextHolder.setRequestAttributes(newServletReques......
  • 机器学习-企业破产预测
    企业破产预测选题背景企业破产是商品经济的必然产物.在社会主义商品经济条件下,企业破产也是一种客观存在的经济现象.新中国的第一部《企业破产法》已经诞生,它的实施必......
  • vue 中简单的使用css变量 --color
    <divclass="list"><divclass="list-item"draggable="true"style="--color:#e63e31"><spanclass="list-item-title">双鱼座</span></......
  • CloudCanal实战-五分钟搞定Oracle到StarRocks数据迁移与同步
    简述CloudCanal当前最新版本已经支持源端Oracle、SqlServer等主流传统数据库作为源端迁移同步数据到StarRocks来构建实时数仓。本文简要介绍如何快速构建一条Oracle->Star......
  • helm安装kube-prometheus-stack
    helm安装:wgethttps://get.helm.sh/helm-v3.9.2-linux-386.tar.gztar-xzvfhelm-v3.9.2-linux-386.tar.gzmvlinux-386/helm/usr/bin/ helm安装prometheus...helmr......
  • Prometheus监控之process-exporter
    一、简介有些应用程序无法直接检测,要么是因为您无法控制代码,要么是因为它们是用一种不容易用Prometheus检测的语言编写的。我们必须转而求助于挖掘/proc。二、安装配置1......
  • leetcode-11. 盛最多水的容器
    ​​11.盛最多水的容器​​难度中等3977收藏分享切换为英文接收动态反馈给定一个长度为​​n​​的整数数组​​height​​。有​​n​​条垂线,第​​i​​条线的......