如何使用SkiaSharp在Xamarin中创建简单的动画

时间:2019-12-30 16:05:19

标签: c# xamarin skiasharp

如何创建简单的动画来调用DrawCircle或DrawLine函数。

public void DrawCircle (SkiaSharp.SKPoint c, float radius, SkiaSharp.SKPaint paint);

我想延迟画圆。我已经阅读了有关C#xamarian动画的所有可能文档,但无法为此找到简单的解决方案。

https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/animation/simple https://docs.microsoft.com/en-us/xamarin/android/app-fundamentals/graphics-and-animation https://docs.microsoft.com/en-us/dotnet/api/xamarin.forms.animation?view=xamarin-forms

以上内容均未涉及此问题。

有人可以给我一个提示,从哪里开始延迟绘制两个对象吗?

public class SimpleCirclePage : ContentPage
{
    public SimpleCirclePage()
    {
        SKCanvasView canvasView = new SKCanvasView();
        canvasView.PaintSurface += OnCanvasViewPaintSurface;
        Content = canvasView;
    }

    void OnCanvasViewPaintSurface(object sender, SKPaintSurfaceEventArgs args)
    {
        SKImageInfo info = args.Info;
        SKSurface surface = args.Surface;
        SKCanvas canvas = surface.Canvas;

        canvas.Clear();

        SKPaint paint = new SKPaint
        {
            Style = SKPaintStyle.Stroke,
            Color = Color.Red.ToSKColor(),
            StrokeWidth = 10
        };
        canvas.DrawCircle(info.Width / 3, info.Height / 2, 100, paint);
        // I want to draw the second circle after some delay.
        canvas.DrawCircle(info.Width / 3, info.Height / 3, 100, paint);
    }
}

1 个答案:

答案 0 :(得分:1)

您可以将default radius中的second circle设置为0,这样就不会在页面上绘制它。然后经过一些延迟(我在此处设置了4000ms),可以将radius设置为100并重绘视图,第二个将出现。这是你想要的吗?

public class SimpleCirclePage : ContentPage{

    float radius = 0;

    public SimpleCirclePage()
    {
        SKCanvasView canvasView = new SKCanvasView();
        canvasView.PaintSurface += OnCanvasViewPaintSurface;
        this.Content = canvasView;

        Device.StartTimer(TimeSpan.FromMilliseconds(4000), () =>
        {
            radius= 100;
            canvasView.InvalidateSurface();

            return false;
        });
    }

     void  OnCanvasViewPaintSurface(object sender, SKPaintSurfaceEventArgs args)
    {
        SKImageInfo info = args.Info;
        SKSurface surface = args.Surface;
        SKCanvas canvas = surface.Canvas;

        canvas.Clear();

        SKPaint paint = new SKPaint
        {
            Style = SKPaintStyle.Stroke,
            Color = Color.Red.ToSKColor(),
            StrokeWidth = 10
        };

        canvas.DrawCircle(info.Width / 3, info.Height / 2, 100, paint);

        // I want to draw the second circle after some delay.
        canvas.DrawCircle(info.Width / 3, info.Height / 3, radius, paint);
    }
}

您可以阅读文档:skiasharp/basics/animation