Up to date
This page is up to date for Godot 4.2.
If you still find outdated information, please open an issue.
Using VisualShaders¶
VisualShaders are the visual alternative for creating shaders.
シェーダーは本質的にビジュアルにリンクされているため、テクスチャ、マテリアルなどのプレビューを使用したグラフベースのアプローチは、純粋にスクリプトベースのシェーダーと比較してさらに多くの利便性を提供します。一方、VisualShaderはシェーダースクリプトのすべての機能を公開するわけではなく、特定の効果のために両方を同時に使用する必要がある場合があります。
注釈
If you are not familiar with shaders, start by reading Introduction to shaders.
VisualShader(ビジュアルシェーダー)の作成¶
VisualShaderは、任意の ShaderMaterial で作成できます。 VisualShaderの使用を開始するには、選択したオブジェクトに新しい ShaderMaterial を作成します。
次に、VisualShader リソースを Shader プロパティに割り当てます。
Click on the new Shader resource and the Create Shader dialog will
open automatically. Change the Type option to VisualShader in the dropdown.
The layout of the Visual Shader Editor comprises two parts: the upper toolbar and the graph itself.
ツールバーの左から右へ:
ノードを追加...ボタンは、シェーダーグラフにノードを追加できるポップアップメニューを表示します。ドロップダウンメニューは、シェーダータイプ(頂点、フラグメント、Light)です。スクリプトシェーダーの場合と同様に、使用可能なビルトインノードを定義します。
次のボタンと数値入力は、ズームレベル、グリッドスナップ、グリッドライン間の距離(ピクセル単位)を制御します。
最後のアイコンは、グラフに対応する生成されたシェーダーコードを示しています。
注釈
VisualShaderはコーディングを必要としませんが、スクリプトシェーダーと同じロジックを共有します。シェーディングパイプラインを十分に理解するために、両方の基本を学ぶことをお勧めします。
ビジュアルシェーダーグラフは、背後でスクリプトシェーダーに変換されます。ツールバーの最後のボタンを押すと、このコードを表示できます。これは、特定のノードが何をするか、スクリプトでそれを再現する方法を理解するのに便利です。
ビジュアルシェーダーエディタの使用¶
デフォルトでは、すべての新しい VisualShader には出力ノードがあります。すべてのノード接続は、出力ノードのソケットの1つで終了します。ノードは、シェーダーを作成するための基本単位です。新しいノードを追加するには、左上隅の[ノードの追加]ボタンをクリックするか、グラフ内の空の場所を右クリックすると、メニューがポップアップ表示されます。
このポップアップには次のプロパティがあります。
グラフを右クリックすると、このメニューがカーソル位置で呼び出され、作成されたノードもその場合、その位置の下に配置されます。それ以外の場合は、グラフの中心に作成されます。
水平および垂直にサイズを変更して、より多くのコンテンツを表示できます。サイズ変換とツリーコンテンツの位置は呼び出し間で保存されるため、ポップアップを突然閉じた場合は、以前の状態を簡単に復元できます。
ドロップダウンオプションメニューの[すべて展開]および[すべて折りたたむ]オプションを使用して、使用可能なノードを簡単にリストできます。
また、ポップアップからグラフにノードをドラッグアンドドロップすることもできます。
ポップアップにはカテゴリに分類されたノードがありますが、最初は圧倒されるように見えます。いくつかのノードを追加し、それらを出力ソケットに接続して、何が起こるかを観察してください。
いずれかの scalar 出力を vector 入力に接続すると、ベクトルのすべての要素がスカラーの値を取ります。
vector 出力を scalar 入力に接続すると、スカラーの値はベクトルの要素の平均になります。
Visual Shader node interface¶
Visual shader nodes have input and output ports. The input ports are located on the left side of the node, and output ports are located on the right side of the node.
These ports are colored to differentiate type of port:
タイプ(型) |
色 |
説明 |
例 |
|---|---|---|---|
Scalar |
Cyan |
Scalar is a single value. |
|
Vector |
Purple |
Vector is a set of values. |
|
Boolean |
Blue |
On or off, true or false. |
|
トランスフォーム |
Orange |
A matrix, usually used to transform vertices. |
|
Sampler |
Yellow |
A texture sampler. It can be used to sample textures. |
|
All of the types are used in the calculations of vertices, fragments, and lights in the shader. For example: matrix multiplication, vector addition, or scalar division.
There are other types but these are the main ones.
ビジュアルシェーダーノード¶
以下は、知っておく価値のある特別なノードです。このリストは完全なものではなく、より多くのノードと例で展開される場合があります。
式ノード(Expression Node)¶
Expression ノードを使用すると、ビジュアルシェーダー内にGodot Shading Language(GLSLのような)式を記述できます。ノードには、必要な量の入力ポートと出力ポートを追加するボタンがあり、サイズを変更できます。各ポートの名前とタイプを設定することもできます。入力した式は、すぐにマテリアルに適用されます(フォーカスが式テキストボックスを離れると)。解析エラーまたはコンパイルエラーは、[出力]タブに出力されます。出力はデフォルトでゼロ値に初期化されます。このノードは[Special]タブの下にあり、すべてのシェーダーモードで使用できます。
このノードの可能性はほとんど無限です。複雑な手順を記述し、ループ、discard キーワード、拡張タイプなどのテキストベースのシェーダーのすべての機能を使用できます。次に例を示します:
フレネルノード¶
Fresnel ノードは、法線ベクトルとビューベクトルを受け入れ、それらの間の飽和ドット積であるスカラーを生成するように設計されています。さらに、反転と方程式の力を設定できます。``Fresnel``ノードは、オブジェクトに縁取りのような照明効果を追加するのに最適です。
ブール型ノード¶
Boolean ノードは Scalar または Vector に変換して 0 または 1 および '0, 0, 0) または (1, 1, 1, ) を表すことができます。このプロパティを使用すると、一部のエフェクトパーツをワンクリックで有効または無効にできます。
ifノード¶
If ノードを使用すると、a と b の比較結果を返すベクトルを設定できます。返される可能性のあるベクトルは3つあります: a == b (この場合、許容範囲パラメーターは比較のしきい値として提供されます - デフォルトでは最小値、つまり 0.00001``に等しい)、\ ``a> b および a <b です。
スイッチノード(Switch node)¶
Switch ノードは、ブール条件が true または false の場合にベクトルを返します。Boolean は、上記で導入されました。ベクトルを真(true)のブール値に変換する場合、ベクトルのすべての要素はゼロより上でなければなりません。
