windows phone 8.1开发：触控和指针事件1

原文出自:http://www.bcmeng.com/windows-phone-touch/

UIElement类的触控事件：

ManipulationStarting：当用户将手指放在 IsManipulationEnabled 属性设置为true的元素上时，将在该元素上发生 ManipulationStarting 事件。即在触控操作开始之前引发。

ManipulationStarted：在触控操作开始之后引发。

ManipulationInertiaStarting：当触控操作终止并开始惯性运动时引发该事件。

ManipulationDelta：当用户在操作过程中将手指拖过屏幕并且在惯性发生时又重复操作时，该事件会多次发生。只要触控操作中任何参数的变化都会引发该事件，比如位置，角度等。

（注意ManipulationDelta里面有俩个十分重要的属性：Delta和Cumulative。Delta属性是指当前发生ManipulationDelta事件时的所有数据，Cumulative是指从触控操作开始一来发生的所有数据的更改。ManipulationDelta事件的Complete()方法可以终止惯性运动）

ManipulationCompleted：触控操作完成时引发该事件

（注：e.OriginalSource可以获取引发触控的对象，e.Handled可以终止路由事件继续向上传递，  e.Position可以获取当前位置坐标）

关于触控事件引发的顺序：(注：ManipulationDelta 事件会被引发多次)

• ManipulationStarting
• ManipulationStarted
• ManipulationDelta
• ManipulationInertiaStarting
• ManipulationDelta
• ManipulationCompleted

我们可以通过一个Rectangle做一个测试来验证触控事件的引发顺序：(注：必须要设置ManipulationMode属性，否则不会引发触控事件)

<Rectangle Name=”rect” Width=”200″
Height=”300″ Fill=”Yellow”
ManipulationMode=”All”
ManipulationCompleted=”rect_ManipulationCompleted”
ManipulationDelta=”rect_ManipulationDelta”

ManipulationInertiaStarting=”rect_ManipulationInertiaStarting”

ManipulationStarted=”rect_ManipulationStarted”
ManipulationStarting=”rect_ManipulationStarting”
PointerCanceled=”rect_PointerCanceled”
PointerEntered=”rect_PointerEntered”
PointerExited=”rect_PointerExited”
PointerMoved=”rect_PointerMoved”
PointerPressed=”rect_PointerPressed”
PointerReleased=”rect_PointerReleased”
RightTapped=”rect_RightTapped”
Tapped=”rect_Tapped”
>
</Rectangle>

后台代码：

private void rect_ManipulationCompleted(object sender, ManipulationCompletedRoutedEventArgs e)
{
Debug.WriteLine(“{0}-ManipulationCompleted事件发生”, DateTime.Now.ToString(“H:m:s”));
}
private void rect_ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
{
Debug.WriteLine(“{0}-ManipulationDelta事件发生”, DateTime.Now.ToString(“H:m:s”));
}

private void rect_ManipulationInertiaStarting(object sender, ManipulationInertiaStartingRoutedEventArgs e)
{
Debug.WriteLine(“{0}-ManipulationInertiaStarting事件发生”, DateTime.Now.ToString(“H:m:s”));
}

private void rect_ManipulationStarted(object sender, ManipulationStartedRoutedEventArgs e)
{
Debug.WriteLine(“{0}-ManipulationStarted事件发生”, DateTime.Now.ToString(“H:m:s”));
}

private void rect_ManipulationStarting(object sender, ManipulationStartingRoutedEventArgs e)
{
Debug.WriteLine(“{0}-ManipulationStarting事件发生”, DateTime.Now.ToString(“H:m:s”));
}

private void rect_PointerCanceled(object sender, PointerRoutedEventArgs e)
{
Debug.WriteLine(“{0}-PointerCanceled事件发生”, DateTime.Now.ToString(“H:m:s”));
}

