Silverlight實現的簡單拖拽效果

MainPage.xaml檔案代碼：

 

<UserControl
 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 x:Class="SilverlightApplication2.MainPage"
 Width="640" Height="480">

 <Canvas x:Name="LayoutRoot" Background="White">
  <StackPanel MouseLeftButtonDown="OnMouseDown" MouseMove="OnMouseMove" MouseLeftButtonUp="OnMouseLeftButtonUp" Width="200" Height="80" Canvas.Left="20" Canvas.Top="20">
   <Border BorderBrush="Red" BorderThickness="3">
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center">
     <Image Source="qq.gif"/>
     <TextBlock Text="拖動"  Margin="20" VerticalAlignment="Center"/>
    </StackPanel>
   </Border>
  </StackPanel>
  <TextBlock x:Name="status" Canvas.Top="200" Text="" Canvas.Left="60"></TextBlock>
 </Canvas>
</UserControl>

---------------------------------------------------------------------------------------------------------------------------------

MainPage.xaml.cs檔案如下：

 

using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Ink;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;

namespace SilverlightApplication2
{
 public partial class MainPage : UserControl
 {
  public MainPage()
  {
   // 為初始設定變數所必需
   InitializeComponent();
  }

  //定義兩個全域變數，一個用來擷取滑鼠的當前位置，另一個用來記錄滑鼠是否移動
  bool trackingMouseMove = false;
  Point mousePosition;
  private void OnMouseDown(object sender, System.Windows.Input.MouseButtonEventArgs e)
  {
   // TODO: Add event handler implementation here.
   FrameworkElement element = sender as FrameworkElement;
   mousePosition = e.GetPosition(null);
   trackingMouseMove = true;
   if(null!=null)
   {
    element.CaptureMouse();
    element.Cursor = Cursors.Hand;
   }
   status.Text = "按下滑鼠";
  }

  private void OnMouseLeftButtonUp(object sender, System.Windows.Input.MouseButtonEventArgs e)
  {
   // TODO: Add event handler implementation here.
   FrameworkElement element = sender as FrameworkElement;
   trackingMouseMove = false;
   element.ReleaseMouseCapture();
   mousePosition.X = mousePosition.Y = 0;
   element.Cursor = null;
   status.Text = "滑鼠釋放";
  }

  private void OnMouseMove(object sender, System.Windows.Input.MouseEventArgs e)
  {
   // TODO: Add event handler implementation here.
   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);
   }
   status.Text = "滑鼠移動中";
  }
 }
}