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事件:
<Canvas Background="#46461F"> <Ellipse WIDth="120" Height="120" Fill="Orange" Canvas.top="60" Canvas.left="80" MouseEnter="OnMouseEnter" MouseLeave="OnMouseLeave"/> <Ellipse WIDth="120" Height="120" Fill="Orange" Canvas.top="60" Canvas.left="280" MouseEnter="OnMouseEnter" MouseLeave="OnMouseLeave"/></Canvas>
编写事件处理程序,鼠标放上去时和鼠标移开时分别改变圆形的填充色:
voID OnMouseEnter(object sender,MouseEventArgs e){ Ellipse ell = sender as Ellipse; ell.Fill = new SolIDcolorBrush(colors.Yellow);}voID OnMouseLeave(object sender,MouseEventArgs e){ Ellipse ell = sender as Ellipse; ell.Fill = new SolIDcolorBrush(colors.Green);}
运行后效果如下:
分别在两个圆形上放上鼠标并移开后如下所示:
使用代码管理事件除了在XAML中声明事件外,也可以直接使用代码来注册事件,简单的修改一下上面的XAML文件,去掉事件的声明并为两个圆形分别加上name:
<Canvas Background="#46461F"> <Ellipse x:name="ellipse1" WIDth="120" Height="120" Fill="Orange" Canvas.top="60" Canvas.left="80"/> <Ellipse x:name="ellipse2" WIDth="120" Height="120" Fill="Orange" Canvas.top="60" Canvas.left="280"/></Canvas>
在代码中进行事件注册:
public partial class Page : UserControl{ public Page() { InitializeComponent(); ellipse1.MouseEnter += new MouseEventHandler(OnMouseEnter); ellipse1.MouseLeave += new MouseEventHandler(OnMouseLeave); ellipse2.MouseEnter += new MouseEventHandler(OnMouseEnter); ellipse2.MouseLeave += new MouseEventHandler(OnMouseLeave); } voID OnMouseEnter(object sender,MouseEventArgs e) { Ellipse ell = sender as Ellipse; ell.Fill = new SolIDcolorBrush(colors.Yellow); } voID OnMouseLeave(object sender,MouseEventArgs e) { Ellipse ell = sender as Ellipse; ell.Fill = new SolIDcolorBrush(colors.Green); }}
运行后可以看到跟上面一样的效果:
事件数据所有的鼠标事件都使用MousebuttonEventArgs和MouseEventArgs作为事件数据,通过这两个参数可以获取相关事件数据,使用Getposition方法或者Source、Handled属性。如下面的XAML声明:
<Canvas Background="#46461F"> <Rectangle Fill="Orange" stroke="White" strokeThickness="2" Canvas.top="40" Canvas.left="130" WIDth="240" Height="120" MouseMove="Rectangle_MouseMove"/> <TextBlock x:name="Status" Foreground="White" Text="Status" Canvas.left="100" Canvas.top="200"/></Canvas>
为矩形添加MouseMove事件处理,在鼠标移动时我们获取当前坐标位置,并显示出来:
private voID Rectangle_MouseMove(object sender,MouseEventArgs e){ Point p = e.Getposition(e.source as FrameworkElement); Status.Text = String.Format("坐标位置({0}:{1})",p.X,p.Y);}
运行后在矩形中移动鼠标,效果如下:
路由事件在Silverlight中,提供了事件路由,使得我们可以在父节点上接收和处理来自于子节点的事件,Silverlight中的路由事件采用了冒泡路由策略。在鼠标事件中MouseleftbuttonDown 、MouseleftbuttonUp 、MouseMove三个事件都支持路由事件,而MouseEnter、MouseLeave两个事件不支持。下面的XAML中我们为Canvas对象声明了一个MouseleftbuttonDown事件:
<Canvas x:name="ParentCanvas" Background="#46461F" MouseleftbuttonDown="ParentCanvas_MouseleftbuttonDown"> <Rectangle x:name="RecA" Fill="Orange" stroke="White" strokeThickness="2" Canvas.top="40" Canvas.left="60" WIDth="160" Height="100"/> <Rectangle x:name="RecB" Fill="lightBlue" stroke="White" strokeThickness="2" Canvas.top="40" Canvas.left="240" WIDth="160" Height="100"/> <TextBlock x:name="Status" Foreground="White" Text="Status" Canvas.left="100" Canvas.top="200"/></Canvas>
添加MouseleftbuttonDown事件处理程序,显示当前鼠标按下时的坐标,并显示源控件名称:
private voID ParentCanvas_MouseleftbuttonDown(object sender,MousebuttonEventArgs e){ String msg = "x:y = " + e.Getposition(sender as FrameworkElement).ToString(); msg += " from " + (e.source as FrameworkElement).name; Status.Text = msg;}
运行后在RecA上按下鼠标:
在Canvas上按下鼠标:
结束语本文简单介绍了Silverlight 2中关于鼠标事件处理的一些知识,包括事件注册、获取事件数据、路由事件等。在下一篇中,我们将使用这些鼠标事件来实现一个简单的拖放功能。
下一篇:一步一步学Silverlight 2系列(5):实现简单的拖放功能
作者: TerryLee出处: http://terrylee.cnblogs.com 总结
以上是内存溢出为你收集整理的一步一步学Silverlight 2系列(4):鼠标事件处理全部内容,希望文章能够帮你解决一步一步学Silverlight 2系列(4):鼠标事件处理所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)