WPF圖標(biāo)特殊效果實(shí)現(xiàn)方法

作者：佚名 2009-12-25 14:25:39

WPF圖標(biāo)實(shí)現(xiàn)的效果可以根據(jù)具體程序編程中不同的需求來進(jìn)行改變。比如我們這里要向大家介紹的顯示標(biāo)簽效果和模糊效果的方法等。

WPF開發(fā)工具的用途主要是體現(xiàn)在各種圖形界面的顯示方面。那么在使用的過程中，其中有很多技巧值得我們?nèi)ド钊胙芯俊１酒獙⒁獙?shí)現(xiàn)圖標(biāo)的兩個(gè)效果：1. 顯示圖標(biāo)標(biāo)簽，2. 圖標(biāo)模糊效果。#t#

在上一篇中提到Image沒有HTML < img>的Title屬性（在MSDN中也沒找到類似的屬性），所以本篇將自行制作一個(gè)標(biāo)簽，它的功能是當(dāng)鼠標(biāo)移動(dòng)到圖標(biāo)上方時(shí)會(huì)顯示該圖標(biāo)的Tag說明，并且該WPF圖標(biāo)模糊顯示。

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. 事件加好了，就要為添加內(nèi)容了。先看Image_BlurEffect_MouseEnter事件：

private　void　Image_BlurEffect_
MouseEnter(object　sender,
MouseEventArgs　e)　  
{　  
//將sender定義為Image對(duì)象　  
Image　image　=　sender　as　Image;  
//創(chuàng)建模糊BlurEffect對(duì)象　  
BlurEffect　newBlurEffect　=　
new　BlurEffect();  
//設(shè)定模糊效果值Radius　  
newBlurEffect.Radius　=　5;  
//為Image添加Blur效果　  
image.Effect　=　newBlurEffect;  
//將Image　Tag內(nèi)容傳給imageTitle　
Textblock　  
imageTitle.Text　=　"　"　+　
image.Tag.ToString()　+"　";  
//將imageTitle的Border設(shè)置為可見　  
imageTitleBorder.Visibility　=　
Visibility.Visible;  
//調(diào)整imageTitleBorder的Canvas位置，
使其在圖標(biāo)下方顯示　  
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。經(jīng)過測(cè)試使用ToolTip可以實(shí)現(xiàn)標(biāo)簽的功能（代碼如下），而且也不用預(yù)設(shè)WPF圖標(biāo)顯示效果，但是沒法通過Canvas設(shè)定其位置，大家可以都學(xué)習(xí)一下。

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#代碼自然就簡(jiǎn)單多了:

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圖標(biāo)顯示效果的實(shí)現(xiàn)。

責(zé)任編輯：曹凱來源： ddvip.com

WPF圖標(biāo)