在SkiaSharp中，透明度（Alpha通道）控制是一个非常重要的特性，它可以让我们创建半透明效果，实现更丰富的视觉表现。本文将详细介绍如何在SkiaSharp中控制透明度。

Nuget 安装包

基础概念

在SkiaSharp中，颜色使用32位整数表示，包含四个通道：

Alpha (透明度)
Red (红色)
Green (绿色)
Blue (蓝色)

每个通道占用8位（0-255），其中：

0 表示完全透明
255 表示完全不透明

创建带透明度的颜色

使用SKColor构造函数

C#
// 创建一个50%透明度的红色
// 参数顺序：red, green, blue, alpha
SKColor color1 = new SKColor(255, 0, 0, 128); // 红色，50%透明度

// 使用byte类型参数
byte alpha = 128;
byte red = 255;
byte green = 0;
byte blue = 0;
SKColor color2 = new SKColor(red, green, blue, alpha);

使用SKColors预定义颜色并调整透明度

C#
// 从预定义颜色创建带透明度的颜色
SKColor transparentBlue = SKColors.Blue.WithAlpha(128);

使用SKColorF（浮点数表示）

C#
// 使用浮点数表示颜色（范围0.0-1.0）
SKColorF colorF = new SKColorF(1.0f, 0.0f, 0.0f, 0.5f); // 红色，50%透明度

实际应用示例

绘制半透明矩形

C#
using SkiaSharp;
using SkiaSharp.Views.Desktop;

namespace AppTransparency
{
    public partial class Form1 : Form
    {
        SKGLControl skControl = new SKGLControl();
        public Form1()
        {
            InitializeComponent();
            skControl = new SKGLControl();
            skControl.Dock = DockStyle.Fill;
            skControl.PaintSurface += SkControl_PaintSurface;

            this.Controls.Add(skControl);
            this.BackColor = System.Drawing.Color.Black;
        }

        private void SkControl_PaintSurface(object sender, SKPaintGLSurfaceEventArgs e)
        {
            SKCanvas canvas = e.Surface.Canvas;
            canvas.Clear(SKColors.Black);
            DrawTransparentRectangles(canvas);
        }

        public void DrawTransparentRectangles(SKCanvas canvas)
        {
            // 创建画笔
            using (var paint = new SKPaint())
            {
                // 绘制背景
                canvas.DrawColor(SKColors.White);

                // 绘制多个重叠的半透明矩形
                for (int i = 0; i < 5; i++)
                {
                    // 创建渐变的透明度
                    byte alpha = (byte)(255 - i * 40);
                    paint.Color = new SKColor(255, 0, 0, alpha);

                    // 绘制矩形
                    float x = 50 + i * 30;
                    float y = 50 + i * 30;
                    canvas.DrawRect(x, y, 100, 100, paint);
                }
            }
        }
    }
}

绘制渐变透明效果

C#
public void DrawTransparentGradient(SKCanvas canvas)
{
    using (var paint = new SKPaint())
    {
        // 创建渐变色
        var colors = new SKColor[] 
        {
            new SKColor(255, 0, 0, 255),  // 完全不透明的红色
            new SKColor(255, 0, 0, 0)     // 完全透明的红色
        };

        // 定义渐变位置
        var positions = new float[] { 0.0f, 1.0f };

        // 创建线性渐变
        using (var shader = SKShader.CreateLinearGradient(
            new SKPoint(0, 0),
            new SKPoint(200, 0),
            colors,
            positions,
            SKShaderTileMode.Clamp))
        {
            paint.Shader = shader;
            canvas.DrawRect(50, 50, 200, 100, paint);
        }
    }
}

实现图层混合效果

C#
public void DrawLayerBlending(SKCanvas canvas)
{
    using (var paint = new SKPaint())
    {
        // 绘制背景
        canvas.DrawColor(SKColors.White);

        // 绘制第一个圆
        paint.Color = new SKColor(255, 0, 0, 128); // 半透明红色
        canvas.DrawCircle(100, 100, 50, paint);

        // 绘制第二个圆
        paint.Color = new SKColor(0, 0, 255, 128); // 半透明蓝色
        canvas.DrawCircle(150, 100, 50, paint);
    }
}

高级技巧

使用SaveLayer创建透明图层

C#
public void DrawWithTransparentLayer(SKCanvas canvas)
{
    // 先绘制一些背景图形  
    var backgroundPaint = new SKPaint
    {
        Color = SKColors.Green
    };
    canvas.DrawCircle(150, 150, 80, backgroundPaint);

    // 保存当前画布状态  
    canvas.Save();

    // 创建一个半透明图层  
    var paint = new SKPaint
    {
        Color = SKColors.White.WithAlpha(128) // 使用白色半透明图层  
    };

    var layer = canvas.SaveLayer(paint);

    // 在图层上绘制内容  
    paint.Color = SKColors.Red;
    canvas.DrawCircle(100, 100, 50, paint);

    paint.Color = SKColors.Blue;
    canvas.DrawRect(75, 75, 100, 100, paint);

    // 恢复图层  
    canvas.RestoreToCount(layer);

    // 恢复画布状态  
    canvas.Restore();
}

动态调整透明度

C#
private SKGLControl skControl;
private float progress = 0.0f;
private System.Windows.Forms.Timer animationTimer;
public Form1()
{
    InitializeComponent();
    skControl = new SKGLControl();
    skControl.Dock = DockStyle.Fill;
    skControl.PaintSurface += SkControl_PaintSurface;

    this.Controls.Add(skControl);
    this.BackColor = System.Drawing.Color.Black;

    // 设置定时器  
    animationTimer = new System.Windows.Forms.Timer();
    animationTimer.Interval = 16; // 约60fps  
    animationTimer.Tick += AnimationTimer_Tick;
    animationTimer.Start();
}

private void AnimationTimer_Tick(object sender, EventArgs e)
{
    if (progress < 1.0f)
    {
        progress += 0.02f; // 调整这个值可以改变动画速度  
        if (progress > 1.0f) progress = 1.0f;
        skControl.Invalidate(); // 请求重绘  
    }
    else
    {
        animationTimer.Stop(); // 动画完成后停止定时器  
    }
}

private void SkControl_PaintSurface(object sender, SKPaintGLSurfaceEventArgs e)
{
    SKCanvas canvas = e.Surface.Canvas;
    canvas.Clear(SKColors.White);
    DrawWithAnimatedTransparency(canvas, progress);
}

public void DrawWithAnimatedTransparency(SKCanvas canvas, float progress)
{
    using (var paint = new SKPaint())
    {
        byte alpha = (byte)(255 * progress);
        paint.Color = SKColors.Blue.WithAlpha(alpha);
        canvas.DrawRect(50, 50, 200, 200, paint);
    }
}

注意事项

性能考虑
- 使用大量半透明图层可能会影响性能
- 尽可能合并相似的透明度操作
- 考虑使用缓存机制来优化重复绘制
颜色混合
- 半透明颜色的叠加效果与绘制顺序有关
- 注意背景色对最终效果的影响
内存管理
- 正确使用using语句来释放资源
- 及时释放不再使用的SKPaint对象

总结

SkiaSharp提供了丰富的透明度控制功能，可以用来创建各种视觉效果。通过合理使用Alpha通道，我们可以实现：

半透明效果
渐变透明
图层混合
动画效果

掌握这些技巧对于创建专业的图形应用至关重要。在实际应用中，需要根据具体需求选择合适的透明度控制方式，并注意性能优化和内存管理。

目录