当前位置： 移动技术网 > IT编程>开发语言>.net > WPF图片按钮的实现方法

WPF图片按钮的实现方法

2017年11月02日  | 移动技术网IT编程  | 我要评论

刘惠璞简历,澄通铝型材,汪夔万

本文实例为大家分享了wpf图片按钮的实现代码，供大家参考，具体内容如下

直接代码

public class imagebutton : system.windows.controls.button
 {

 /// <summary>
 /// 图片
 /// </summary>
 public static readonly dependencyproperty imageproperty = dependencyproperty.register("image", typeof(imagesource), typeof(imagebutton),
  new propertymetadata(null));

 /// <summary>
 /// 图片的宽度
 /// </summary>
 public static readonly dependencyproperty imagewidthproperty = dependencyproperty.register("imagewidth", typeof(double), typeof(imagebutton),
  new propertymetadata(double.nan));

 /// <summary>
 /// 图片的高度
 /// </summary>
 public static readonly dependencyproperty imageheightproperty = dependencyproperty.register("imageheight", typeof(double), typeof(imagebutton),
  new propertymetadata(double.nan));

 /// <summary>
 /// 构造函数
 /// </summary>
 static imagebutton()
 {
  defaultstylekeyproperty.overridemetadata(typeof(imagebutton), 
  new system.windows.frameworkpropertymetadata(typeof(imagebutton)));
 }

 /// <summary>
 /// 设置图片
 /// </summary>
 public imagesource image
 {
  get
  {
  return getvalue(imageproperty) as imagesource;
  }
  set
  {
  setvalue(imageproperty, value);
  }
 }

 /// <summary>
 /// 图片宽度(属性)
 /// </summary>
 public double imagewidth
 {
  get
  {
  return (double)getvalue(imagewidthproperty);
  }
  set
  {
  setvalue(imagewidthproperty, value);
  }
 }

 /// <summary>
 /// 图片高度(属性)
 /// </summary>
 public double imageheight
 {
  get
  {
  return (double)getvalue(imageheightproperty);
  }
  set
  {
  setvalue(imageheightproperty, value);
  }
 }

 }

样式代码

<style targettype="{x:type xi:imagebutton}">
 <setter property="template">
  <setter.value>
  <controltemplate targettype="{x:type xi:imagebutton}">
   <grid>
   <grid.rowdefinitions>
    <rowdefinition height="*"/>
    <rowdefinition height="auto"/>
   </grid.rowdefinitions>
   <border x:name="border" grid.rowspan="2" borderbrush="{templatebinding borderbrush}" borderthickness="{templatebinding borderthickness}" background="{templatebinding background}" 
    snapstodevicepixels="true" cornerradius="3,3,3,3"/>
   <image grid.row="0" source="{templatebinding image}"
     width="{templatebinding imagewidth}"
     height="{templatebinding imageheight}"
     verticalalignment="{templatebinding verticalalignment}"/>
   <contentpresenter grid.row="1" horizontalalignment="center" margin="{templatebinding padding}" 
     verticalalignment="center" recognizesaccesskey="true" />
   </grid>
   <controltemplate.triggers>
   <trigger property="ispressed" value="true">
    <setter property="foreground" value="#999999"/>
   </trigger>
   </controltemplate.triggers>

  </controltemplate>
  </setter.value>
 </setter>
 </style>

调用实例

复制代码 代码如下:
 <xi:imagebutton image="../image/设置.png" content="新增会员" imageheight="52" imagewidth="52" width="72" height="72" margin="30,10,10,10"/>

效果展示

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持移动技术网。

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网