SkiaSharp is a powerful cross-platform 2D graphics drawing library derived from Google's Skia graphics library. This article will explore in depth how to use SkiaSharp to draw various types of lines.

Basic Line Drawing

C#
override protected void OnPaint(PaintEventArgs e)
{
    var info=new SKImageInfo(ClientSize.Width, ClientSize.Height);
    using (var surface = SKSurface.Create(info))
    {
        var canvas = surface.Canvas;
        canvas.Clear(SKColors.White);
        // Create Paint object
        using (var paint = new SKPaint())
        {
            // Set line color to blue
            paint.Color = SKColors.Blue;

            // Set line width
            paint.StrokeWidth = 5;

            // Set drawing mode to stroke
            paint.Style = SKPaintStyle.Stroke;

            // Draw a line from point (50, 50) to point (200, 200)
            canvas.DrawLine(50, 50, 200, 200, paint);
        }
        using(var view=new SKGLControl())
        {
            // Generate snapshot image from the drawing surface  
            var image = surface.Snapshot();
            // Generate SKBitmap from image  
            var bitmap = SKBitmap.FromImage(image);
            // Convert SKBitmap to GDI+ Bitmap and draw to Graphics object of PaintEventArgs  
            e.Graphics.DrawImage(bitmap.ToBitmap(), 0, 0);
        }
    }
}

Advanced Line Drawing Techniques

C#
override protected void OnPaint(PaintEventArgs e)
{
    var info=new SKImageInfo(ClientSize.Width, ClientSize.Height);
    using (var surface = SKSurface.Create(info))
    {
        var canvas = surface.Canvas;
        canvas.Clear(SKColors.White);
        // Create lines with multiple styles
        using (var solidLinePaint = new SKPaint())
        {
            // Solid line
            solidLinePaint.Color = SKColors.Red;
            solidLinePaint.StrokeWidth = 3;
            solidLinePaint.Style = SKPaintStyle.Stroke;

            // Draw solid line
            canvas.DrawLine(50, 50, 200, 50, solidLinePaint);
        }

        using (var dashedLinePaint = new SKPaint())
        {
            // Dashed line
            dashedLinePaint.Color = SKColors.Green;
            dashedLinePaint.StrokeWidth = 3;
            dashedLinePaint.Style = SKPaintStyle.Stroke;

            // Create dashed effect
            dashedLinePaint.PathEffect = SKPathEffect.CreateDash(
                new float[] { 10, 5 },  // 10 pixels solid, 5 pixels gap
                0  // Offset
            );

            // Draw dashed line
            canvas.DrawLine(50, 100, 200, 100, dashedLinePaint);
        }
        using (var view=new SKGLControl())
        {
            // Generate snapshot image from the drawing surface  
            var image = surface.Snapshot();
            // Generate SKBitmap from image  
            var bitmap = SKBitmap.FromImage(image);
            // Convert SKBitmap to GDI+ Bitmap and draw to Graphics object of PaintEventArgs  
            e.Graphics.DrawImage(bitmap.ToBitmap(), 0, 0);
        }
    }
}

Line Antialiasing and Advanced Rendering

C#
override protected void OnPaint(PaintEventArgs e)
{
    var info=new SKImageInfo(ClientSize.Width, ClientSize.Height);
    using (var surface = SKSurface.Create(info))
    {
        var canvas = surface.Canvas;
        canvas.Clear(SKColors.White);

        using (var paint = new SKPaint())
        {
            // Enable antialiasing
            paint.IsAntialias = true;

            // Set stroke cap style
            paint.StrokeCap = SKStrokeCap.Round;  // Round line caps
            paint.Color = SKColors.Orange;
            paint.StrokeWidth =20;
            paint.Style = SKPaintStyle.Stroke;

            // Draw smooth line with round caps
            canvas.DrawLine(50, 200, 250, 200, paint);
        }
        using (var view=new SKGLControl())
        {
            // Generate snapshot image from the drawing surface  
            var image = surface.Snapshot();
            // Generate SKBitmap from image  
            var bitmap = SKBitmap.FromImage(image);
            // Convert SKBitmap to GDI+ Bitmap and draw to Graphics object of PaintEventArgs  
            e.Graphics.DrawImage(bitmap.ToBitmap(), 0, 0);
        }
    }
}

