在使用鼠标和触摸的ScrollViewer中的画布中绘制矩形

Question

我在ScrollViewer中获得了一个Canvas。

<ScrollViewer x:Name="svWorkSpace" Visibility="Collapsed" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" 
         Tapped="svWorkSpace_Tapped" 
         PointerPressed="svWorkSpace_PointerPressed" 
         PointerMoved="svWorkSpace_PointerMoved" 
         PointerReleased="svWorkSpace_PointerReleased"> 
      <Grid> 
       <Image x:Name="cvWorkImage"/> 
       <Canvas x:Name="cvWorkSpace"/> 
      </Grid> 
     </ScrollViewer> 

在PointerPressed代码，我捕获的起点和在PointerMoved代码，我绘制一个矩形作为指针移动（也删除尾随矩形一个我移动，保持仅在画布单个矩形。我用这种方法实现矩形尺寸效果）。 PointerReleased将接受最后一个矩形。

一切工作正常使用鼠标在启用触摸的设备，但不使用手指。当我移动手指时图像会滚动。

试图将代码移入画布，如下所示。无法使用鼠标和触摸绘制矩形。

<ScrollViewer x:Name="svWorkSpace" Visibility="Collapsed" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto"> 
      <Grid> 
       <Image x:Name="cvWorkImage"/> 
       <Canvas x:Name="cvWorkSpace" 
         Tapped="svWorkSpace_Tapped" 
         PointerPressed="svWorkSpace_PointerPressed" 
         PointerMoved="svWorkSpace_PointerMoved" 
         PointerReleased="svWorkSpace_PointerReleased"/> 

      </Grid> 
     </ScrollViewer> 

指向我在正确的方向请。

Answer 1

当ScrollViewer接收到基于触摸的PointerPressed时，它转向Direct Manipulation来响应地处理平移和缩放。直接操作捕获指针输入，因此Canvas的PointerMoved和PointerReleased事件不会触发。没有事件 - >没有绘图。

ScrollViewer使用鼠标平移或缩放，因此鼠标事件会将其传递给画布。

假设您总是希望Canvas处理指针事件而不是滚动（也许网格中有其他控件使用ScrollViewer），您可以将Canvas'ManipulationMone设置为all以允许触摸Canvas在ScrollViewer中

<Canvas x:Name="cvWorkSpace" 
    Background={ThemeResource WorkSpaceBackgroundBrush} 
    Tapped="svWorkSpace_Tapped" 
    ManipulationMode="All" 
    PointerPressed="svWorkSpace_PointerPressed" 
    PointerMoved="svWorkSpace_PointerMoved" 
    PointerReleased="svWorkSpace_PointerReleased"/> 

块触摸如果你只是有时想画布来处理指针的事件，那么你可以切换ManipulationMode回系统，让ScrollViewer中处理它。如果您想通过单点触摸和多点触控平移/缩放在画布上绘图，则可以在画布上处理操纵事件以平移和缩放。

还要确保Canvas不透明，并让指针事件通过它传递给它后面的任何东西。如果要在图像上绘制图像，可以将图像设置为Canvas的背景，而不是使用单独的图像控件。