零元学Expression Blend 4 – Chapter 21 以实作案例学习MouseDragElementBehavior

原文:零元学Expression Blend 4 – Chapter 21 以实作案例学习MouseDragElementBehavior

本章将教大家如何运用Blend 4内建的行为注入元件「MouseDragElementBehavior」--使物件拥有拖拉功能

?

本章将教大家如何运用Blend 4内建的行为注入元件「MouseDragElementBehavior」--使物件有拖拉功能

?

这麽说好了，当A物件被MouseDragElementBehavior寄生以後，A物件就会拥有MouseDragElementBehavior的特性与功能

也可以说是MouseDragElementBehavior给了A物件新的生命

?

以前要作到像范例这样的拖拉效果没有写程式是做不到的

以设计为主的我来说，在还没使用Blend之前要我做到这样的效果，也是不可能的事情...

?

开始我们的拖拉功能吧~

?

01

新增一个专案後，放入物件、图片或照片

或是你想使用小猴子的专案来玩玩看，请下载附件：

?

02

在Asset搜寻MouseDragElementBehavior，把这个Behavior拉到你想使他可以拖拉的物件上

?

话说...其实这样就完成了^_^"

不过小猴子想要多补充一些...

?

另一种做法:

左边的圆只能存在於容器内，而右边的圆可以在Silverlight内随意的拖拉

?

03 试试看怎麽做~

在主要工作区内放入两个Canvas(或其他容器)，并且在Canvsa里置入两个Ellipse

并且跟刚刚一样，把MouseDragElementBehavior拉到Ellipse里

?

若想要限制红色圈圈只能在容器内移动，请在点选红圈的MouseDragElementBehavior状态下

在Properties->Common Properties找到Constrain To Parent Bounds，并勾选它

?

按F5试试看，没意外的话应该会跟范例一样喔!

?

04

另外，我发现msdn也有很明确的介绍了MouseDragElementBehavior，所以我直接引用msdn上的一些解释：

1.选取 ConstrainToParentBounds 属性可将元素限制成无法拖曳到超出父版面配置容器所指定的边界之外。

2.MouseDragElementBehavior行为不适用於用来处理 MouseClick事件的任何控制项 (例如， Button、 TextBox和 ListBox控制项)。

? 如果希望能够拖曳前述任一种控制项，请将该控制项变成可供拖曳之控制项 (例如框线) 的子项。

? 接着可以将 MouseDragElementBehavior行为套用至父项元素。

?

?

附上第二个范例的专案：

?

本篇的教学就到此。

?

?

(若有任何错误的地方，请各位前辈或同好能不吝指教，小女子都会虚心接受；若是你喜欢我的教学，请给我点鼓励，谢谢。)

一步一步迈向HIE之路

喜欢我文章请推我一下或给我个回应，你的鼓励会给我无限的动力喔!

若是您有其他问题或是特别需要，请在文章回应处留言，我会尽快回覆您