#741 – 使用触摸事件移动控件(Using Touch Manipulation Events to Translate an Element)

<Canvas Name="canvMain" Background="Transparent">
<Image Source="JamesII.jpg" Width="100"
IsManipulationEnabled="True"
RenderTransform="{Binding ImageTransform}"
ManipulationStarting="Image_ManipulationStarting" ManipulationDelta="Image_ManipulationDelta"/>
</Canvas>

RenderTransform

public partial class MainWindow : Window, INotifyPropertyChanged
{
public MainWindow()
{
InitializeComponent();
this.DataContext = this;

ImageTransform = new MatrixTransform(); // XAML中绑定的MatrixTransform 实例
}

private MatrixTransform imageTransform;
public MatrixTransform ImageTransform
{
get { return imageTransform; }
set
{
if (value != imageTransform)
{
imageTransform = value;
RaisePropertyChanged("ImageTransform");
}
}
}

private void Image_ManipulationStarting(object sender, ManipulationStartingEventArgs e)
{
// Ask for manipulations to be reported relative to the canvas
e.ManipulationContainer = canvMain;
}

private void Image_ManipulationDelta(object sender, ManipulationDeltaEventArgs e)
{
ManipulationDelta md = e.DeltaManipulation;  // 获取当前操作的最新更改
Vector trans = md.Translation;  //获取操作在屏幕上水平和垂直移动信息

// Update matrix to reflect translation
Matrix m = imageTransform.Matrix;
m.Translate(trans.X, trans.Y);  // 设置图像在屏幕上的水平和垂直移动距离
imageTransform.Matrix = m;
RaisePropertyChanged("ImageTransform");

e.Handled = true;
}

public event PropertyChangedEventHandler PropertyChanged;

private void RaisePropertyChanged(string prop)
{
if (PropertyChanged != null)
PropertyChanged(this, new PropertyChangedEventArgs(prop));
}
}