Gradient Line Drawing

C#
override protected void OnPaint(PaintEventArgs e)
{
    var info=new SKImageInfo(ClientSize.Width, ClientSize.Height);
    using (var surface = SKSurface.Create(info))
    {
        var canvas = surface.Canvas;
        canvas.Clear(SKColors.White);

        // Create linear gradient
        var shader = SKShader.CreateLinearGradient(
            new SKPoint(50, 250),   // Gradient start point
            new SKPoint(250, 250),  // Gradient end point
            new SKColor[]
            {
        SKColors.Red,    // Start color
        SKColors.Blue    // End color
            },
            null,
            SKShaderTileMode.Clamp
        );

        using (var paint = new SKPaint())
        {
            paint.Shader = shader;
            paint.StrokeWidth = 20;
            paint.Style = SKPaintStyle.Stroke;

            // Draw gradient line
            canvas.DrawLine(50, 250, 450, 250, paint);
        }

        using (var view=new SKGLControl())
        {
            // Generate snapshot image from the drawing surface  
            var image = surface.Snapshot();
            // Generate SKBitmap from image  
            var bitmap = SKBitmap.FromImage(image);
            // Convert SKBitmap to GDI+ Bitmap and draw to Graphics object of PaintEventArgs  
            e.Graphics.DrawImage(bitmap.ToBitmap(), 0, 0);
        }
    }
}

Simple Animation

C#
using System;
using System.Windows.Forms;
using SkiaSharp;
using SkiaSharp.Views.Desktop;
using Timer = System.Windows.Forms.Timer;

namespace AppLine
{
    public partial class Form1 : Form
    {
        private float dashOffset = 0;
        private Timer animationTimer;

        public Form1()
        {
            InitializeComponent();

            // Set double buffering to reduce flickering  
            SetStyle(ControlStyles.OptimizedDoubleBuffer |
                     ControlStyles.AllPaintingInWmPaint |
                     ControlStyles.UserPaint, true);
            UpdateStyles();

            // Initialize animation timer  
            animationTimer = new Timer();
            animationTimer.Interval = 50; // Update every 50 milliseconds  
            animationTimer.Tick += AnimationTimer_Tick;
            animationTimer.Start();
        }

        private void AnimationTimer_Tick(object sender, EventArgs e)
        {
            // Update dash offset  
            dashOffset += 2;
            // Trigger redraw  
            Invalidate();
        }

        protected override void OnPaint(PaintEventArgs e)
        {
            var info = new SKImageInfo(ClientSize.Width, ClientSize.Height);
            using (var surface = SKSurface.Create(info))
            {
                var canvas = surface.Canvas;
                canvas.Clear(SKColors.White);

                using (var dashedLinePaint = new SKPaint())
                {
                    // Dashed line  
                    dashedLinePaint.Color = SKColors.Green;
                    dashedLinePaint.StrokeWidth = 3;
                    dashedLinePaint.Style = SKPaintStyle.Stroke;

                    // Create dynamic offset dashed effect  
                    dashedLinePaint.PathEffect = SKPathEffect.CreateDash(
                        new float[] { 10, 5 },  // 10 pixels solid, 5 pixels gap  
                        dashOffset  // Dynamic offset  
                    );

                    // Draw dashed line  
                    canvas.DrawLine(50, 100, 500, 100, dashedLinePaint);
                }

                // Generate snapshot image from the drawing surface  
                var image = surface.Snapshot();
                // Generate SKBitmap from image  
                var bitmap = SKBitmap.FromImage(image);
                // Convert SKBitmap to GDI+ Bitmap and draw to Graphics object of PaintEventArgs  
                e.Graphics.DrawImage(bitmap.ToBitmap(), 0, 0);
            }
        }

        // Stop timer when form is closing  
        protected override void OnFormClosing(FormClosingEventArgs e)
        {
            base.OnFormClosing(e);
            animationTimer.Stop();
        }
    }
}

Performance Tips

• Try to reuse SKPaint objects
• For complex drawing, consider using SKPath
• Enabling antialiasing will slightly increase performance overhead

Conclusion

SkiaSharp provides a rich API for drawing various styles and types of lines. By flexibly using SKPaint and different drawing methods, you can create beautiful line effects.

I hope this article helps you gain a deep understanding of line drawing techniques in SkiaSharp!