You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

如何使用C# SharpDX结合Direct2D渲染SVG图形?附示例需求

使用SharpDX.Direct2D1渲染SVG图形的完整指南

嘿,我刚好研究过SharpDX的SVG渲染支持,给你一步步讲怎么实现渲染那个鲸鱼图标~

首先得确保你用的是包含SVG支持的SharpDX版本——就是你提到的那个PR合并后的版本,不管是从NuGet拉的编译好的包,还是自己从源码编译的都行。接下来咱们一步步来:

1. 准备SVG资源

先把那个鲸鱼的SVG内容保存成本地文件(比如叫whale.svg),或者直接复制它的字符串内容——SharpDX的SVG渲染器既支持加载文件,也能直接解析字符串格式的SVG,怎么方便怎么来。

2. 初始化Direct2D核心对象

要渲染SVG,除了常规的Direct2D渲染环境(FactoryRenderTarget),还得额外创建SvgDocumentSvgRenderer这俩关键对象。先给你一段初始化的核心代码:

using SharpDX;
using SharpDX.Direct2D1;
using SharpDX.DirectWrite;
using SharpDX.WIC;

// 初始化WIC工厂,用来处理SVG的加载
var wicFactory = new ImagingFactory();

// 初始化Direct2D工厂和窗口RenderTarget(这里以窗口渲染为例,你也可以用其他类型的RenderTarget)
var d2dFactory = new Factory();
var renderTargetProps = new RenderTargetProperties(
    RenderTargetType.Default,
    new PixelFormat(Format.R8G8B8A8_UNorm, AlphaMode.Premultiplied),
    0, 0,
    RenderTargetUsage.None,
    FeatureLevel.Level_10);

// 替换成你的窗口句柄hwnd,还有窗口的宽高
var windowRenderTarget = new WindowRenderTarget(d2dFactory, renderTargetProps, new HwndRenderTargetProperties { Hwnd = hwnd, PixelSize = new Size2(800, 600) });

// 创建SVG渲染器,这是绘制SVG的核心
var svgRenderer = new SvgRenderer(d2dFactory);

3. 加载SVG文档

两种加载方式任选其一:

从本地文件加载

如果已经把SVG存成文件了,用这个方式:

SvgDocument svgDocument;
using (var fileStream = new FileStream("whale.svg", FileMode.Open, FileAccess.Read))
using (var wicStream = new WICStream(wicFactory, fileStream))
using (var svgReader = new SvgReader(wicFactory, d2dFactory, svgRenderer))
{
    svgReader.Load(wicStream);
    svgDocument = svgReader.Document;
}

从字符串加载

如果直接拿到了SVG的原始字符串(比如从接口返回的),这样更省事:

SvgDocument svgDocument;
// 把yourWhaleSvgString替换成鲸鱼SVG的实际字符串内容
using (var svgReader = new SvgReader(wicFactory, d2dFactory, svgRenderer))
{
    svgReader.LoadFromString(yourWhaleSvgString);
    svgDocument = svgReader.Document;
}

4. 把SVG渲染到RenderTarget

现在就可以把鲸鱼画到窗口上了,还能调整位置和缩放,比如居中绘制并缩小到合适大小:

windowRenderTarget.BeginDraw();
windowRenderTarget.Clear(Color.White); // 先清屏,背景设为白色

// 获取SVG的原始 viewBox,用来计算绘制区域
var svgBounds = svgDocument.ViewBox;
// 定义目标绘制区域,这里让鲸鱼居中,缩放50%
var targetRect = new RectangleF(
    (windowRenderTarget.Size.Width - svgBounds.Width * 0.5f) / 2,
    (windowRenderTarget.Size.Height - svgBounds.Height * 0.5f) / 2,
    svgBounds.Width * 0.5f,
    svgBounds.Height * 0.5f);

// 核心一步:渲染SVG
svgRenderer.Render(windowRenderTarget, svgDocument, targetRect);

windowRenderTarget.EndDraw();

几个要注意的坑

  • 一定要记得释放所有SharpDX对象——所有实现IDisposable的对象要么用using包裹,要么手动调用Dispose(),不然容易内存泄漏。
  • 如果你的SVG里引用了外部资源(比如图片),得自己实现ISvgResourceResolver接口来处理这些资源的加载,不然会渲染失败。
  • SharpDX的SVG解析器是严格遵循标准的,要是遇到渲染异常,先检查SVG的语法有没有非标准属性,有些第三方网站的SVG可能会加一些自定义属性,得先清理掉。

内容的提问来源于stack exchange,提问作者Jenny

火山引擎 最新活动