如何用 .NET 构建跨平台 2D 编辑器PixiEditor 的做法【免费下载链接】PixiEditorPixiEditor is a Universal Editor for all your 2D needs项目地址: https://gitcode.com/GitHub_Trending/pi/PixiEditor做像素画的人迟早会撞上一堵很具体的墙逐帧动画的工具不认矢量导出 SVG 的工具又做不到像素级对齐想加个程序化效果就得把文件导出再导回另一个工具。跨平台只是这个问题的入口。PixiEditor 是一个用 .NET 8 编写的 2D 编辑器它想把像素画、绘画、矢量三套工具集放进同一张画布让同一个文档能导出成 PNG、SVG、GIF 乃至 MP4。翻它的源码目录切分方式很干净ChangeableDocument 管画布上有什么文档模型Drawie基于 Google Skia 的 2D 渲染库管怎么画Avalonia 管用户看到什么。UI 和画布渲染走两条完全独立的路。这个编辑器最有辨识度的不是工具集本身而是底下这两块基建文档被建成一张节点图渲染管线被做成后端可选。PixiEditor 是面向像素画创作者和独立游戏开发者的跨平台 2D 编辑器Windows 与 Linux 目前体验完整macOS 版也在路线图上。和 Aseprite、Piskel 这类同类相比关键差异不在界面而在它把整个文档建模成节点图——图层、特效、结构都是节点你给图层加的效果是图里的一条连线而不是写死在文件里的属性。文档就是一张节点图传统编辑器里的高斯模糊是写进文件的属性PixiEditor 里它是一张图里的节点。Document.cs 里每个文档持有自己的 NodeGraph图层结构、每个特效、时间线都是图的成员。这个模型带来两个直接好处特效随时可以改线重连渲染系统只需执行这张图完全不用关心用户叠了多少层。图像数据也不是整块存——ChunkyImageLib 把画面切成分块chunk只有非空的块占内存所以改一个像素只重画这一块是天然成立的操作。渲染入口 DocumentRenderer.cs 把这件事做成了最朴素的图遍历public void UpdateChunk(VecI chunkPos, ChunkResolution resolution, KeyFrameTime frameTime) { Document.NodeGraph.TryTraverse((node { if (node is IChunkRenderable imageNode) { imageNode.RenderChunk(chunkPos, resolution, frameTime, Document.ProcessingColorSpace); } })); }这段代码实际在做什么画布上某个小块需要刷新时遍历一次节点图让每个图像节点只重绘那一块一次像素编辑不会触发整画布重绘。渲染管线交给 Avalonia 与 DrawieUI 和画布不能挤在同一条渲染通道里。PixiEditor 的做法是Avalonia 负责窗口和控件画布区域交给 Drawie底层绘制由 Skia 完成启动时再根据用户偏好或命令行参数决定 GPU 后端默认 Vulkan 优先、OpenGL 兜底。承载画布的 Scene.cs 继承自 Zoombox缩放视口控件最终把渲染结果贴到 Avalonia 纹理上的只是一次 DrawSurface 拷贝。启动逻辑全部写在 Program.csreturn AppBuilder.ConfigureApp() .UsePlatformDetect() .With(new Win32PlatformOptions() { RenderingMode openGlPreferred ? [Win32RenderingMode.Wgl, Win32RenderingMode.Vulkan] : [Win32RenderingMode.Vulkan, Win32RenderingMode.Wgl], }) .WithDrawie();这段代码实际在做什么应用启动时写死 GPU 后端的回退顺序Vulkan 或 OpenGL 谁在前末尾的 WithDrawie() 把 Drawie 挂进 Avalonia 的渲染树画布和 UI 从此共享同一帧调度。跨平台渲染的三个实操坑走 Skia 通道渲染大画布时SkiaOptions.MaxGpuResourceSizeBytes必须提前调大——仓库把默认值放大到四倍就是因为 GPU 纹理额度不够会直接渲染失败。Vulkan 在老显卡上卡顿时用--opengl启动参数或偏好文件切后端即可不用重新编译这正是上面那段回退顺序存在的意义。渲染是多线程分块进行的源码注释自己都在提醒遍历时文档对象可能已被释放动文档模型前先把ObjectDisposedException接住。它适合什么不适合什么PixiEditor 不适合照片级修图或大屏位图工作——默认 64x64 的画布和逐帧时间线都是为图小、帧多、层多的游戏资产场景调的。需要 PSD 级遮罩体系或 4K 视频输出的项目先选别的工具。但如果你想搭自己的 2D 工具这个仓库的周边值得翻samples/ 目录给了 12 个 C# 扩展示例能注册自定义命令、调色板甚至 UI上面还挂着独立的 SVG 解析库 PixiEditor.SVG 和 Wasm 扩展运行时动画功能则支持逐帧与着色器节点两条路。想动手的话clone 仓库https://gitcode.com/GitHub_Trending/pi/PixiEditor后先跑通 samples 里的 HelloWorld 扩展比直接啃主项目快得多——对一个把文档即节点图、渲染即图执行贯彻到底的编辑器来说扩展入口就是它架构的浓缩版。【免费下载链接】PixiEditorPixiEditor is a Universal Editor for all your 2D needs项目地址: https://gitcode.com/GitHub_Trending/pi/PixiEditor创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考