图形学【免费下载链接】skiaSkia is a complete 2D graphic library for drawing Text, Geometries, and Images. See documentation for contribution instructions.项目地址https://gitcode.com/gh_mirrors/ski/skia点击查看免费下载SkSLSkia Shading Language是 Skia 的着色语言而SkRuntimeEffect是 Skia 提供的 C 对象可用来创建由 SkSL 代码控制行为的SkShader、SkColorFilter和SkBlender。本文以 site/docs/user/sksl.md 为骨架结合 include/effects/SkRuntimeEffect.h、src/sksl/sksl_public.sksl、include/core/SkImage.h 与 tools/sksl-minify/SkSLMinify.cpp 等源码系统讲解 Runtime Effects 的入口函数约定、子着色器求值、坐标与色彩空间处理、预乘 Alpha 语义以及sksl-minify最小化工具的使用方法。读完本文你将能够熟练编写并集成 SkSL Runtime Effects正确处理颜色与坐标并用官方工具压缩你的着色器代码。一、SkSL 与 Runtime Effects 概述SkSL 语法与 GLSL 高度相似你可以直接在 shaders.skia.org 上在线实验。但在 Skia 应用中使用 SkSL 效果时存在一些与 GLSL 的关键差异这些差异大多源于一个基本事实对于 GPU 着色语言你编程的是GPU 流水线的一个阶段而对于 SkSL你编程的是Skia 流水线的一个阶段。GLSL 的片段着色器完全控制 GPU 从光栅化到混合硬件之间的行为——它计算出颜色并将该颜色原样送入固定功能的混合阶段。而 SkSL 效果只是更大 Skia 流水线的一部分当你发起一次 canvas 绘制操作时Skia通常会组装出单个GPU 片段着色器来完成所有必要的工作该着色器通常包含多个片段判断像素是否落在被绘制形状内部或外部或在边界上此时可能应用抗锯齿判断像素是否落在裁剪区域内部或外部同样可能有针对边界像素的抗锯齿逻辑SkPaint上SkShader的逻辑——由于SkShaders::Blend等特性SkShader实际上可以是一棵对象树SkColorFilter的类似逻辑同样可以是一棵树如SkColorFilters::Compose、SkColorFilters::Blend混合代码针对某些SkBlendMode或通过SkPaint::setBlender指定的自定义混合作为 Skia 色彩管理 一部分的颜色空间转换代码。即使SkPaint的SkShader、SkColorFilter或SkBlender字段中有着复杂的对象树仍然只有一个GPU 片段着色器树中的每个节点各创建一个函数裁剪代码和几何代码各创建一个函数混合代码可能创建一个函数最终的整体片段着色器调用所有这些函数函数之间还可以互相调用例如SkShader树的情形。你的 SkSL 效果就是为 GPU 片段着色器贡献一个函数。从源码看这一模型的入口约定定义在 include/effects/SkRuntimeEffect.h 中Shader 效果入口函数形如vec4 main(vec2 inCoords)返回的颜色应为预乘premultiplied颜色ColorFilter 效果入口函数形如vec4 main(vec4 inColor)Blender 效果入口函数形如vec4 main(vec4 srcColor, vec4 dstColor)。头文件同时指出这些vec4参数与返回值实际上可以写成half4或float4vec4是float4的别名编译时MakeForShader、MakeForColorFilter、MakeForBlender会校验 SkSL 代码对该流水线阶段是否合法。二、评估采样其他 SkShader在 GLSL 中片段着色器可以采样纹理。而在 Runtime Effects 中你在 C 侧绑定的对象是SkShader在 SkSL 中以shader表示。为了强调你操作的是一个会生成自身着色器代码的对象你不使用sample而是调用shader对象的.eval()方法。同时Skia 提供了从SkImage创建SkShader的简单方法因此在 Runtime Effect 中使用图片非常容易。由于绑定并求值的是SkShader你无需先把内容转成图片纹理就能直接使用任意 Skia 着色器。例如可以直接求值一个线性渐变——Skia 不会为渐变创建纹理而是生成一个同时计算渐变颜色、从图片纹理采样、再将两者相乘的单一片段着色器甚至可以调用另一个 Runtime Effect从而动态组合着色器片段。这种“着色器树”的求值模型正是第一节所述“每个节点创建一个函数”的体现被求值的子着色器会以内联函数的形式被并入最终片元着色器而不是通过额外的纹理采样间接完成。Skia 对这些子着色器的绑定能力也反映在SkRuntimeEffect::ChildPtr的设计中——它可持有SkShader、SkColorFilter或SkBlender对应的 SkSL 子对象类型由ChildTypekShader、kColorFilter、kBlender描述见 include/effects/SkRuntimeEffect.h。三、坐标空间要理解 SkSL 中的坐标首先需要理解 Skia 中的坐标系。之后只需记住传递给main()的坐标是局部local坐标相对于SkShader自身的坐标空间与 canvas 的局部空间以及任何localMatrix变换保持一致此外如果该着色器被另一个着色器调用父着色器可以任意修改这些坐标。另一个关键区别由SkImage生成的SkShader不使用归一化坐标不像 GLSL 中的纹理。它的坐标原点(0, 0)在左上角(w, h)在右下角。通常这正是你想要的——如果你用传入的坐标直接求值一个SkImageShader缩放是正确的。但当你想要调整这些坐标对图片做某种重映射时请记住坐标是按图片的实际尺寸缩放的。四、色彩空间与 SkSL使用 Skia 的应用通常是色彩管理的目标 surface 的颜色空间决定了一次绘制的工作颜色空间源内容如 shader包括SkImageShader也有自己的颜色空间。默认情况下输入到你 SkSL shader 的颜色都会被转换到工作颜色空间。但有些输入需要特别处理才能获得或抑制这种行为。一个典型例子同一张 mandrill 图片第一次正常绘制尊重文件内存储的颜色空间恰好是 sRGB第二次给图片指定 Rec. 2020 颜色空间——这只是告诉 Skia“把图片中的颜色当作 Rec. 2020 来处理”Skia 随后将这些值从 Rec. 2020 转换到目标 surface 的颜色空间sRGB于是颜色显得更加鲜艳。更重要的是如果图片或目标 surface 真的处于其他颜色空间这种自动转换可以保证内容在任何用户的屏幕上看起来一致正确。4.1 Uniforms 与 layout(color)Skia 和 SkSL 不知道你的uniform变量是否包含颜色因此不会自动对它们应用颜色转换。解决方案是用layout(color)声明layout(color)只能用于类型为vec3RGB或vec4RGBA的 uniform提供 uniform 数据时颜色应使用未预乘的 sRGB 颜色如果你想提供广色域颜色这些值可以超出[0, 1]范围——这与 Skia 在SkPaint上接收和存储颜色的方式一致当 SkSL 执行时Skia 会将该 uniform 值转换到工作颜色空间。从源码看这一行为对应SkRuntimeEffect::Uniform::Flags中的kColor_Flag值为0x2其注释明确写道声明了layout(color)的 uniform颜色应作为未预乘、扩展范围不裁剪的 sRGB即SkColor4f提供并会被自动转换为未预乘、扩展范围的工作空间颜色见 include/effects/SkRuntimeEffect.h。对比两种声明的效果对未标注的not_a_colorSkia 把原始浮点值直接喂给 SkSL因此执行时not_a_color始终是{1,0,0,1}与 surface 颜色空间无关会得到目标颜色空间中最鲜艳的红色而对标注了layout(color)的color起始为 sRGB 红执行时会被转换为 Rec. 2020 工作空间中表示同一颜色的值。整体效果是正确标注的 uniform 看起来更“暗”但这正是你想要的——标注为颜色的 uniform 无论目标 surface 处于什么颜色空间都代表同一一致的色彩。4.2 原始图片着色器Raw Image Shaders大多数图片包含应被色彩管理的颜色但也有些图片存储的数据并非颜色例如法线、材质属性粗糙度等、高度图或其他恰好存进图片的纯数学数据。在 SkSL 中使用这类图片时应使用raw image shader通过SkImage::makeRawShader创建见 include/core/SkImage.h。它与普通 image shader 行为相似包括过滤和平铺但有几点重大差异永远不会应用颜色空间转换图片的颜色空间被忽略alpha 类型为kUnpremul的图片不会被自动预乘不支持双三次过滤——调用makeRawShader请求双三次过滤会返回nullptr。示例创建一张球面法线贴图配合光照 shader 渲染到不同颜色空间。若用普通 image shader法线会被当作颜色转换到工作颜色空间从而被错误地改变最后一次绘制使用 raw image shader则返回原始法线完全忽略工作颜色空间。4.3 在已知颜色空间中工作在 SkSL shader 内部你并不知道工作颜色空间是什么。对很多效果来说这没问题——求值 image shader、做简单颜色运算通常会得到合理结果尤其当你知道应用的工作颜色空间总是 sRGB 时。但对某些效果在固定已知的颜色空间中做运算很重要。最常见的例子是光照物理精确的光照应当在线性颜色空间中进行。为此 SkSL 提供了两个内建函数vec3 toLinearSrgb(vec3 color); vec3 fromLinearSrgb(vec3 color);它们在当前工作颜色空间与线性 sRGB 颜色空间之间转换。该空间使用 sRGB 色域primaries和线性传递函数用扩展范围值低于 0.0、高于 1.0表示 sRGB 色域之外的值。这对应 Android 的LINEAR_EXTENDED_SRGB或 Apple 的extendedLinearSRGB。从源码看这两个内建函数定义在 src/sksl/sksl_public.sksl被标注为$pure并且是“不属于 GLSL 的 SkSL 内建函数”源码注释同样说明它们是“工作目标空间与固定已知空间之间的颜色空间转换”。在线实验里可以看到一个球体示例光照运算分别在工作空间sRGB与线性空间中进行对比两者差异。五、预乘 AlphaPremultiplied Alpha处理透明颜色时有**未预乘straight和预乘premultiplied**两种常见表示。在 Skia 流水线中每个SkShader返回的都是预乘颜色。如果你熟悉 OpenGL 混合可以从混合方程的角度理解对于常见的 alpha 混合source-over你通常会配置混合函数为(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA)而 Skia 将 source-over 混合定义为仿佛混合函数是(GL_ONE, GL_ONE_MINUS_SRC_ALPHA)——因为源颜色已经预乘了 alpha。Skia 使用预乘 alpha 意味着如果你从一张未预乘的SkImage如 PNG创建SkImageShader并求值它……得到的颜色是[R*A, G*A, B*A, A]不是[R, G, B, A]如果你的 SkSL 会返回透明颜色必须确保将RGB乘以A对于更复杂的 shader你必须清楚哪些颜色是预乘的、哪些是未预乘的。把两类颜色混在一起运算往往没有意义。正确预乘的颜色会随着 alpha 减小产生平滑的渐变而未预乘的颜色则会让渐变显示错误——随着 alpha 变化变得过亮并发生色相偏移。这也是 include/effects/SkRuntimeEffect.h 中MakeForShader注释强调“返回的颜色应为预乘”的原因。六、最小化 SkSLsksl-minify 工具Skia 自带一个最小化工具可自动减小 Runtime Effect 或 SkMesh 代码的体积。该工具会消除空白和注释缩短函数名与变量名删除未被引用的代码。官方示例显示一段 shader 代码最小化后可缩减到约原始大小的一半同时渲染结果完全相同。6.1 启用与构建要启用该工具在你的 gn 参数列表中添加skia_compile_modules true命令行中可通过gn args out/yourbuild访问参数或直接编辑文件out/yourbuild/args.gn然后用ninja重新编译 Skia编译完成后输出目录中会出现一个名为sksl-minify的新工具。6.2 命令行用法sksl-minify的调用形式如下输出路径在前输入路径在后sksl-minify output input [--frag|--vert|--compute|--shader|--colorfilter|--blender|--meshfrag|--meshvert] [dependencies...]各参数说明与 tools/sksl-minify/SkSLMinify.cpp 中的命令行解析逻辑对应输出路径第一个位置参数例如MyShader.minified.sksl输入路径第二个位置参数例如MyShader.sksl--stringify可选将最小化后的 SkSL 文本包装成一个带引号的 C 字符串。默认情况下输出文件包含纯 SkSL 文本文档示例代码中的最小化 shader 字符串就是用--stringify生成的。从源码看启用该选项时输出形如static constexpr char SKSL_MINIFIED_输入文件名[] ...见 tools/sksl-minify/SkSLMinify.cpp程序类型选项可选互斥--shader、--colorfilter、--blender、--meshfrag、--meshvert默认值是--shader。源码还额外支持--frag、--vert、--compute、--privshader等内部/调试选项且多个程序类型标志同时出现时报错并打印 usage。6.3 最小化 SkMesh 程序的注意事项当最小化一个 mesh 程序时你必须提供与SkMeshSpecification对应的struct Varyings和struct Attributes。这两个结构体会被从最小化后的程序中剔除方便使用——因为它们是经由SkMeshSpecification合成的。这一行为在源码中有明确实现对于 mesh 片段/顶点程序名为Attributes或Varyings的StructDefinition会被跳过而不输出见 tools/sksl-minify/SkSLMinify.cpp。七、从 C 侧创建 Runtime Effects理解了 SkSL 语言本身后C 侧的集成同样重要。SkRuntimeEffect是效果对象的“基类”而SkRuntimeEffectBuilder是简化创建过程的实用工具它帮你管理 uniform 数据块并提供对 uniform 变量和子着色器槽位的按名访问。其头文件中的用法示例include/effects/SkRuntimeEffect.hsk_spSkRuntimeEffect effect ...; SkRuntimeEffectBuilder builder(effect); builder.uniform(some_uniform_float) 3.14f; builder.uniform(some_uniform_matrix) SkM44::Rotate(...); builder.child(some_child_effect) mySkImage-makeShader(...); ... sk_spSkShader shader builder.makeShader(nullptr, false);要点调用makeShader/makeColorFilter/makeBlender时builder 会校验 SkSL 入口函数是否合法uniform(name)返回的赋值操作符不做类型转换——值的大小必须与效果期望的完全一致例如SkMatrix会按 3×3 布局写入见头文件中的重载否则 debug 构建会直接报错底层 uniform 数据通过SkData::MakeZeroInitialized(effect-uniformSize())分配uniformSize()返回所有uniform变量占用的总字节数见 include/effects/SkRuntimeEffect.hbuilder 完全构建在SkRuntimeEffect的公共 API 之上因此既可以原样使用也可以作为你自定义绑定接口的参考实现。此外SkRuntimeEffect还提供uniforms()、children()、findUniform(name)、findChild(name)等反射查询接口以及MakeTraced对 shader 在指定坐标生成执行轨迹用于调试仅支持光栅 canvas等高级能力可参考头文件完整声明。结语SkSL 是 Skia 流水线中的“函数贡献者”它不同于直接面对 GPU 的 GLSL而是嵌入 Skia 更大着色器图的一环。使用 Runtime Effects 时请牢牢把握三条主线坐标是局部的、颜色默认会被色彩管理、返回颜色必须是预乘的对于非颜色数据使用makeRawShader对于需要物理正确性的运算使用toLinearSrgb/fromLinearSrgb并用layout(color)标注真正表示颜色的 uniform。最后用sksl-minify在发布前压缩你的效果代码即可在保持渲染结果一致的同时显著减小体积。文中所涉 API 均为 Skia 公开接口可进一步阅读 include/effects/SkRuntimeEffect.h 与 site/docs/user/color.md、site/docs/user/coordinates.md 获取更完整的细节。赞分享图形学【免费下载链接】skiaSkia is a complete 2D graphic library for drawing Text, Geometries, and Images. See documentation for contribution instructions.项目地址https://gitcode.com/gh_mirrors/ski/skia点击查看免费下载相关推荐SkSL 着色语言完全指南Skia 内部着色语言的设计差异与同步原语解析SkSL 着色语言完全指南Skia 内部着色语言的设计差异与同步原语解析 导读 SkSLSkia Shading Language是 Skia 以 GLS图形学从代码到色彩Ghostty终端色彩管理的完整解析从代码到色彩Ghostty终端色彩管理的完整解析 你是否曾在终端中遇到过文字颜色模糊不清、背景与前景对比度不足的问题或者想要自定义终端主题却不知从何下手本桌面应用开发工具Ao与Microsoft To-Do的完美集成任务同步与数据管理Ao与Microsoft To Do的完美集成任务同步与数据管理 Ao是一款非官方的Microsoft To Do桌面应用它以优雅的界面设计和丰富的功能特性上一篇AndroidVideoCache混淆配置终极指南确保release版本正常工作的10个关键步骤下一篇Loop macOS 窗口管理教程3 步搞定第一个屏幕分屏布局创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考