Getting Started With Skia Sharp

Getting Started With SkiaSharp

Requirements

• Visual Studio Code (VS Code)
• Polyglot Notebook Extension
  • 
• A little bit of experience in C#

Quick Setup

This guide will walk you through the basic setup and usage of SkiaSharp in VS Code.

Step 1: Create a Notebook File

1. Open VS Code.
2. Create a new file and name it Basic.ipynb or any name with the extension .ipynb or .dib.

Step 2: Install SkiaSharp Library

In the first cell of your notebook, type the following command to download the SkiaSharp library from the NuGet package repository:

1

#r "nuget:SkiaSharp"

Step 3: Import SkiaSharp Library

In a different cell, import the SkiaSharp library using the following code:

1

using SkiaSharp;

Step 4: Create a Dot Matrix Using SkiaSharp

Now, let’s create a dot matrix using SkiaSharp. Copy and paste the following code into another cell:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

int width = 1200;  
int height = 200;  
int step = 30; 

SKBitmap bmp = new(width, height); 
SKCanvas canvas = new(bmp);
canvas.Clear(SKColor.Parse("#fff")); 

SKPaint paint = new() 
{ 
    Color = SKColors.White.WithAlpha(100), 
    IsAntialias = true,
    StrokeWidth = 3,
    ColorF = SKColor.Parse("#003366")
};  

for (var i = step; i < height; i += step)
{
    for (var j = step; j < width; j += step)
    {
        SKPoint point = new(j, i);
        canvas.DrawPoint(point, paint);
    }   
}

// For saving the image as a file
using (SKFileWStream fs = new("image.jpg"))
{
    bmp.Encode(fs, SKEncodedImageFormat.Jpeg, quality: 50);
}
bmp.Display();

Additional Information

For more details on the SKBitmap class and its usage, please refer to the official Microsoft documentation on SKBitmap.

By following these steps, you will have a basic setup for creating graphics with SkiaSharp in a Polyglot Notebook within VS Code. Enjoy exploring the powerful graphics capabilities of SkiaSharp!