WPF图标特殊效果实现方法

WPF开发工具的用途主要是体现在各种图形界面的显示方面。那么在使用的过程中，其中有很多技巧值得我们去深入研究。本篇将要实现图标的两个效果：1. 显示图标标签，2. 图标模糊效果。#t#

专注于为中小企业提供成都网站设计、成都网站建设、外贸网站建设服务,电脑端+手机端+微信端的三站合一,更高效的管理,为中小企业灵川免费做网站提供优质的服务。我们立足成都，凝聚了一批互联网行业人才，有力地推动了近1000家企业的稳健成长，帮助中小企业通过网站建设实现规模扩充和转变。

在上一篇中提到Image没有HTML < img>的Title属性（在MSDN中也没找到类似的属性），所以本篇将自行制作一个标签，它的功能是当鼠标移动到图标上方时会显示该图标的Tag说明，并且该WPF图标模糊显示。

1. 在Home < Image>中加入MouseEnter和MouseLeave事件。

< Image　Source="image/home.png"　
Width="110"　Height="110"　
Tag="My　Home"Canvas.Left="30"
Canvas.Top="20"　
Cursor="Hand"　
MouseEnter="Image_BlurEffect_MouseEnter"　
MouseLeave="Image_BlurEffect_MouseLeave">
< /Image>

2. 事件加好了，就要为添加内容了。先看Image_BlurEffect_MouseEnter事件：

 
 
 
  
  
  private　void　Image_BlurEffect_
MouseEnter(object　sender,
MouseEventArgs　e)　 
  
  
  {　 
  
  
  //将sender定义为Image对象　 
  
  
  Image　image　=　sender　as　Image; 
  
  
  //创建模糊BlurEffect对象　 
  
  
  BlurEffect　newBlurEffect　=　
new　BlurEffect(); 
  
  
  //设定模糊效果值Radius　 
  
  
  newBlurEffect.Radius　=　5; 
  
  
  //为Image添加Blur效果　 
  
  
  image.Effect　=　newBlurEffect; 
  
  
  //将Image　Tag内容传给imageTitle　
Textblock　 
  
  
  imageTitle.Text　=　"　"　+　
image.Tag.ToString()　+"　"; 
  
  
  //将imageTitle的Border设置为可见　 
  
  
  imageTitleBorder.Visibility　=　
Visibility.Visible; 
  
  
  //调整imageTitleBorder的Canvas位置，
使其在图标下方显示　 
  
  
  Canvas.SetLeft(imageTitleBorder,　
Canvas.GetLeft(image)+　image.
Width　/　2　-　15);　 
  
  
  Canvas.SetTop(imageTitleBorder,　125);　 
  
  
  } 
  
  
  private　void　Image_BlurEffect_
MouseLeave(object　sender,
MouseEventArgs　e)　 
  
  
  {　 
  
  
  Image　image　=　sender　as　Image;　 
  
  
  BlurEffect　newBlurEffect　=　
new　BlurEffect();　 
  
  
  newBlurEffect.Radius　=　0;　 
  
  
  image.Effect　=　newBlurEffect;　 
  
  
  imageTitleBorder.Visibility　=　
Visibility.Collapsed;　 
  
  
  }

可以使用ToolTipService。经过测试使用ToolTip可以实现标签的功能（代码如下），而且也不用预设WPF图标显示效果，但是没法通过Canvas设定其位置，大家可以都学习一下。

 
 
 
  
  
  XAML: 
  
  
  < Image　Source="image/home.png"　
Width="110"　Height="110"　 
  
  
  Tag="My　Home"　Canvas.Left="30"　
Canvas.Top="20"　 
  
  
  MouseEnter="Image_BlurEffect_
MouseEnter"　 
  
  
  MouseLeave="Image_BlurEffect_
MouseLeave"　 
  
  
  Cursor="Hand">　 
  
  
  < Image.ToolTip>　 
  
  
  < TextBlock>My　Home< /TextBlock>　 
  
  
  < /Image.ToolTip>　 
  
  
  < /Image>

C#代码自然就简单多了:

 
 
 
  
  
  private　void　Image_BlurEffect_
MouseEnter(object　sender,
MouseEventArgs　e)　 
  
  
  {　 
  
  
  Image　image　=　sender　as　Image;　 
  
  
  BlurEffect　newBlurEffect　=　
new　BlurEffect();　 
  
  
  newBlurEffect.Radius　=　5;　 
  
  
  image.Effect　=　newBlurEffect;　 
  
  
  }

上面这些方法介绍的就是WPF图标显示效果的实现。

新闻标题：WPF图标特殊效果实现方法
网页路径：http://www.mswzjz.cn/qtweb/news5/3105.html

攀枝花网站建设、攀枝花网站运维推广公司-贝锐智能，是专注品牌与效果的网络营销公司；服务项目有等

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：贝锐智能

贝锐智能技术为您推荐以下文章