private void rect_PointerEntered(object sender, PointerRoutedEventArgs e)
{
Debug.WriteLine(“{0}-PointerEntered事件发生”, DateTime.Now.ToString(“H:m:s”));
}

private void rect_PointerExited(object sender, PointerRoutedEventArgs e)
{
Debug.WriteLine(“{0}-PointerExited事件发生”, DateTime.Now.ToString(“H:m:s”));
}

private void rect_PointerMoved(object sender, PointerRoutedEventArgs e)
{
Debug.WriteLine(“{0}-PointerMoved事件发生”, DateTime.Now.ToString(“H:m:s”));
}

private void rect_PointerPressed(object sender, PointerRoutedEventArgs e)
{
Debug.WriteLine(“{0}-PointerPressed事件发生”, DateTime.Now.ToString(“H:m:s”));
}

private void rect_PointerReleased(object sender, PointerRoutedEventArgs e)
{
Debug.WriteLine(“{0}-PointerReleased事件发生”, DateTime.Now.ToString(“H:m:s”));
}

private void rect_RightTapped(object sender, RightTappedRoutedEventArgs e)
{
Debug.WriteLine(“{0}-RightTapped事件发生”, DateTime.Now.ToString(“H:m:s”));
//rect.Fill = new SolidColorBrush(Colors.Blue);
}

private void rect_Tapped(object sender, TappedRoutedEventArgs e)
{
Debug.WriteLine(“{0}-Tapped事件发生”, DateTime.Now.ToString(“H:m:s”));
//rect.Fill = new SolidColorBrush(Colors.Red);
}

当我们滑动矩形时，会发现输出如下:

12:19:13-PointerEntered事件发生
12:19:13-PointerPressed事件发生
12:19:13-ManipulationStarting事件发生
12:19:13-PointerExited事件发生
12:19:13-ManipulationStarted事件发生
12:19:13-ManipulationDelta事件发生
12:19:13-ManipulationDelta事件发生
12:19:13-ManipulationDelta事件发生
12:19:13-ManipulationCompleted事件发生
12:19:13-PointerReleased事件发生

下面我们继续通过这个矩形来演示一个实例，通过触控拖动和旋转矩形：

首先设置一个复合变换 CompositeTransform：

CompositeTransform cpTransform = null;

再在mainpage的初始化方法中设置矩形的ManipulationMode 属性。

rect.ManipulationMode = ManipulationModes.TranslateX | ManipulationModes.TranslateY | ManipulationModes.Rotate;

然后对矩形应用变换：

cpTransform = new CompositeTransform();
cpTransform.TranslateX = cpTransform.TranslateY = 0;
cpTransform.Rotation = 0;
//cpTransform.ScaleX = cpTransform.ScaleY = 1;
cpTransform.CenterX = rect.Width / 2;
cpTransform.CenterY = rect.Height / 2;
rect.RenderTransform = cpTransform;

最后在ManipulationDelta事件中处理触控事件:

cpTransform.TranslateX += e.Delta.Translation.X;
cpTransform.TranslateY += e.Delta.Translation.Y;
cpTransform.Rotation += e.Delta.Rotation;

运行效果如下：

下面我们再来演示一个利用触控缩放照片的实例：

<Image Width=”200″ Height=”200″ Name=”image”
Source=”1.jpg” Stretch=”Fill”
ManipulationDelta=”image_ManipulationDelta”
ManipulationMode=”Scale”/>

后台代码：

ScaleTransform scaleTransform;
public Image()
{
this.InitializeComponent();
scaleTransform = new ScaleTransform();
scaleTransform.CenterX = image.Width / 2;
scaleTransform.CenterY = image.Height / 2;
scaleTransform.ScaleX = scaleTransform.ScaleY = 1;
image.RenderTransform = scaleTransform;
}
private void image_ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
{
scaleTransform.ScaleX*= e.Delta.Scale;
scaleTransform.ScaleY*= e.Delta.Scale;
}

运行效果如下：

指针事件我们放到下一篇吧。