需求:很多时候界面上的按钮都需要被贴上图片,一般来说:

1.按钮处于正常状态,按钮具有背景图A

2.鼠标移至按钮上方状态,按钮具有背景图B

3.鼠标点击按钮状态,按钮具有背景图C

4.按钮处于不可用状态,按钮具有背景图D

实现起来,毫无疑问,没什么难度。但是过程还是比较繁琐。这里我将这个过程封装为新的控件类:ImageButton

ImageButton中有四个属性(支持绑定),分别对应上面A、B、C、D四个背景图的路径。

#region 属性
/// <summary>
/// 按钮处于正常状态下的背景图片的路径
/// </summary>
public string NormalBackgroundImage
{get { return ( string ) GetValue ( NormalBackgroundImageProperty ); }set { SetValue ( NormalBackgroundImageProperty, value ); }
}/// <summary>
/// 鼠标移到按钮上面,按钮的背景图片的路径
/// </summary>
public string MouseoverBackgroundImage
{get { return ( string ) GetValue ( MouseoverBackgroundImageProperty ); }set { SetValue ( MouseoverBackgroundImageProperty, value ); }
}/// <summary>
/// 鼠标按下按钮,按钮的背景图片的路径
/// </summary>
public string MousedownBackgroundImage
{get { return ( string ) GetValue ( MousedownBackgroundImageProperty ); }set { SetValue ( MousedownBackgroundImageProperty, value ); }
}/// <summary>
/// 当按钮不可用时按钮的背景图片
/// </summary>
public string DisabledBackgroundImage
{get { return ( string ) GetValue ( DisabledBackgroundImageProperty ); }set { SetValue ( DisabledBackgroundImageProperty, value ); }
}
#endregion#region 依赖属性
/// <summary>
/// 按钮处于正常状态下的背景图片的路径(这是依赖属性)
/// </summary>
public static readonly DependencyProperty NormalBackgroundImageProperty =DependencyProperty.Register ( "NormalBackgroundImage", typeof ( string ), typeof ( ImageButton ), new PropertyMetadata ( null ) );/// <summary>
/// 鼠标移到按钮上面,按钮的背景图片的路径(这是依赖属性)
/// </summary>
public static readonly DependencyProperty MouseoverBackgroundImageProperty =DependencyProperty.Register ( "MouseoverBackgroundImage", typeof ( string ), typeof ( ImageButton ), new PropertyMetadata ( null ) );/// <summary>
/// 鼠标按下按钮,按钮的背景图片的路径(这是依赖属性)
/// </summary>
public static readonly DependencyProperty MousedownBackgroundImageProperty =DependencyProperty.Register ( "MousedownBackgroundImage", typeof ( string ), typeof ( ImageButton ), new PropertyMetadata ( null ) );/// <summary>
/// 当按钮不可用时按钮的背景图片(这是一个依赖属性)
/// </summary>
public static readonly DependencyProperty DisabledBackgroundImageProperty =DependencyProperty.Register ( "DisabledBackgroundImage", typeof ( string ), typeof ( ImageButton ), new PropertyMetadata ( null ) );
#endregion

然后重写按钮的Style,Style保存在资源字典中:

<Style x:Key="ImageButtonStyle" TargetType="{x:Type local:ImageButton}"><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="{x:Type local:ImageButton}"><Border x:Name="buttonBorder"><Border.Background><ImageBrush ImageSource="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=NormalBackgroundImage}"/></Border.Background><ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/></Border><ControlTemplate.Triggers><Trigger Property="IsMouseOver" Value="True"><Setter Property="Background" TargetName="buttonBorder"><Setter.Value><ImageBrush ImageSource="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=MouseoverBackgroundImage}"/></Setter.Value></Setter></Trigger><Trigger Property="IsPressed" Value="True"><Setter Property="Background" TargetName="buttonBorder"><Setter.Value><ImageBrush ImageSource="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=MousedownBackgroundImage}"/></Setter.Value></Setter></Trigger><Trigger Property="IsEnabled" Value="false"><Setter Property="Background" TargetName="buttonBorder"><Setter.Value><ImageBrush ImageSource="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=DisabledBackgroundImage}"/></Setter.Value></Setter></Trigger></ControlTemplate.Triggers></ControlTemplate></Setter.Value></Setter></Style>

然后在构造函数中将按钮的Style改为写好的Style:

#region 构造函数
public ImageButton() : base()
{//读取资源字典文件ResourceDictionary rd = new ResourceDictionary();rd.Source = new Uri ( "/Zmy.Wpf.Controls;component/Style.xaml", UriKind.Relative );this.Resources.MergedDictionaries.Add ( rd );//获取样式this.Style = this.FindResource ( "ImageButtonStyle" ) as Style;
}
#endregion

通过这样的封装,图片按钮使用起来就非常的方便了:

            <StackPanel Orientation="Vertical"><controls:ImageButton Height="80" Width="80" NormalBackgroundImage="/Test;component/images/normal.png"MousedownBackgroundImage="/Test;component/images/mousedown.png"MouseoverBackgroundImage="/Test;component/images/mouseover.png"/><controls:ImageButton Height="80" Width="80" IsEnabled="False"DisabledBackgroundImage="/Test;component/images/disabled.png"/></StackPanel>

源代码下载地址:(不要积分)http://download.csdn.net/detail/lyclovezmy/7356841

