SkiaSharp ArcToメソッドで曲線が描画されない

Question

次のコードを使用してSkiaSharpキャンバスビューで円弧を描こうとしています。

path3.ArcTo(new SKPoint(0, h/2), 1.57f, SKPathArcSize.Large, 
      SKPathDirection.Clockwise, new SKPoint(w/2, h)); 

しかし、カーブではなく、直線を描いています。どのように曲線にするには？

完全なコード

private void OnPainting(object sender, SKPaintSurfaceEventArgs e) 
{ 

    var surface = e.Surface; 
    var canvas = surface.Canvas; 
    canvas.Clear(SKColors.White); 

     var w = e.Info.Width; 
     var h = e.Info.Height; 

     var pathStroke3 = new SKPaint 
     { 
      IsAntialias = true, 
      Style = SKPaintStyle.StrokeAndFill, 
      Color = new SKColor(240, 0, 100, 250), 
      StrokeWidth = 5 
     }; 

     var path3 = new SKPath { FillType = SKPathFillType.EvenOdd }; 
     path3.MoveTo(0, h/2); 
     path3.ArcTo(new SKPoint(0, h/2), 1.57f, SKPathArcSize.Large, SKPathDirection.Clockwise, new SKPoint(w/2, h)); 
     path3.LineTo(0, h); 
     path3.Close(); 
     canvas.DrawPath(path3, pathStroke3); 


} 

XAML

<Grid x:Name="controlGrid" ColumnSpacing="0" RowSpacing="0" Padding="0" BackgroundColor="White" > 
    <Grid.RowDefinitions> 
     <RowDefinition Height="4*" /> 
     <RowDefinition Height="6*" /> 
    </Grid.RowDefinitions> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*" /> 
    </Grid.ColumnDefinitions> 
    <views:SKCanvasView PaintSurface="OnPainting" EnableTouchEvents="True" 
    Touch="OnTouch" HeightRequest="300" Grid.Row="0"/> 
</Grid> 

Answer 1

あなたx半径はゼロであり、従ってArcTo現在の点から出口点へのパスに行を追加。

arcTo半径がゼロの場合、または最後のPath Pointが（x、y）に等しい場合、xyにLineを追加します。 arcToは半径rを最後のPath Pointに合わせるようにスケーリングし、両方が0より大きいが小さすぎる場合はxyに合わせる。あなたが好きな何かを行うことができます

：

path3.ArcTo(new SKPoint(100, 100), 0, SKPathArcSize.Large, SKPathDirection.Clockwise, new SKPoint(w/2, h)); 

しかし、私はあなたの描画意図が何であるかを知りません。凹面、凸面、有界、無制限、など...しかし、私はあなたの意図があるかもしれないと思うものに近いかもしれないConicToを使用して他のいくつかの例：

path3.ConicTo(w/3, h/2, w/2, h, 0.50f); 

path3.ConicTo(0, h - (h/5), w/2, h, 0.50f); 

ArcToが円弧、円錐、移動に分解する方法を理解するには、公式ドキュメントを見てみるとよいでしょう。

• https://skia.org/user/api/bmh_SkPath?cl=9919#arcTo

Answer 2

私は@SushiHangover

からの応答ごとに、次のためにConicToを使用しています参考文献：

1. Three Types of Bézier Curves - developer.xamarin
2. Three Ways to Draw an Arc - developer.xamarin
3. Experimental SkPath - skia.org

コード

private void OnPainting(object sender, SKPaintSurfaceEventArgs e) 
{ 

    var surface = e.Surface; 
    var canvas = surface.Canvas; 
    canvas.Clear(SKColors.White); 

     var w = e.Info.Width; 
     var h = e.Info.Height; 
     var h12 = h - (h/8); 
     var h8 = h - (h/6); 
     var h4 = h - (h/3); 


     var pathStroke3 = new SKPaint 
     { 
      IsAntialias = true, 
      Style = SKPaintStyle.StrokeAndFill, 
      Color = new SKColor(240, 0, 100, 250), 
      StrokeWidth = 5 
     }; 

     var path3 = new SKPath { FillType = SKPathFillType.EvenOdd }; 
     path3.MoveTo(0, h4); 
     path3.ConicTo(0, h8, w/2, h12, 0.50f); 
     path3.LineTo(w/2, h); 
     path3.LineTo(0, h); 
     path3.Close(); 
     canvas.DrawPath(path3, pathStroke3); 

     var pathStroke6 = new SKPaint 
     { 
      IsAntialias = true, 
      Style = SKPaintStyle.StrokeAndFill, 
      Color = new SKColor(100,0, 240, 250), 
      StrokeWidth = 5 
     }; 
     var path6 = new SKPath { FillType = SKPathFillType.EvenOdd }; 
     path6.MoveTo(w, h4); 
     path6.ConicTo(w, h8, w/2, h12, 0.50f); 
     path6.LineTo(w/2, h); 
     path6.LineTo(w, h); 
     path6.Close(); 
     canvas.DrawPath(path6, pathStroke6); 


     var pathStroke4 = new SKPaint 
     { 
      IsAntialias = true, 
      Style = SKPaintStyle.Stroke, 
      Color = new SKColor(0, 0, 255), 
      StrokeWidth = 5 
     }; 

     var path4 = new SKPath { FillType = SKPathFillType.EvenOdd }; 
     path4.MoveTo(0, h4); 
     path4.LineTo(w/2, h4); 
     canvas.DrawPath(path4, pathStroke4); 


     var pathStroke5 = new SKPaint 
     { 
      IsAntialias = true, 
      Style = SKPaintStyle.Stroke, 
      Color = new SKColor(0, 255, 0), 
      StrokeWidth = 5 
     }; 
     var path5 = new SKPath { FillType = SKPathFillType.EvenOdd }; 
     path5.MoveTo(0, h8); 
     path5.LineTo(w/2, h8); 
     canvas.DrawPath(path5, pathStroke5); 

     var path7 = new SKPath { FillType = SKPathFillType.EvenOdd }; 
     path5.MoveTo(w/4, h8); 
     path5.LineTo(w /4, h); 
     canvas.DrawPath(path5, pathStroke5); 

    }