ASP.NET学习网|ASP.NET教程|ASP.NET MVC|ASP.NET 源码|VS2010教程|ASP.NET视频教程

概述

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

本文为系列文章第五篇，利用前面讲过的鼠标事件处理实现简朴的拖放功能
 

预备XAML
 

在实现拖放功能中，分为三个步骤：
 

1.按下鼠标，触发MouseLeftButtonDown事件，选择要拖动的对象。

2.移动鼠标，触发MouseMove事件，移动选择的对象。

3.放开鼠标，触发MouseLeftButtonUp事件，休止捕获事件。

做一个简朴的界面，用一个按钮来显示拖放，如下XAML声明：

<Canvas Background="#46461F">
    <Button 
       MouseLeftButtonDown="OnMouseDown" 
       MouseMove="OnMouseMove"
       MouseLeftButtonUp="OnMouseUp" 
       Canvas.Left="50" Canvas.Top="50" Background="Red"
       FontSize="18"
       Width="160" Height="80">
        <Button.Content>
            <StackPanel Orientation="Horizontal" HorizontalAlignment="Center"
                        VerticalAlignment="Center">
                <Image Source="smile_6.png"></Image>
                <TextBlock Text="拖动我" VerticalAlignment="Center" Margin="10"></TextBlock>
            </StackPanel>
        </Button.Content>
    </Button>
</Canvas>

这里为了界面显示效果，使用了控件模板，后续会专门讲到。
 

开始拖放操纵
 

开始拖放操纵，实现MouseLeftButtonDown事件处理程序，用两个全局变量来记实当前鼠标的位置和鼠标是否保持移动。

bool trackingMouseMove = false;
Point mousePosition;

void OnMouseDown(object sender, MouseButtonEventArgs e)
{
    FrameworkElement element = sender as FrameworkElement;
    mousePosition = e.GetPosition(null);
    trackingMouseMove = true;
    if (null != element)
    {
        element.CaptureMouse();
        element.Cursor = Cursors.Hand;
    }
}

移动对象
 

移动对象，实现MouseMove事件处理程序，计算元素的位置并更新，同时更新鼠标的位置。

void OnMouseMove(object sender, MouseEventArgs e)
{
    FrameworkElement element = sender as FrameworkElement;
    if (trackingMouseMove)
    {
        double deltaV = e.GetPosition(null).Y - mousePosition.Y;
        double deltaH = e.GetPosition(null).X - mousePosition.X;
        double newTop = deltaV + (double)element.GetValue(Canvas.TopProperty);
        double newLeft = deltaH + (double)element.GetValue(Canvas.LeftProperty);

        element.SetValue(Canvas.TopProperty, newTop);
        element.SetValue(Canvas.LeftProperty, newLeft);

        mousePosition = e.GetPosition(null);
    }
}

完成拖放操纵
 

完成拖放操纵，实现MouseLeftButtonUp事件处理程序。

void OnMouseUp(object sender, MouseButtonEventArgs e)
{
    FrameworkElement element = sender as FrameworkElement;
    trackingMouseMove = false;
    element.ReleaseMouseCapture();

    mousePosition.X = mousePosition.Y = 0;
    element.Cursor = null;
}

效果显示

终极，完成后的效果如下

 

拖动按钮

 

示例代码

/uploads/soft/090920/1-0Z920040K5.rar