我试图在翻译,旋转和缩放(缩放到缩放)时限制在触摸操作中放置在画布内的图像移动。 我试图实现manipcontainer属性,但它没有给我想要的结果。 任何帮助表示赞赏!!!
XAMl代码 -
<Canvas x:Name="mainCanvas" Grid.Column="1">
<Canvas.Background>
<ImageBrush x:Name="imgBg" ImageSource="/Images/Backgrounds/bg0.jpg"/>
</Canvas.Background>
<Image x:Name="imgTest" Source="/Images/Sample.jpg" ManipulationStarted="image_OnManipulationStarted" ManipulationDelta="image_OnManipulationDelta" Height="150" Width="190" Canvas.Top="80" Margin="12,0,0,0" Stretch="Fill">
<Image.RenderTransform>
<CompositeTransform />
</Image.RenderTransform>
</Image>
<Image x:Name="imgTest2" Source="/Images/Sample2.jpg" ManipulationStarted="image_OnManipulationStarted" ManipulationDelta="image_OnManipulationDelta" Height="150" Width="190" Canvas.Top="80" Canvas.Left="200" Margin="12,0,0,0" Stretch="Fill">
<Image.RenderTransform>
<CompositeTransform />
</Image.RenderTransform>
</Image>
<Image x:Name="imgTest3" Source="/Images/Sample3.jpg" ManipulationStarted="image_OnManipulationStarted" ManipulationDelta="image_OnManipulationDelta" Height="150" Width="190" Canvas.Top="240" Margin="12,0,0,0" Stretch="Fill">
<Image.RenderTransform>
<CompositeTransform />
</Image.RenderTransform>
</Image>
<Image x:Name="imgTest4" Source="/Images/Sample4.jpg" ManipulationStarted="image_OnManipulationStarted" ManipulationDelta="image_OnManipulationDelta" Height="150" Width="190" Canvas.Top="240" Canvas.Left="200" Margin="12,0,0,0" Stretch="Fill">
<Image.RenderTransform>
<CompositeTransform />
</Image.RenderTransform>
</Image>
</Canvas>
C#代码 -
double _scaleX, _scaleY, _translationX, _translationY;
private void image_OnManipulationStarted(object sender, ManipulationStartedEventArgs e)
{
// the user has started manipulating the screen, set starting points
var transform = (CompositeTransform)((System.Windows.FrameworkElement)(sender)).RenderTransform;
_scaleX = transform.ScaleX;
_scaleY = transform.ScaleY;
_translationX = transform.TranslateX;
_translationY = transform.TranslateY;
e.ManipulationContainer = mainCanvas;
e.Handled = true;
}
private void image_OnManipulationDelta(object sender, ManipulationDeltaEventArgs e)
{
var transform = (CompositeTransform)((FrameworkElement)(sender)).RenderTransform;
Image imgSender = sender as Image;
// pan
transform.TranslateX = _translationX + e.CumulativeManipulation.Translation.X;
transform.TranslateY = _translationY + e.CumulativeManipulation.Translation.Y;
if (e.PinchManipulation != null)
{
// zoom
transform.CenterX = e.PinchManipulation.Original.Center.X;
transform.CenterY = e.PinchManipulation.Original.Center.Y;
transform.ScaleX = _scaleX * e.PinchManipulation.CumulativeScale;
transform.ScaleY = _scaleY * e.PinchManipulation.CumulativeScale;
//rotate
transform.Rotation = angleBetween2Lines(e.PinchManipulation.Current, e.PinchManipulation.Original);
}
Point p = new Point(0, 0);
Rect containingRect = new Rect(p,((FrameworkElement)e.ManipulationContainer).RenderSize);
Rect shapeBounds = imgSender.RenderTransform.TransformBounds(new Rect(p,imgSender.RenderSize));
Point bound = new Point(shapeBounds.Top, shapeBounds.Bottom);
if (e.IsInertial && !containingRect.Contains(bound))
{
e.Complete();
}
e.Handled = true;
}
答案 0 :(得分:0)
将父画布保留为ScrollViewer的子画面对我有用。