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 效果