WPF自定义控件之带倒计时的按钮--Button
| 1.说明 |
之前做过一个小项目，点击按钮，按钮进入倒计时无效状态，计时完成后，恢复原样，现在就实现该效果---带倒计时的按钮
| 2.效果 |
1）正常状态
2）MouseOver(只有背景色变化)
3）点击进入无效状态
4）在无效状态下计时
5）恢复正常状态
| 3.XAML代码 |
<!--冷却计时按钮样式-->
<!--通过修改颜色值参数，以更改按钮颜色样式，更多修改，还请自行DIY-->
<SolidColorBrush x:Key="ButtonForeground" Color="#FFF9FBFD"/>
<SolidColorBrush x:Key="RactangleFill" Color="#FF6EB3F7"/>
<SolidColorBrush x:Key="MouseOverFill" Color="#FF8CC3F9"/>
<SolidColorBrush x:Key="PressedFill" Color="#888CC3F9"/>
<SolidColorBrush x:Key="EnabledFill" Color="#FF6EB3F7"/>
<SolidColorBrush x:Key="EnabledOpacityMask" Color="#99FFFFFF"/> <!--总样式--> <Style x:Key="TimerBtnStyle" TargetType="{x:Type Button}">
<Setter Property="FontSize" Value="14"/>
<Setter Property="Foreground" Value="{StaticResource ButtonForeground}"/>
<Setter Property="MinHeight" Value="25"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Rectangle x:Name="rectangle" Margin="0" StrokeThickness="0" Fill="{StaticResource RectangleFill}"/>
<ContentPresenter x:Name="contentPresenter" HorizontalAlignment="Center" Margin="0" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="Center"/>
</Grid>
<ControlTemplate.Triggers>
<EventTrigger RoutedEvent="Button.Click">
<BeginStoryboard>
<Storyboard FillBehavior="Stop">
<StringAnimationUsingKeyFrames Storyboard.TargetProperty="(ContentPresenter.Content)" Storyboard.TargetName="contentPresenter">
<DiscreteStringKeyFrame KeyTime="0" Value="已提交"/>
<DiscreteStringKeyFrame KeyTime="0:0:1" Value="等待(30)"/>
<DiscreteStringKeyFrame KeyTime="0:0:2" Value="等待(29)"/>
<DiscreteStringKeyFrame KeyTime="0:0:3" Value="等待(28)"/>
<DiscreteStringKeyFrame KeyTime="0:0:4" Value="等待(27)"/>
<DiscreteStringKeyFrame KeyTime="0:0:5" Value="等待(26)"/>
<DiscreteStringKeyFrame KeyTime="0:0:6" Value="等待(25)"/>
<DiscreteStringKeyFrame KeyTime="0:0:7" Value="等待(24)"/>
<DiscreteStringKeyFrame KeyTime="0:0:8" Value="等待(23)"/>
<DiscreteStringKeyFrame KeyTime="0:0:9" Value="等待(22)"/>
<DiscreteStringKeyFrame KeyTime="0:0:10" Value="等待(21)"/>
<DiscreteStringKeyFrame KeyTime="0:0:11" Value="等待(20)"/>
<DiscreteStringKeyFrame KeyTime="0:0:12" Value="等待(19)"/>
<DiscreteStringKeyFrame KeyTime="0:0:13" Value="等待(18)"/>
<DiscreteStringKeyFrame KeyTime="0:0:14" Value="等待(17)"/>
<DiscreteStringKeyFrame KeyTime="0:0:15" Value="等待(16)"/>
<DiscreteStringKeyFrame KeyTime="0:0:16" Value="等待(15)"/>
<DiscreteStringKeyFrame KeyTime="0:0:17" Value="等待(14)"/>
<DiscreteStringKeyFrame KeyTime="0:0:18" Value="等待(13)"/>
<DiscreteStringKeyFrame KeyTime="0:0:19" Value="等待(12)"/>
<DiscreteStringKeyFrame KeyTime="0:0:20" Value="等待(11)"/>
<DiscreteStringKeyFrame KeyTime="0:0:21" Value="等待(10)"/>
<DiscreteStringKeyFrame KeyTime="0:0:22" Value="等待(09)"/>
<DiscreteStringKeyFrame KeyTime="0:0:23" Value="等待(08)"/>
<DiscreteStringKeyFrame KeyTime="0:0:24" Value="等待(07)"/>
<DiscreteStringKeyFrame KeyTime="0:0:25" Value="等待(06)"/>
<DiscreteStringKeyFrame KeyTime="0:0:26" Value="等待(05)"/>
<DiscreteStringKeyFrame KeyTime="0:0:27" Value="等待(04)"/>
<DiscreteStringKeyFrame KeyTime="0:0:28" Value="等待(03)"/>
<DiscreteStringKeyFrame KeyTime="0:0:29" Value="等待(02)"/>
<DiscreteStringKeyFrame KeyTime="0:0:30" Value="等待(01)"/>
<DiscreteStringKeyFrame KeyTime="0:0:31" Value="等待(00)"/>
</StringAnimationUsingKeyFrames>
<BooleanAnimationUsingKeyFrames Storyboard.TargetProperty="(Button.IsEnabled)">
<DiscreteBooleanKeyFrame KeyTime="0" Value="False"/>
<DiscreteBooleanKeyFrame KeyTime="0:0:32" Value="True"/>
</BooleanAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
<Trigger Property="IsFocused" Value="True"/>
<Trigger Property="IsDefaulted" Value="True"/>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Fill" TargetName="rectangle" Value="{StaticResource MouseOverFill}"/>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Fill" TargetName="rectangle" Value="{StaticResource PressedFill}"/>
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Fill" TargetName="rectangle" Value="{StaticResource EnabledFill}"/>
<Setter Property="OpacityMask" TargetName="contentPresenter" Value="{StaticResource EnabledOpacityMask}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
| 4.应用 |
<Button Width="65" Content="提交请求" FontSize="14" Style="{StaticResource TimerBtnStyle}" />
| 5.总结 |
通过此代码，希望给初学者一些启示，有更多想法的同学，多多批评，不吝赐教。
WPF自定义控件之带倒计时的按钮--Button的更多相关文章
- [转]WPF自定义控件之带倒计时的按钮--Button
1.说明 之前做过一个小项目,点击按钮,按钮进入倒计时无效状态,计时完成后,恢复原样,现在就实现该效果---带倒计时的按钮 2.效果 1)正常状态 2)MouseOver( ...
- WPF自定义控件与样式(2)-自定义按钮FButton
一．前言.效果图 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 还是先看看效果 ...
- 【转】WPF自定义控件与样式(2)-自定义按钮FButton
一．前言.效果图 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等 还是先看看效果图吧: 定义Button按钮名称叫FButton,主要是集成了 ...
- WPF自定义控件与样式(3)-TextBox & RichTextBox & PasswordBox样式、水印、Label标签、功能扩展
一．前言.预览 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要是对文本 ...
- WPF自定义控件与样式(15)-终结篇 & 系列文章索引 & 源码共享
系列文章目录 WPF自定义控件与样式(1)-矢量字体图标(iconfont) WPF自定义控件与样式(2)-自定义按钮FButton WPF自定义控件与样式(3)-TextBox & Ric ...
- WPF自定义控件与样式(5)-Calendar/DatePicker日期控件自定义样式及扩展
一．前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: 日历控 ...
- WPF自定义控件与样式(12)-缩略图ThumbnailImage /gif动画图/图片列表
一．前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要针对WPF项目 ...
- WPF自定义控件与样式(14)-轻量MVVM模式实践
一．前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. MVVM是WPF中一个非 ...
- WPF自定义控件与样式(15)-终结篇
原文:WPF自定义控件与样式(15)-终结篇 系列文章目录 WPF自定义控件与样式(1)-矢量字体图标(iconfont) WPF自定义控件与样式(2)-自定义按钮FButton WPF自定义控件与 ...
随机推荐
- SQL Server blocking session
select * from sys.sysprocesses where blocked>0; 96被95block住了. dbcc INPUTBUFFER(95) dbcc INPUTBUFF ...
- python(6)- json和pickle模块
这是用于序列化的两个模块: json: 用于字符串和python数据类型间进行转换 pickle: 用于python特有的类型和python的数据类型间进行转换 Json模块提供了四个功能:dumps ...
- 【欧拉定理】计算(a^(b^c))%1000000007
欧拉定理(称费马-欧拉定理或欧拉 函数定理) 欧拉定理表明,若n,a为正整数,且n,a互素(即gcd(a,n)=1),则 这个定理可以用来简化幂的模运算.比如计算7222的个位数,实际是求7222被1 ...
- hdu 4267 树形DP
思路:先dfs一下,找出1,n间的路径长度和价值,回溯时将该路径长度和价值清零.那么对剩下的图就可以直接树形dp求解了. #include<iostream> #include<al ...
- PHP，单双引号的区别‘“”“”’
一.转义 单引号:只转义\'和\\,其他不转义 双引号:都转义 二.变量解析 单引号:无法解析变量(原样输出) 双引号:可以解析变量 三.速度 单引号:更快 双引号:要分析是否有变量,转义内容更多 结 ...
- EasyUI的datagrid获取所有正在编辑状态的行的行编号
今天项目需要用了下EasyUI的datagrid的行编辑功能,跟着API来,只要是将各种状态时的处理逻辑弄好,还是蛮不错的. 开发过程中,遇到了个问题,在编辑完成后我需要获取datagrid所有处于编 ...
- SQL 的一个技巧
遇到一个需求,项目是我接手二次开发的,之前的大神设计数据库,订单表中没有订单号,现在让我加上这个号,规则是订单创建日期加上自增的ID,ID需要补足5位,例:00002,00124,01245这样.这个 ...
- 抽象类[abstract]_C#
抽象类(abstract) abstract修饰符可以和类.方法.属性.索引器及事件一起使用.在类声明中使用abstract修饰符以指示某个类只能是其它类的基类.标记为抽象或包含在抽象类中的成员必须通 ...
- NodeJs获取函数名称和函数操作整理
var aa = function () { log("xxxx"); }; aa(); var model = {}; model.test = function () { lo ...
- echarts标准饼图(二)——标题（title）配置
标题(title)配置 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...