uwpで同時に2つのストロークを描く方法は？

Question

私はPointerMoveEventにCanvasから2行を描こうとしますが、結果はInkCanvasを使用するほど良くありません。

このに到達することができ、使用InkCanvasですか？

private void Canvas_PointerPressed(object sender, PointerRoutedEventArgs e) 
    { 
     // Get information about the pointer location. 
     PointerPoint pt = e.GetCurrentPoint(inkCanvas); 
     m_PreviousContactPoint = pt.Position; 
     m_Point2 = new Point(0, 0); 
     m_Point1 = pt.Position; 
     // Accept input only from a pen or mouse with the left button pressed. 
     PointerDeviceType pointerDevType = e.Pointer.PointerDeviceType; 
     if (pointerDevType == PointerDeviceType.Pen || 
      pointerDevType == PointerDeviceType.Mouse && pt.Properties.IsLeftButtonPressed) 
     { 
      e.Handled = true; 
      IsPressed = true; 
     } 
     else if (pointerDevType == PointerDeviceType.Touch) 
     { 
      // Process touch input 
     } 
    } 

    private void Canvas_PointerMoved(object sender, PointerRoutedEventArgs e) 
    { 

     if (IsPressed) 
     { 
      PointerPoint pt = e.GetCurrentPoint(inkCanvas); 

      var currentContactPt = pt.Position; 
      var x1 = m_PreviousContactPoint.X; 
      var y1 = m_PreviousContactPoint.Y; 
      var x2 = currentContactPt.X; 
      var y2 = currentContactPt.Y; 

      var color = Windows.UI.Colors.Black; 
      //var size = 4; 

      if (CalculateDistance(x1, y1, x2, y2) > 2.0) 
      { 
       if (m_Point2.X == 0 && m_Point2.Y == 0) 
       { 
        m_Point2 = currentContactPt; 
        return; 
       } 

       drawBezier(m_Point1, m_Point2, currentContactPt); 
       drawBezier(new Point(m_Point1.X + 100, m_Point1.Y), new Point(m_Point2.X + 100, m_Point2.Y), new Point(currentContactPt.X + 100, currentContactPt.Y)); 

       m_PreviousContactPoint = currentContactPt; 
       m_Point1 = currentContactPt; 
       m_Point2 = new Point(0, 0); 

     } 
    } 

    } 

    private void drawBezier(Point point1, Point point2, Point point3) 
    { 
     var pathGeometry = new PathGeometry(); 
     BezierSegment bezier = new BezierSegment() 
     { 
      Point1 = point1, 
      Point2 = point2, 
      Point3 = point3 
     }; 

     PathFigure figure = new PathFigure(); 
     figure.StartPoint = point1; 
     figure.Segments.Add(bezier); 
     [![enter image description here][1]][1] 
     Windows.UI.Xaml.Shapes.Path path = new Windows.UI.Xaml.Shapes.Path(); 
     path.Stroke = new SolidColorBrush(Colors.Black); 
     pathGeometry.Figures.Add(figure); 
     path.Data = pathGeometry; 
     path.StrokeEndLineCap = PenLineCap.Round; 
     path.StrokeStartLineCap = PenLineCap.Round; 
     path.StrokeThickness = 4; 

     inkCanvas.Children.Add(path); 
    } 
    private double CalculateDistance(double x1, double y1, double x2, double y2) 
    { 
     double d = 0; 
     d = Math.Sqrt(Math.Pow((x2 - x1), 2) + Math.Pow((y2 - y1), 2)); 
     return d; 
    } 

    private void Canvas_PointerReleased(object sender, PointerRoutedEventArgs e) 
    { 
     IsPressed = false; 
    } 

Answer 1

ご迷惑をおかけして申し訳ありません。ここにあなたを助けることができるいくつかのサンプルコードがあります！

XAML：

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
    <InkCanvas x:Name="testCanvas"/> 
</Grid> 

コード

public MainPage() 
    { 
     this.InitializeComponent(); 
     testCanvas.InkPresenter.InputDeviceTypes = Windows.UI.Core.CoreInputDeviceTypes.Mouse | 
      Windows.UI.Core.CoreInputDeviceTypes.Pen | Windows.UI.Core.CoreInputDeviceTypes.Touch; 
     testCanvas.InkPresenter.StrokesCollected += InkPresenter_StrokesCollected; 
    } 
    private bool _strokeManipulating; 
    private void InkPresenter_StrokesCollected(InkPresenter sender, InkStrokesCollectedEventArgs args) 
    { 
     var strokes = args.Strokes; 
     if (!_strokeManipulating) 
     { 
      _strokeManipulating = true; 
      foreach (var s in strokes) 
      { 
       var n = s.Clone(); 
       //pass the required x,y translation 
       var t = System.Numerics.Matrix3x2.CreateTranslation(5, 0); 
       n.PointTransform = t; 
       testCanvas.InkPresenter.StrokeContainer.AddStroke(n); 
      } 
      _strokeManipulating = false; 
     } 
    } 

出力の後ろ：