.NEt专家博客!

【李会军】一步一步学Silverlight 2系列(4):鼠标事件处理

上一篇 / 下一篇  2008-04-11 19:15:58

概述

Silverlight 2 Beta 1版本发布了,无论从Runtime还是Tools都给我们带来了很多的惊喜,如支持框架语言Visual Basic, Visual C#, IronRuby, Ironpython,对JSON、Web Service、WCF以及Sockets的支持等一系列新的特性。《一步一步学Silverlight 2系列》文章带您快速进入Silverlight 2开发。

本文为系列文章第四篇,学习Silverlight 2中的鼠标事件处理,支持的鼠标事件包括MouseMove 、MouseEnter 、MouseLeave 、MouseLeftButtonDown、MouseLeftButtonUp。

声明事件

对于鼠标事件我们可以附加到任何Silverlight对象上面,如下面的XAML声明,为两个圆形添加上MouseEnter和MouseLeave事件:

<CanvasBackground="#46461F">ITPUB个人空间i,R`$z&}3Qz
r
<
EllipseWidth="120"Height="120"Fill="Orange"
h.d!u Bkn/J$o!a^"Y-I0
Canvas.Top="60"Canvas.Left="80"
Krq;{2I2^/}8A~0
MouseEnter="OnMouseEnter"
8`2d1~8vZ`}0
MouseLeave="OnMouseLeave"/>
(jhddP0ITPUB个人空间\*WP ^ A*X&^
<
EllipseWidth="120"Height="120"Fill="Orange"ITPUB个人空间(h$u(R)P0n^;r)t
Canvas.Top="60"Canvas.Left="280"
,\"_5` nZYd0]7e6`0
MouseEnter="OnMouseEnter"
)CG5m}tE$FG:E&i0
MouseLeave="OnMouseLeave"/>ITPUB个人空间7^RNj K1r
</
Canvas>

编写事件处理程序,鼠标放上去时和鼠标移开时分别改变圆形的填充色:

voidOnMouseEnter(objectsender,MouseEventArgse)ITPUB个人空间4\["gg3{Ow
{
"qBA.O"Hc2`z^eV0Ellipseell = senderasEllipse;
'l8~~6_eg2QG#B0ell.Fill =newSolidColorBrush(Colors.Yellow);
CZS@7s0}ITPUB个人空间 j q H2AN$K;ar
voidOnMouseLeave(objectsender,MouseEventArgse)ITPUB个人空间:P!]gB4~`:bM
{
:O u}0I{i3? XZ0Ellipseell = senderasEllipse;
+Xf\@8gX!\"z$A0ell.Fill =newSolidColorBrush(Colors.Green);ITPUB个人空间 a%jcT$hN @Lh9{
}

运行后效果如下:
ea}0a&k D0ITPUB个人空间2Bhm+VU+xT
分别在两个圆形上放上鼠标并移开后如下所示:ITPUB个人空间(d x.V9p3oU
ITPUB个人空间_;nQ a7h{ `'f,@

使用代码管理事件

除了在XAML中声明事件外,也可以直接使用代码来注册事件,简单的修改一下上面的XAML文件,去掉事件的声明并为两个圆形分别加上Name:

<CanvasBackground="#46461F">
,_ iy R9^(`0<
Ellipsex:Name="ellipse1"Width="120"Height="120"Fill="Orange"ITPUB个人空间R8N#j)xv?
Canvas.Top="60"Canvas.Left="80"/>
ms2q.D7{\ x jA0ITPUB个人空间X'KSfQ2mV] {
<
Ellipsex:Name="ellipse2"Width="120"Height="120"Fill="Orange"
!hJG7{z-{$J0
Canvas.Top="60"Canvas.Left="280"/>
M'B:bEaI#q4p)Hv0</
Canvas>

在代码中进行事件注册:

public partial classPage:UserControl
a;@E%NH8K0
{
'd{(e M5fj0publicPage()ITPUB个人空间xh Z p%l4p!a e
{ITPUB个人空间 R7V*X%I4q'P+x,_2Y
InitializeComponent();ITPUB个人空间&z }N6E1l*i4Q
ellipse1.MouseEnter +=newMouseEventHandler(OnMouseEnter);
ruo2n KW0ellipse1.MouseLeave +=newMouseEventHandler(OnMouseLeave);
-X/r)^f,[(e0ellipse2.MouseEnter +=newMouseEventHandler(OnMouseEnter);ITPUB个人空间h$GZwS3P KR$D
ellipse2.MouseLeave +=newMouseEventHandler(OnMouseLeave);
h5V$jdv4`5E;n0}ITPUB个人空间3B&B9n [A?
ITPUB个人空间8X:]d)w;f
voidOnMouseEnter(objectsender,MouseEventArgse)
"j)Gt~uF r0{ITPUB个人空间6o{$Yk.lq3@k*x
Ellipseell = senderasEllipse;
8mD;_R5F#R]#[0ell.Fill =newSolidColorBrush(Colors.Yellow);
x-IoN'e1A)I0}ITPUB个人空间g3q n!K+B3p
voidOnMouseLeave(objectsender,MouseEventArgse)
U/Y@8D#X-\/`rg0{
KD:n'U5k Y6~0Ellipseell = senderasEllipse;ITPUB个人空间vy(x7Z+^+Y K|a
ell.Fill =newSolidColorBrush(Colors.Green);
i6|#jf_x"\0}
+}9W$vr}^0}

