如何在uwp中獲得觸摸輸入？

Question

我需要，如果用戶用一根手指觸摸畫布控制，繪圖過程必須開始，如果用戶用兩根手指觸摸畫布控件，畫布區域必須滾動/平移。我怎樣才能做到這一點？

感謝

Answer 1

我們可以使用指針事件檢測多個手指輸入UWP。例如：

<ScrollViewer x:Name="scrollViewer" VerticalScrollBarVisibility="Hidden" HorizontalScrollBarVisibility="Hidden" 
       VerticalScrollMode="Disabled" HorizontalScrollMode="Disabled"> 
    <canvas:CanvasControl x:Name="canvasControl" Draw="CanvasControl_Draw" CreateResources="canvasControl_CreateResources" ClearColor="CornflowerBlue" 
          PointerPressed="canvasControl_PointerPressed" PointerReleased="canvasControl_PointerReleased" PointerExited="canvasControl_PointerReleased" 
          PointerCanceled="canvasControl_PointerPressed" 
          PointerMoved="canvasControl_PointerMoved" Width="1200"> 
    </canvas:CanvasControl> 
</ScrollViewer> 

正如你所看到的，我把ScrollViewer出canvas:CanvasControl的，所以會在畫布上能夠滾動。代碼背後：

private CanvasRenderTarget renderTarget; 

private async void CanvasControl_Draw(Microsoft.Graphics.Canvas.UI.Xaml.CanvasControl sender, Microsoft.Graphics.Canvas.UI.Xaml.CanvasDrawEventArgs args) 
{ 
    args.DrawingSession.DrawImage(renderTarget); 
} 

private void canvasControl_CreateResources(CanvasControl sender, Microsoft.Graphics.Canvas.UI.CanvasCreateResourcesEventArgs args) 
{ 
    renderTarget = new CanvasRenderTarget(sender, (float)sender.ActualWidth, (float)sender.ActualHeight); 
} 

private List<PointerPoint> m_pt = new List<PointerPoint>(); 

private void canvasControl_PointerPressed(object sender, PointerRoutedEventArgs e) 
{ 
    PointerPoint cp = e.GetCurrentPoint(canvasControl); 
    m_pt.Add(cp); 
    if (m_pt.Count == 2) 
    { 
     scrollViewer.HorizontalScrollMode = ScrollMode.Enabled; 
     scrollViewer.VerticalScrollMode = ScrollMode.Enabled; 
    } 
} 

private void canvasControl_PointerReleased(object sender, PointerRoutedEventArgs e) 
{ 
    if (m_pt.Count == 1) 
     canvasControl.Invalidate(); 
    scrollViewer.HorizontalScrollMode = ScrollMode.Disabled; 
    scrollViewer.VerticalScrollMode = ScrollMode.Disabled; 
    m_pt.Clear(); 
} 

private void canvasControl_PointerMoved(object sender, PointerRoutedEventArgs e) 
{ 
    if (m_pt.Count == 1) 
    { 
     var pt = e.GetCurrentPoint(canvasControl); 
     using (var ds = renderTarget.CreateDrawingSession()) 
     { 
      ds.DrawCircle(new Vector2((float)pt.Position.X, (float)pt.Position.Y), 2, Colors.Black); 
     } 
    } 
    else 
    { 
     if (m_pt.Count > 2) 
      m_pt.Clear(); 
    } 
} 

當用一根手指畫，在我的演示中，只有當指針被釋放時，畫布纔會更新其佈局。您可以更改代碼，以在每次移動指針時更新畫布。但我認爲對於這一點，您需要用另一個Win2D控件替換canvas:CanvasControl，欲瞭解更多信息，可以參考CanvasControl.Invalidate Method。