本节举一个例子,该示例与本书第六章的示例程序大致相同,示例程序运行效果如图所示。
示例中的两个图形分别包含在两个子画布中,这两个子画布共享相同的事件处理器,分别是MouseLeftButtonDown、MouseMove和MouseLeftButtonUp事件,XAML代码如下所示。
<Canvas x:Name="parentCanvas"
xmlns="http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Loaded="Page_Loaded"
x:Class="DragandDropDemo.Page;assembly=ClientBin/DragandDropDemo.dll"
Width="640"
Height="480"
Background="White"
>
<!-- 定义两个圆形对象,形成一个圆环效果-->
<Canvas
MouseLeftButtonDown="onMouseDown"
MouseLeftButtonUp="onMouseUp"
MouseMove="onMouseMove"
Canvas.Top="20" Canvas.Left="50">
<Ellipse
Height="100" Width="100"
Fill="Gold"
Stroke="Black" StrokeThickness="4" />
<Ellipse
Height="50" Width="50"
Canvas.Top="25" Canvas.Left="25"
Fill="Black" />
</Canvas>
<!-- 定义一个钻石形状 -->
<Canvas
MouseLeftButtonDown="onMouseDown"
MouseLeftButtonUp="onMouseUp"
MouseMove="onMouseMove"
Canvas.Top="140" Canvas.Left="100">
<!--使用旋转渐变让该画布旋转45度-->
<Canvas.RenderTransform>
<RotateTransform Angle="45" />
</Canvas.RenderTransform>
<Rectangle
Height="100" Width="100"
Fill="Coral"
Stroke="Black" StrokeThickness="4" />
</Canvas>
</Canvas>
上面的代码很简单的画了两个图形,分别位于两个画布中,拖动的实际代码如下所示。
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 DragandDropDemo
{
public partial class Page : Canvas
{
//beginX和beginY用于保存鼠标上一次的位置
private double beginX;
private double beginY;
//isMouseDown获取和设置鼠标是否按下的布尔变量
private bool isMouseDown = false;
public void Page_Loaded(object o, EventArgs e)
{
// Required to initialize variables
InitializeComponent();
}
//鼠标左键按下时的事件代码
public void onMouseDown(object sender, MouseEventArgs e)
{
//将当前的鼠标位置传给私有变量
beginX = e.GetPosition(null).X;
beginY = e.GetPosition(null).Y;
//将isMouseDown设为true表示鼠标按下。
isMouseDown = true;
//由于CaptureMouse都定义在UIElement中,所以这里、转换为UIElement类
((UIElement)sender).CaptureMouse();
}
//鼠标移动
public void onMouseMove(object sender, MouseEventArgs e)
{
//如果鼠标处理按下状态
if (isMouseDown == true)
{
//获取鼠标当前位置
double currX = e.GetPosition(null).X;
double currY = e.GetPosition(null).Y;
//获取当前图形的位置
double currLeft = (double)((UIElement)sender).GetValue(Canvas.LeftProperty);
double currTop = (double)((UIElement)sender).GetValue(Canvas.TopProperty);
//移动当前图形的位置
((UIElement)sender).SetValue(Canvas.LeftProperty, currLeft + currX - beginX);
((UIElement)sender).SetValue(Canvas.TopProperty, currTop + currY - beginY);
//将当前位置保存起来,继续拖动。
beginX = currX;
beginY = currY;
}
}
//释放鼠标左键
public void onMouseUp(object sender, MouseEventArgs e)
{
isMouseDown = false;
//停止鼠标捕捉
((UIElement)sender).ReleaseMouseCapture();
}
}
}
可以看到最主要的代码位于MouseMove中,通过不断的改变图形对象的位置,以形成拖动的效果。