转载于:https://www.cnblogs.com/DoNetCoder/p/3732310.html

WPF控件库:图片按钮的封装相关推荐

  1. Panuon.UI.Silver – 开源C# WPF控件库

    Panuon.UI.Silver – 开源C# WPF控件库 Dotnet9 • 2019年12月13日 22:55 • WPF • 阅读 12145 时间如流水,只能流去不流回! 点赞再看,养成习惯 ...

  2. 《Dotnet9》系列-开源C# WPF控件库2《Panuon.UI.Silver》强力推荐

    国内优秀的WPF开源控件库,Panuon.UI的优化版本.一个漂亮的.使用样式与附加属性的WPF UI控件库,值得向大家推荐使用与学习. 今天站长(Dotnet9,站长网址:https://dotne ...

  3. (四)开源C# WPF控件库《AduSkin – UI》

    微信公众号:[Dotnet9的博客],网站:[Dotnet9],问题或建议:[请网站留言], 如果对您有所帮助:[欢迎赞赏]. https://dotnet9.com 追求极致,永臻完美 A Beau ...

  4. WPF 控件库——仿制Windows10的进度条

    WPF 控件库--仿制Windows10的进度条 原文:WPF 控件库--仿制Windows10的进度条 一.其实有现成的 先来看看Windows10进度条的两种模式: 网上有不少介绍仿制Window ...

  5. WPF控件库MaterialDesignInXamlToolkit

    WPF控件库MaterialDesignInXamlToolkit 引用 MaterialDesignThemes.Wpf.dll 第一步:安装控件库 Install-Package Material ...

  6. 开源C# WPF控件库强力推荐

    点击上方"Dotnet9"添加关注哦 开源C# WPF控件库及项目推荐 本系列已介绍四款开源C# WPF控件库,其中一款国外的,另三款是国内的,大家如有比较好的开源C# WPF控件 ...

  7. wpf加载上千张图片部分图片不显示_开源WPF控件库MaterialDesignInXAML推荐

    (给DotNet加星标,提升.Net技能) 转自:沙漠之狐耶dotnet9.com/?p=2180 前言 介绍一个开源的C# WPF开源控件库,非常漂亮,重点是开源哦 WPF做桌面开发是很有优势的,除 ...

  8. 开源WPF控件库MaterialDesignInXAML推荐

    今天介绍一个开源的C# WPF开源控件库,非常漂亮,重点是开源哦 WPF做桌面开发是很有优势的,除了微软自带的控件外,还有很多第三方的控件库,比如收费的Dev Express For WPF.Tele ...

  9. 很棒的WPF控件库 Newbeecoder.UI

    Newbeecoder.UI是一个强大的WPF基于MVVM框架和控件库实用程序.它支持窗口边框阴影,窗口圆角,包含许多优雅的控件.它让开发人员更高效.更快地创建漂亮的WPF构建应用程序.它支持从4.0 ...

  10. 开源WPF控件库-AdonisUI

    原文:https://github.com/benruehl/adonis-ui 翻译:沙漠尽头的狼(谷歌翻译加持) 用于 WPF 应用程序的轻量级 UI 工具包,提供经典和增强的 Windows 视 ...

最新文章

  1. python3基础知识点总结_python基础知识点总结
  2. 网工路由基础(4)EIGRP协议
  3. PHP参数会被用作对象名
  4. 关闭excel多余的addin,提供excel启动速度
  5. Hybris ECP(Enterprise Commerce Platform)的调试
  6. key位置 win10生成的ssh_Git实现ssh免密登录
  7. 三通道的黑白图(不同于单通道的普通的黑白图片)
  8. 这就是为什么您的开源项目失败
  9. python创建和控制的实体称为_Python eds包_程序模块 - PyPI - Python中文网
  10. c语言串口通信_STM32串口IAP分享
  11. java实验报告心得_java实验报告心得体会.doc
  12. MT7628处理器介绍,MT7628芯片原理图资料
  13. 程序员又要背锅?虾米音乐客户端代码惊现神注释:穷逼 VIP!
  14. vivo怎么切换为Android,vivox60怎么切换系统
  15. java jdbc程序,Java构建JDBC应用程序的操作
  16. Could not find  artifact org.pentaho:pentaho-aggdesigner-algorithm:jar:5.1.5-jhyde
  17. oracle 删除数据
  18. 2022年危险化学品经营单位主要负责人及危险化学品经营单位主要负责人模拟考试
  19. DBA Scripts
  20. 超级账本Hyperledger-Fabric本地编译与安装(来源于区块链-原理、设计与应用)

热门文章

  1. HTML5之兴趣爱好
  2. 19年计算机英语统考,抓紧!2019年上半年全国计算机等级考试、全国英语等级考试报名即将截止...
  3. linux yum安装erlang,在 CentOS 5.7 上通过 YUM 安装 Erlang 过程
  4. linux 卸载erlang
  5. 机器人学习--国外科研机构机器人应用案例汇总
  6. 十二个”一“的感知评价实验-文献综述
  7. Stata:广义Heckman两步法-gtsheckman
  8. 院士揭秘人工智能是天使还是魔鬼?
  9. u盘删除数据恢复,迅龙U盘数据恢复软件
  10. DM500 机器后面天线ANT OUT 口有什么用?