SkSL Filter

简介

使用 SkSL（“Skia Shading Language”）编写自定义 Filters。

Example SkSL Filters. Photo by Davies Designs Studio on Unsplash.

SkSL（“Skia Shading Language”）是 GLSL 的一种变体，用作 Skia 的内部着色语言。只需进行少量修改，来自 https://www.shadertoy.com/ 等站点的 GLSL 代码即可转换供 Cavalry 使用。

有关 GLSL 和 SkSL 之间差异的更多详细信息，请参阅 Skia documentation。

SkSL Filter 不接受整数 uniform，请改用浮点数。

UI

Blend Mode - 参见 Blend Modes。

Filter Code - 在此处编写/粘贴/编辑 SkSL 代码。

Padding - 当 Filter 生成的像素超出原始 Shape 的边界时，可用于扩展它。

Inputs - 点击 + 按钮选择 uniform 类型并添加。Uniform 可以通过右键点击属性并选择 Rename… 来重命名。此名称可在 Filter Code 中用作变量。

Export to Plugin

点击 Export to Plugin... 加载导出窗口，可用于将 Layer 导出为 Plugin。

Author - 设置用于填充 definitions.json 中 "author" 键的字符串。此字段在会话之间保留。

Plugin Name - 设置用于填充 strings.json 中 "niceName" 键的字符串

Encrypt - 选中时，导出的文件将被加密。

Export… - 点击 Export 选择文件导出位置。Author 和 Plugin Name 字段是必需的。

请注意，可能需要对导出的文件进行一些调整。例如，可能需要添加图标、工具提示等。

Built in Uniforms

内置 Uniforms 可以添加到 Filter Code 中：

必需

layer - 在此 shader 对象上调用 eval(float2) 来采样 Shape。必须在 Filter 代码顶部包含 uniform shader layer;。

可选

resolution - 正在渲染的 Shape 大小，可用于生成随其内容缩放的 Filters。参见 Create > Demo Scenes > Custom Shaders and Filters > Emboss Filter 中的示例。

在 Create > Demo Scenes > Custom Shaders and Filters > 中查看以下示例：

Emboss Filter
Green Screen Filter
Scatter Filter

创建一个 Rectangle。
创建一个 SkSL Filter。
将以下内容粘贴到 Filter Code 中：

uniform shader layer;half random(half2 co) {    return fract(sin(dot(co, half2(12.9898, 78.233))) * 43758.5453);}half2 randomOffset(half2 p) {    half angle = random(p) * 6.283185;      half radius = random(p + half2(1.0, 1.0)) * n0;    return half2(cos(angle) * radius, sin(angle) * radius);}half4 main(float2 p) {    half2 baseOffset = randomOffset(p);    return layer.eval(p + baseOffset);}

连接 skslFilter.id→rectangle.filters。
增加 SkSL Filter 的 n0 和 Padding 属性。

这将创建一个 Scatter 效果