运行后可以看到跟上面一样的效果:
p2g,o-[{+T0
#|Vkb#PLR0
'kVkakJ {Ch|0

事件数据

所有的鼠标事件都使用MouseButtonEventArgs和MouseEventArgs作为事件数据,通过这两个参数可以获取相关事件数据,使用GetPosition方法或者Source、Handled属性。如下面的XAML声明:

<CanvasBackground="#46461F">ITPUB个人空间f0A)k
m.G9\k
<
RectangleFill="Orange"Stroke="White"StrokeThickness="2"ITPUB个人空间8bZ;q-Gi2m#Q-s
Canvas.Top="40"Canvas.Left="130"ITPUB个人空间c5E)ybi7f6} \
Width="240"Height="120"ITPUB个人空间\lOuUl
MouseMove="Rectangle_MouseMove"/>ITPUB个人空间)l&L+{z @K*l
<
TextBlockx:Name="Status"Foreground="White"Text="Status"ITPUB个人空间(`fr)S,v4syX ts
Canvas.Left="100"Canvas.Top="200"/>
?7|#JA-l_Z ^l J0</
Canvas>

为矩形添加MouseMove事件处理,在鼠标移动时我们获取当前坐标位置,并显示出来:

private voidRectangle_MouseMove(objectsender,MouseEventArgse)
n^5aUe8WY#zq*F0{
*tg.^6s5\-P0Pointp = e.GetPosition(e.SourceasFrameworkElement);ITPUB个人空间(p:c7y2l`&U~C
Status.Text =String.Format("坐标位置({0}:{1})",p.X,p.Y);ITPUB个人空间*zm/Cp1w5GGtn
}

运行后在矩形中移动鼠标,效果如下:


%p"WP8yJ[4fR4@0

路由事件

在Silverlight中,提供了事件路由,使得我们可以在父节点上接收和处理来自于子节点的事件,Silverlight中的路由事件采用了冒 泡路由策略。在鼠标事件中MouseLeftButtonDown 、MouseLeftButtonUp 、MouseMove三个事件都支持路由事件,而MouseEnter、MouseLeave两个事件不支持。下面的XAML中我们为Canvas对象声 明了一个MouseLeftButtonDown事件:

<Canvasx:Name="ParentCanvas"Background="#46461F"
CZmE$]s|I0
MouseLeftButtonDown="ParentCanvas_MouseLeftButtonDown">
/G!N5^/aK|$r!j J0<
Rectanglex:Name="RecA"Fill="Orange"Stroke="White"StrokeThickness="2"
't4g(E-hm'O2j0
Canvas.Top="40"Canvas.Left="60"
dQ'm#{S0
Width="160"Height="100"/>
?O&W[,^Q3q9g0<
Rectanglex:Name="RecB"Fill="LightBlue"Stroke="White"StrokeThickness="2"
6r5[;`a N7u0
Canvas.Top="40"Canvas.Left="240"ITPUB个人空间3u0v(M6[^){5z.Q4\\
Width="160"Height="100"/>ITPUB个人空间 d&y)B7\1wj+@ rW.M
<
TextBlockx:Name="Status"Foreground="White"Text="Status"
a8IK'z!QW*AS+I0
Canvas.Left="100"Canvas.Top="200"/>
~ C!si$XRch_l0</
Canvas>

添加MouseLeftButtonDown事件处理程序,显示当前鼠标按下时的坐标,并显示源控件名称:

private voidParentCanvas_MouseLeftButtonDown(objectsender,MouseButtonEventArgse)
R \1S]*OqT0{
l w({{,F4_t0Stringmsg ="x:y = "+ e.GetPosition(senderasFrameworkElement).ToString();ITPUB个人空间5C0Yz L(s h6Gs c;E%S
msg +=" from "+ (e.SourceasFrameworkElement).Name;
T2i+G#} ivGt4N0Status.Text = msg;ITPUB个人空间 l?_CFOR'T+v_
}

运行后在RecA上按下鼠标:
)eS5uM!g(~x0ITPUB个人空间7g5~*p A:{F
在Canvas上按下鼠标:ITPUB个人空间9?UWJO4w

f!dt-Z%q-t7k0

结束语

本文简单介绍了Silverlight 2中关于鼠标事件处理的一些知识,包括事件注册、获取事件数据、路由事件等。在下一篇中,我们将使用这些鼠标事件来实现一个简单的拖放功能。

作者:TerryLeeITPUB个人空间~P"c-B3g BA
出处:http://terrylee.cnblogs.com


+U*UY9Rwk/f6D0


TAG:

引用 删除 Guest   /   2009-04-18 12:15:54
1
引用 删除 Guest   /   2008-12-05 13:54:44
-5
anniexing的个人空间 引用 删除 anniexing   /   2008-11-04 19:09:48
5
 

评分:0

我来说两句

显示全部

:loveliness: :handshake :victory: :funk: :time: :kiss: :call: :hug: :lol :'( :Q :L ;P :$ :P :o :@ :D :( :)

Open Toolbar