目录
SkiaSharp 是一个跨平台的 2D 图形库，基于 Google 的 Skia 图形引擎。它允许开发者在 .NET 应用程序中进行高效的图形绘制。SKCanvas 是 SkiaSharp 中的一个核心类，负责在指定的表面上绘制图形。本文将详细介绍 SKCanvas 的基本概念，并通过示例来演示其用法。
准备工作
nuget 安装
C#SkiaSharp SkiaSharp.Views.WindowsForms
1. SKCanvas 概述
SKCanvas 提供了一系列方法，用于绘制形状、文本和图像。它的工作原理是将绘制操作应用于一个 SKSurface，后者可以是屏幕、图像或其他可绘制的表面。
1.1 SKCanvas 的创建
要使用 SKCanvas，首先需要创建一个 SKSurface。以下是创建 SKSurface 和获取 SKCanvas 的基本步骤：
C#using SkiaSharp;
// 创建一个位图
var info = new SKImageInfo(800, 600);
using var surface = SKSurface.Create(info);
SKCanvas canvas = surface.Canvas;
2. SKCanvas 的基本绘制操作
2.1 绘制形状
SKCanvas 提供了多种方法来绘制基本形状，如矩形、圆形和线条。
2.1.1 绘制矩形
C#protected override void OnPaint(PaintEventArgs e)
{
// 创建 SKImageInfo
var info = new SKImageInfo(ClientSize.Width, ClientSize.Height);
// 使用 SKSurface.Create 创建绘图表面
using (var surface = SKSurface.Create(info))
{
SKCanvas canvas = surface.Canvas;
// 设置画笔
using var paint = new SKPaint
{
Color = SKColors.Blue,
Style = SKPaintStyle.Fill
};
// 绘制矩形
canvas.DrawRect(new SKRect(100, 100, 300, 300), paint);
// 将 SKSurface 渲染到 Windows 窗体
using (var skImageView = new SKControl())
{
var image = surface.Snapshot();
var bitmap = SKBitmap.FromImage(image);
e.Graphics.DrawImage(bitmap.ToBitmap(), 0, 0);
}
}
}
2.1.2 绘制圆形
C#protected override void OnPaint(PaintEventArgs e)
{
// 创建 SKImageInfo
var info = new SKImageInfo(ClientSize.Width, ClientSize.Height);
// // 在创建 SKSurface 时启用高质量渲染
using (var surface = SKSurface.Create(info, new SKSurfaceProperties(SKPixelGeometry.RgbHorizontal)))
{
SKCanvas canvas = surface.Canvas;
// 设置画笔
using var paint = new SKPaint();
// 开启抗锯齿
paint.IsAntialias = true;
// 设置画笔
paint.Color = SKColors.Red;
paint.Style = SKPaintStyle.StrokeAndFill;
// 绘制圆形
canvas.DrawCircle(400, 300, 100, paint);
// 将 SKSurface 渲染到 Windows 窗体
using (var skImageView = new SKControl())
{
var image = surface.Snapshot();
var bitmap = SKBitmap.FromImage(image);
e.Graphics.DrawImage(bitmap.ToBitmap(), 0, 0);
}
}
}
2.1.3 绘制线条
C#protected override void OnPaint(PaintEventArgs e)
{
// 创建 SKImageInfo
var info = new SKImageInfo(ClientSize.Width, ClientSize.Height);
// // 在创建 SKSurface 时启用高质量渲染
using (var surface = SKSurface.Create(info, new SKSurfaceProperties(SKPixelGeometry.RgbHorizontal)))
{
SKCanvas canvas = surface.Canvas;
// 设置画笔
using var paint = new SKPaint();
// 开启抗锯齿
paint.IsAntialias = true;
// 设置画笔
paint.Color = SKColors.Green;
paint.StrokeWidth = 5;
// 绘制线条
canvas.DrawLine(50, 50, 750, 550, paint);
// 将 SKSurface 渲染到 Windows 窗体
using (var skImageView = new SKControl())
{
var image = surface.Snapshot();
var bitmap = SKBitmap.FromImage(image);
e.Graphics.DrawImage(bitmap.ToBitmap(), 0, 0);
}
}
}
2.2 绘制文本
SKCanvas 还支持文本绘制。可以使用 SKPaint 设置字体和样式。
C#protected override void OnPaint(PaintEventArgs e)
{
// 创建 SKImageInfo
var info = new SKImageInfo(ClientSize.Width, ClientSize.Height);
// // 在创建 SKSurface 时启用高质量渲染
using (var surface = SKSurface.Create(info, new SKSurfaceProperties(SKPixelGeometry.RgbHorizontal)))
{
SKCanvas canvas = surface.Canvas;
// 设置画笔
using var paint = new SKPaint();
// 开启抗锯齿
paint.IsAntialias = true;
// 设置画笔
paint.Color = SKColors.Black;
SKFont font = new SKFont();
font.Size = 24;
// 绘制文本
// 使用 DrawText 的新建议方法
canvas.DrawText(
"Hello, SkiaSharp!",
200f,
200f,
SKTextAlign.Left,
font,
paint
);
// 将 SKSurface 渲染到 Windows 窗体
using (var skImageView = new SKControl())
{
var image = surface.Snapshot();
var bitmap = SKBitmap.FromImage(image);
e.Graphics.DrawImage(bitmap.ToBitmap(), 0, 0);
}
}
}
2.3 绘制图像
可以将图像绘制到 SKCanvas 上。首先需要加载图像，然后使用 DrawImage 方法进行绘制。
C#// 加载图像
using var bitmap = SKBitmap.Decode("feGsv0kJ6CEBng3.png");
// 绘制图像
canvas.DrawBitmap(bitmap, new SKPoint(100, 100));
3. SKCanvas 的变换
SKCanvas 支持变换操作，如平移、缩放和旋转。这些变换可以通过 Save 和 Restore 方法来管理。
3.1 平移
C#protected override void OnPaint(PaintEventArgs e)
{
// 创建 SKImageInfo
var info = new SKImageInfo(ClientSize.Width, ClientSize.Height);
// 使用 SKSurface.Create 创建绘图表面
using (var surface = SKSurface.Create(info))
{
// 获取 SKCanvas
SKCanvas canvas = surface.Canvas;
// 清除背景
canvas.Clear(SKColors.White);
// 创建画笔
using (var paint = new SKPaint())
{
// 设置画笔样式
paint.Color = SKColors.Blue;
paint.Style = SKPaintStyle.Fill;
// 保存当前画布状态
canvas.Save();
// 平移画布
canvas.Translate(100, 100);
// 绘制平移后的矩形
canvas.DrawRect(new SKRect(0, 0, 200, 200), paint);
// 恢复画布状态
canvas.Restore();
// 额外绘制一个对比矩形，展示平移效果
paint.Color = SKColors.Red;
canvas.DrawRect(new SKRect(0, 0, 200, 200), paint);
}
// 将 SKSurface 渲染到 Windows 窗体
using (var skImageView = new SKControl())
{
var image = surface.Snapshot();
var bitmap = SKBitmap.FromImage(image);
e.Graphics.DrawImage(bitmap.ToBitmap(), 0, 0);
}
}
}
3.2 旋转
C#protected override void OnPaint(PaintEventArgs e)
{
// 创建 SKImageInfo
var info = new SKImageInfo(ClientSize.Width, ClientSize.Height);
// 使用 SKSurface.Create 创建绘图表面
using (var surface = SKSurface.Create(info))
{
// 获取 SKCanvas
SKCanvas canvas = surface.Canvas;
// 清除背景
canvas.Clear(SKColors.White);
// 创建画笔
using (var paint = new SKPaint())
{
// 设置画笔样式
paint.Color = SKColors.Blue;
paint.Style = SKPaintStyle.Fill;
// 保存当前画布状态
canvas.Save();
// 旋转画布
canvas.RotateDegrees(45, info.Width / 2, info.Height / 2);
// 绘制平移后的矩形
canvas.DrawRect(new SKRect(0, 0, 200, 200), paint);
// 恢复画布状态
canvas.Restore();
// 额外绘制一个对比矩形，展示平移效果
paint.Color = SKColors.Red;
canvas.DrawRect(new SKRect(0, 0, 200, 200), paint);
}
// 将 SKSurface 渲染到 Windows 窗体
using (var skImageView = new SKControl())
{
var image = surface.Snapshot();
var bitmap = SKBitmap.FromImage(image);
e.Graphics.DrawImage(bitmap.ToBitmap(), 0, 0);
}
}
}
3.3 缩放
C#protected override void OnPaint(PaintEventArgs e)
{
// 创建 SKImageInfo
var info = new SKImageInfo(ClientSize.Width, ClientSize.Height);
// 使用 SKSurface.Create 创建绘图表面
using (var surface = SKSurface.Create(info))
{
// 获取 SKCanvas
SKCanvas canvas = surface.Canvas;
// 清除背景
canvas.Clear(SKColors.White);
// 创建画笔
using (var paint = new SKPaint())
{
// 设置画笔样式
paint.Color = SKColors.Blue;
paint.Style = SKPaintStyle.Fill;
// 保存当前画布状态
canvas.Save();
// 缩放
canvas.Scale(1.5f, 1.5f);
// 绘制平移后的矩形
canvas.DrawRect(new SKRect(0, 0, 200, 200), paint);
// 恢复画布状态
canvas.Restore();
// 额外绘制一个对比矩形，展示平移效果
paint.Color = SKColors.Red;
canvas.DrawRect(new SKRect(0, 0, 200, 200), paint);
}
// 将 SKSurface 渲染到 Windows 窗体
using (var skImageView = new SKControl())
{
var image = surface.Snapshot();
var bitmap = SKBitmap.FromImage(image);
e.Graphics.DrawImage(bitmap.ToBitmap(), 0, 0);
}
}
}
4. SKCanvas 的剪裁
SKCanvas 还支持剪裁操作，可以限制绘制区域。
C#protected override void OnPaint(PaintEventArgs e)
{
// 创建 SKImageInfo
var info = new SKImageInfo(ClientSize.Width, ClientSize.Height);
// 使用 SKSurface.Create 创建绘图表面
using (var surface = SKSurface.Create(info, new SKSurfaceProperties(SKPixelGeometry.RgbHorizontal)))
{
// 获取 SKCanvas
SKCanvas canvas = surface.Canvas;
// 清除背景
canvas.Clear(SKColors.White);
// 创建画笔
using (var paint = new SKPaint())
{
// 设置画笔样式
paint.Color = SKColors.Blue;
paint.Style = SKPaintStyle.Fill;
paint.IsAntialias = true;
// 保存当前画布状态
canvas.Save();
// 设置剪裁区域
canvas.ClipRect(new SKRect(100, 100, 500, 500));
// 绘制矩形（只在剪裁区域内可见）
canvas.DrawRect(new SKRect(50, 50, 600, 600), paint);
// 恢复画布状态
canvas.Restore();
// 绘制剪裁区域的边框，方便观察
using (var borderPaint = new SKPaint())
{
borderPaint.Color = SKColors.Red;
borderPaint.Style = SKPaintStyle.Stroke;
borderPaint.StrokeWidth = 2;
canvas.DrawRect(new SKRect(100, 100, 500, 500), borderPaint);
}
}
// 将 SKSurface 渲染到 Windows 窗体
using (var skImageView = new SKControl())
{
var image = surface.Snapshot();
var bitmap = SKBitmap.FromImage(image);
e.Graphics.DrawImage(bitmap.ToBitmap(), 0, 0);
}
}
}
5. 结论
SKCanvas 是 SkiaSharp 中一个强大的绘图工具，提供了丰富的绘制功能。通过本文的介绍和示例，您应该能够理解 SKCanvas 的基本概念，并在自己的项目中应用这些知识。无论是绘制简单的形状、文本，还是处理复杂的图像和变换，SKCanvas 都能满足您的需求。
希望这篇文章能帮助您更好地理解和使用 SkiaSharp 的 SKCanvas！如果您有任何问题或需要进一步的示例，请随时询问。
本文作者:技术老小子
本文链接:
版权声明:本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！
目录