在Silverlight中自身并没有提供拖放功能的相关实现,要实现拖放功能得借助其事件支持(MouseLeftButtonDown、MouseLeftButtonUp和MouseMove)来完成,实际应用中我们可以通过行为(Behavior)特性将拖放操作封装为行为,这样可达到代码复用的效果。而在Blend中则直接提供了拖放操作行为,它位于Microsoft.Expression.Interactions.dll的Microsoft.Expression.Interactivity.Layout名称空间下。
Silverlight中的拖放操作通常是使用事件驱动动态定位对象的坐标来实现,首先来看看如何通过代码的可编程方式在Silverlight中实现拖放操作,如下代码块:
<!--<br/ /><br/ />Code highlighting produced by Actipro CodeHighlighter (freeware)<br/ />http://www.CodeHighlighter.com/<br/ /><br/ />-->privatevoidOnMouseLeftButtonDown(objectsender,MouseButtonEventArgse)
{
FrameworkElementelement=senderasFrameworkElement;
MousePosition=e.GetPosition(null);
IsMouseCaptured=true;
element.CaptureMouse();
element.Cursor=Cursors.Hand;
}
privatevoidOnMouseLeftButtonUp(objectsender,MouseButtonEventArgse)
{
FrameworkElementelement=senderasFrameworkElement;
IsMouseCaptured=false;
element.ReleaseMouseCapture();
MousePosition.X=MousePosition.Y=0;
element.Cursor=null;
}
privatevoidOnMouseMove(objectsender,MouseEventArgse)
{
FrameworkElementelement=senderasFrameworkElement;
if(IsMouseCaptured)
{
doubleY=e.GetPosition(null).Y-MousePosition.Y;
doubleX=e.GetPosition(null).X-MousePosition.X;
X=X+(double)element.GetValue(Canvas.LeftProperty);
Y=Y+(double)element.GetValue(Canvas.TopProperty);
element.SetValue(Canvas.LeftProperty,X);
element.SetValue(Canvas.TopProperty,Y);
MousePosition=e.GetPosition(null);
}
}
如上定义好的三个方法实现了对象的拖放算法,实际应用中只需要将需要进行拖放移动的对象分别添加MouseLeftButtonDown、MouseLeftButtonUp和MouseMove事件处理就行了。如下示例代码:
<!--<br/ /><br/ />Code highlighting produced by Actipro CodeHighlighter (freeware)<br/ />http://www.CodeHighlighter.com/<br/ /><br/ />-->attachedElement.MouseLeftButtonDown+=(s,e)=>OnMouseLeftButtonDown(s,e);
attachedElement.MouseLeftButtonUp+=(s,e)=>OnMouseLeftButtonUp(s,e);
attachedElement.MouseMove+=(s,e)=>OnMouseMove(s,e);
按照常规做法我们会将以上相关方法的实现封装为一个基类以达到复用的目的,但本文不推荐使用基类去封装拖放行为,因为Silverlight有专门用于处理对象行为的特性-Behaviors。在Silverlight中System.Windows.Interactivity命名空间下提供了行为的基础框架,我们可以进行自由的扩展行为以实现自己的不同需求。安装Blend后可以在安装目录下找到Microsoft.Expression.Interactivity.dll这个库,这个库提供了一些比较常用的集中行为扩展,在Blend中通过“窗口”--“资产”打开资产面板,选择行为资产就可以查看到Silverlight 3中所提供的扩展行为,如下图:
我们可以将上面实现对象拖放的功能封装为行为以达到代码复用,在Blend中通过“文件”--“新建”菜单项可打开新建对象对话框。
Blend新建向导创建的行为提供了一套行为模板,如下代码块:
<!--<br/ /><br/ />Code highlighting produced by Actipro CodeHighlighter (freeware)<br/ />http://www.CodeHighlighter.com/<br/ /><br/ />-->publicclassBehavior1:Behavior<DependencyObject>
{
publicBehavior1()
{
//在此点下面插入创建对象所需的代码。
//
//下面的代码行用于在命令
//与要调用的函数之间建立关系。如果您选择
//使用MyFunction和MyCommand的已注释掉的版本,而不是创建自己的实现,
//请取消注释以下行并添加对Microsoft.Expression.Interactions的引用。
//
//文档将向您提供简单命令实现的示例,
//您可以使用该示例,而不是使用ActionCommand并引用Interactions程序集。
//
//this.MyCommand=newActionCommand(this.MyFunction);
}
protectedoverridevoidOnAttached()
{
base.OnAttached();
//插入要在将Behavior附加到对象时运行的代码。
}
protectedoverridevoidOnDetaching()
{
base.OnDetaching();
//插入要在从对象中删除Behavior时运行的代码。
}
/*
publicICommandMyCommand
{
get;
privateset;
}
privatevoidMyFunction()
{
//插入要在从对象中删除Behavior时运行的代码。
}
*/
}
要实现自定义行为通过此行为模板进行自我扩展就行了,位于System.Windows.Interactivity中的Behavior提供了将行为或命令进行封装以达到可进行附加到其他的一个对象上,需要注意的是自定义行为默认继承Behavior<DependencyObject>,使用DependencyObject类型的行为是不能访问对象的鼠标事件的,如果要访问鼠标操作的事件,可以使用具体的UI组件类型或者直接使用UI元素基类UIElement。
下面为将本篇前面实现对象拖放功能的代码进行了行为的封装,完整代码如下:
<!--<br/ /><br/ />Code highlighting produced by Actipro CodeHighlighter (freeware)<br/ />http://www.CodeHighlighter.com/<br/ /><br/ />-->///<summary>
///Behavior:封装行为和命令,便于附加到对象中。
///DependencyObject:不能实现访问鼠操作事件
///UIElement:可访问鼠标事件
///</summary>
publicclassDragBehavior:Behavior<UIElement>
{
privateUIElementattachedElement;
privateUserControlparent;
privateboolIsMouseCaptured;
privatePointMousePosition;
protectedoverridevoidOnAttached()
{
attachedElement=this.AssociatedObject;
parent=Application.Current.RootVisualasUserControl;
attachedElement.MouseLeftButtonDown+=(s,e)=>OnMouseLeftButtonDown(s,e);
attachedElement.MouseLeftButtonUp+=(s,e)=>OnMouseLeftButtonUp(s,e);
attachedElement.MouseMove+=(s,e)=>OnMouseMove(s,e);
}
privatevoidOnMouseMove(objectsender,MouseEventArgse)
{
FrameworkElementelement=senderasFrameworkElement;
if(IsMouseCaptured)
{
doubleY=e.GetPosition(null).Y-MousePosition.Y;
doubleX=e.GetPosition(null).X-MousePosition.X;
X=X+(double)element.GetValue(Canvas.LeftProperty);
Y=Y+(double)element.GetValue(Canvas.TopProperty);
element.SetValue(Canvas.LeftProperty,X);
element.SetValue(Canvas.TopProperty,Y);
MousePosition=e.GetPosition(null);
}
}
privatevoidOnMouseLeftButtonUp(objectsender,MouseButtonEventArgse)
{
FrameworkElementelement=senderasFrameworkElement;
IsMouseCaptured=false;
element.ReleaseMouseCapture();
MousePosition.X=MousePosition.Y=0;
element.Cursor=null;
}
privatevoidOnMouseLeftButtonDown(objectsender,MouseButtonEventArgse)
{
FrameworkElementelement=senderasFrameworkElement;
MousePosition=e.GetPosition(null);
IsMouseCaptured=true;
element.CaptureMouse();
element.Cursor=Cursors.Hand;
}
protectedoverridevoidOnDetaching()
{
base.OnDetaching();
}
}
通过行为特性将对象的拖放功能进行封装以达到复用的目的,以上就全部实现了这个功能,测试可通过Ctrol+Shift+B编译项目,然后通过“资产”面板就可以发现以上自定义扩展的拖放行为。
使用行为非常简单,打开Blend的资源面板中,选中需要使用的行为,将其拖放到要使用该行为的对象(Blend中设计的界面对象)上就行了。其实在Blend也提供了拖放行为:MouseDragElementBehavior,直接使用这个行为和本篇所介绍的实现达到的是同样的效果。以下为分别使用这两种行为所对应生成的XAML编码:
<!--<br/ /><br/ />Code highlighting produced by Actipro CodeHighlighter (freeware)<br/ />http://www.CodeHighlighter.com/<br/ /><br/ />--><UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
xmlns:local="clr-namespace:DragBehavior"
xmlns:il="clr-namespace:Microsoft.Expression.Interactivity.Layout;assembly=Microsoft.Expression.Interactions"
x:Class="DragBehavior.MainControl"
Width="800"Height="600">
<Canvasx:Name="LayoutRoot"Background="White">
<RectangleFill="#FFFF0000"Stroke="#FF000000"Height="100"Width="100"Canvas.Left="100"Canvas.Top="100">
<i:Interaction.Behaviors>
<il:MouseDragElementBehavior/>
</i:Interaction.Behaviors>
</Rectangle>
<EllipseFill="#FF0000FF"Stroke="#FF000000"Height="100"Width="100"Canvas.Top="219"Canvas.Left="397">
<i:Interaction.Behaviors>
<local:DragBehavior/>
</i:Interaction.Behaviors>
</Ellipse>
</Canvas>
</UserControl>
推荐资源:
Expression Blend实例中文教程(9) - 行为快速入门Behaviors
Silverlight中实现强壮的、可复用的拖放行为
Silverlight & Blend动画设计系列文章
MSDN:http://msdn.microsoft.com/zh-cn/library/cc189090(VS.95).aspx
http://www.silverlight.net/learn/quickstarts/animations/
分享到:
相关推荐
Connect to various data sources such as relational databases (Microsoft SQL Server, MySQL), non-relational databases (NoSQL such as MongoDB, Cassandra), write your own custom SQL, join and blend data ...
To create compelling user interfaces using Silverlight and Expression Blend Understand how to work with device data using isolated storage, LINQ, and XML serialization How your application can be ...
[最新出版Silverlight及Blend学习电子书教程合集] [最新出版Silverlight及Blend学习电子书教程合集]
Silverlight4 Blend SDK 中文文档
语言:English 新标签的最小日历和时钟。 新标签的最小日历和时钟。 对于自定义主题,请编辑并粘贴以下CSS样式:-...--blend:变暗; -小时阴影:0.35; -分钟阴影:0.25; -第二阴影:0.25; --blend:变暗; -覆盖:0.4;
Foundation Expression Blend 4 with Silverlight 4 takes you through your first steps in creating Rich Internet Applications (RIAs) using the latest release of Microsoft’s technology. You’ll explore ...
Optimize your workflow with Drag and Drop Import for Blender. Quickly and easily import files by dragging them from your file explorer and dropping them into Blender’s 3D Viewport or Outliner. No ...
刚接触WPF,初次使用Blend做WPF的动画效果,学习Blend制作WPF的循环动画、路径动画,上传是为了领勋章...
Silverlight及Blend的电子教学文档
silverlight_blend动画实例
Blend silverlight Blend silverlight Blend silverlight Blend silverlight
Blend 5 for Silverlight5 预览版 6月底过期不能用了,新版本又没有,就把它破解了下,把dll覆盖安装目录下的dll即可。经试验,没有啥功能限制,完全可用。
bug: fix sprite blend+fadein/fadeout bug: improve rasterizer shadows bug: fix main memory display DMA bug: fix some raster fx timing bugs enh: add a hack for improving some non-stencil shadows ...
使用Expression Blend 创建的Silverlight时钟
#pragma glslify : blend = require(../)void main() { vec4 bgColor = texture2D (bg, vUv); vec4 fgColor = texture2D (foreground, vUv); vec3 color = blend(bgColor.rgb, fgColor.rgb); gl_FragColor = vec4 ...
[Apress] Expression Blend 4 高级程序设计 (英文版) [Apress] Pro Expression Blend 4 (E-Book) ☆ 出版信息:☆ [作者信息] Andrew Troelsen [出版机构] Apress [出版日期] 2011年03月04日 [图书页数] 400页...
C#的一些介绍比较全面 [2008年最新出版Silverlight及Blend学习电子书教程合集]
AlphaBlend图片透明过渡动画特效-精品源代码
在RIA应用程序开发中,程序员和设计师角色的分工各不相同,针对这一点,微软提供了相对应的Silverlight开发工具,即Visual Studi0和Blend,这两种开发工具在书中通过一系列入门范例得到了详细的介绍,使读者可以快速...
本次项目采用Silverlight实现一个简单的个人多媒体平台,通过该平台,用户可以搜索自己喜欢的多媒体文件,在线播放(其播放质量优于Flash);还可以参与评论、上传自己的作品。 技能点描述: 1.Silverlight常用控件...