上篇写了有关可复用拖拽的基本控件，它的应用范畴非常广泛，与之配套的就是诸如包裹、工具栏、技能条等等可以进入的目标，然而Silverlight提供的拖拽只是对于一些特定的容器有效，而且要符合麻烦的规则，可延展性在游戏应用中非常有限，比如拖拽技能图标的时候，是跟着鼠标一起走，而今天我将使用一个有趣的方式完成简单的技能条系统。

本篇代码是上篇的延展，并且涉及有关知识：Silverlight 游戏开发：可重用的拖拽控件

翻阅过很多资料，Silverlight中这类可以放入拖拽物体的做法，都是使用DragEnter和DragLeave这类的事件处理，深蓝色右手的包裹系统也是基于此类做法完成，而我在开发《窝窝世界》的时候，考虑不增加程序的大小，而没有附加ToolKit（Toolkit里有WarpPanel这类做包裹较好的控件），那么就意味着必须通过其他的方式来实现拖拽Object进入目标，我使用的方法虽然暴力但是却行之有效，使用的是VisualTreeHelper.FindElementsInHostCoordinates，在一个点或区域查找符合条件的控件集合，就是通过它可以取得技能条之类的容器，因为Mouse的Down、Move、Up事件都可以取得鼠标的坐标点，所以取得这个点上是否有容器完全可行。

现在简单的建立一个MyPack的控件：

上面是用Blend画的一个前台，下面是XAML的代码：

1. <UserControl 
2.     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
3.     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
4.     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
5.     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
6.     mc:Ignorable="d" 
7.     x:Class="DragObject.MyPack" 
8.     d:DesignWidth="640" d:DesignHeight="480" Height="64"> 
9.  
10.     <StackPanel x:Name="LayoutRoot" Orientation="Horizontal"> 
11.         <StackPanel.Background> 
12.             <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
13.                 <GradientStop Color="#FF00B667" Offset="0"/> 
14.                 <GradientStop Color="#FF00FF61" Offset="1"/> 
15.             </LinearGradientBrush> 
16.         </StackPanel.Background> 
17.         <TextBlock x:Name="textBlockType" TextWrapping="Wrap" Margin="5,0,0,0" Width="74" FontSize="12" HorizontalAlignment="Center" VerticalAlignment="Center" TextAlignment="Center"><Run Text="只放图标"/></TextBlock> 
18.         <Rectangle Fill="#FFF4F4F5" Stroke="Black" Width="3"/> 
19.     </StackPanel> 
20. </UserControl> 

1. public partial class MyPack : UserControl  
2. {  
3.     public MyPack()  
4.     {  
5.         InitializeComponent();  
6.     }  
7.     public void AddObj(UIElement uielement)  
8.     {  
9.         LayoutRoot.Children.Add(uielement);  
10.     }  
11.     public void ClearIcon()  
12.     {  
13.         for (int i = LayoutRoot.Children.Count - 1; i > 1; i--)  
14.         {  
15.             LayoutRoot.Children.RemoveAt(i);  
16.         }  
17.     }  
18. } 

实现的功能比较明了，一个是添加，一个是清理，而清理则是倒序，为了把第1个和第2个留下，如果你有其他的逻辑，可以自行添加，比如数量之类的。

下面就是写拖拽的逻辑，本篇这个程序中，只有MyIcon的控件可以拖入技能条里，而其他的Face、Card都不行，因此，将代码写在MyIcon中，重建对应的功能操作：

1. bool isLocked = false;  
2. protected override void OnMouseLeftButtonUp(MouseButtonEventArgs e)  
3. {  
4.     base.OnMouseLeftButtonUp(e);              
5.               
6.     var findlist = VisualTreeHelper.FindElementsInHostCoordinates(e.GetPosition(null), this.Parent as FrameworkElement);  
7.     foreach (var item in findlist)  
8.     {  
9.         if (item is MyPack)  
10.         {  
11.             (this.Parent as Panel).Children.Remove(this);  
12.             (item as MyPack).AddObj(this);  
13.             isLocked = true;  
14.             break;  
15.         }  
16.     }              
17. }  
18. protected override void OnMouseLeftButtonDown(MouseButtonEventArgs e)  
19. {  
20.     if (isLocked)  
21.         return;  
22.     base.OnMouseLeftButtonDown(e);  
23. } 

后面可以依照自己的需要进行改造，比如做类型判断和其他的功能开发，比如说下面呢，为了增加趣味，我扩展了MyIcon的类，通过一个继承类增加了图标切换动画，这个类名叫MyIcon2

1. public class MyIcon2 :MyIcon  
2. {  
3.     public MyIcon2()  
4.     {  
5.         DispatcherTimer selfLoop = new DispatcherTimer();  
6.         selfLoop.Interval = TimeSpan.FromMilliseconds(300);  
7.         selfLoop.Tick += new EventHandler(selfLoop_Tick);  
8.         selfLoop.Start();  
9.     }  
10.  
11.     int iframe = 1;  
12.     void selfLoop_Tick(object sender, EventArgs e)  
13.     {  
14.         base.IconIndex = iframe;  
15.         iframe += 1;  
16.         if (iframe > 10)  
17.             iframe = 1;  
18.     }  
19. } 

很简单，在构造函数中创建了一个计时器DispatcherTimer ，起名为selfLoop(自身循环)，在循环Tick事件中加入了索引变更，这样就会出现一个切换动画。

好了，在MainPage里写一些逻辑，或者直接在Blend里面绘制，在这里我就不再做代码讲述，可以直接看最终的效果以及下载代码研究，在左上角加入一个重来的按钮，功能为清理条中的ICON，并随机生成5个在界面上：

本篇工程源代码下载地址如下：点击直接下载

本文转自nowpaper 51CTO博客，原文链接:http://blog.51cto.com/nowpaper/712741