Blur Effect 2D エフェクトを使用する¶
Blur Effect 2D エフェクトを使用して、2Dノードにガウスぼかしを適用します。
Blur Effect 2D エフェクトの使用方法を学ぶには、チュートリアルを完了してください。チュートリアル: ガウスぼかし効果を作成する を参照してください。
2Dノードにぼかし効果を作成する¶
2Dノードにぼかし効果を作成するには、以下のようにします。
Library Alt を押しながら右クリック Effects で、Blur Effect 2D を選択します。
Node Tree または Prefabs で、ぼかし効果を適用したい2Dノードを作成します。
Library > Effects > 2D Effects から Blur Effect 2D エフェクトを Node Tree または Prefabs にドラッグし、ぼかし効果を適用したい 2D ノードにドロップします。
この方法で、その2Dノードに Effect Prefab プロパティを Blur Effect 2D エフェクトに設定します。
Library で Blur Effect 2D エフェクトを選択し、Properties で Blur Effect 2D プロパティを追加して設定します。
Blur Radius は、互いにブレンドするピクセルの円形領域の半径を定義することによって、ぼかしの量を設定します。デフォルトの半径は8ピクセルです。
このプロパティは、Masked Blur プロパティを有効にしない限り、ノードの境界でレンダーエリアをぼかしが拡張するピクセル単位の距離も決定します。
Blur Quality は、ぼかしの視覚的な品質を設定します。低品質は、計算およびメモリリソースをより少なく使用します。
Masked Blur は、アルファチャンネルの値がゼロでないピクセルのみをぼかすかどうかを設定します。
このプロパティを有効にすると、ぼかしが完全に透明なピクセルに広がらず、コンテンツのエッジがシャープなままになります。
ぼかし効果のインスタンスをカスタマイズする¶
Library > Effects でエフェクトのプロパティを編集すると、そのエフェクトを使用するすべてのノードの外観が変更されます。エフェクトのプロパティ値をオーバーライドすることで、各エフェクトインスタンスをカスタマイズできます。例えば：
Shadow Effect 2D エフェクトを作成する際、そのエフェクトの異なるインスタンスで影の柔らかさを変えることができます。
Mask Effect 2D エフェクトを作成する際、そのエフェクトの異なるインスタンスでマスクのサイズを変えることができます。
Blur Effect 2D エフェクトを作成する際、そのエフェクトの異なるインスタンスでぼかしの量を変えることができます。
Outline Effect 2D エフェクトを作成する際、そのエフェクトの異なるインスタンスでアウトラインの色を変えることができます。
エフェクトのインスタンスをカスタマイズするには:
エフェクトを作成し、ノードをそれに使用するように設定します。
例えば、Shadow Effect 2D エフェクトを作成し、Image ノードにそれを使用するように設定します。2Dノードにシャドウ効果を作成する を参照してください。
エフェクト内のプロパティをカスタマイズする:
Library で、作成したエフェクトを選択します。カスタマイズしたいプロパティの隣にある Properties で、
をクリックします。Kanzi Studio はそのプロパティからカスタムプロパティを作成し、それをエフェクトプレハブのルートに追加し、2Dエフェクト内のプロパティに
##Templateバインディングを作成します。例えば、Shadow Blur Radius プロパティの隣にある
をクリックします。Kanzi Studio はカスタム Shadow Blur Radius プロパティを作成し、それをルートエフェクトプレハブに追加し、Shadow Effect 2D エフェクトプレハブ内にカスタム Shadow Blur Radius プロパティへの ##Templateバインディングを作成します。
Node Tree または Prefabs で、作成したエフェクトを使用する2Dノードを選択します。Properties で、カスタマイズしたプロパティの横にある
をクリックし、プロパティの値を設定します。Kanzi Studio は2Dノードに To Source バインディングを追加し、そのプロパティの値をノードの
Node2D.Effectプロパティを通じて利用可能なエフェクトインスタンスにプッシュします。複数の2Dノードに同じエフェクトを設定することができ、各2Dノードでプロパティを追加して異なる値を設定することができます。
例えば、Properties で、Shadow Effect 2D Properties > ShadowEffect2D.BlurRadius プロパティを追加し、Image ノードでのみ影の柔らかさを調整するために使用します。
（オプション） カスタマイズしたい各エフェクトプロパティに対して、前のステップを繰り返します。
ヒント
ノードからプロパティとその To Source バインディングを削除したい場合は、そのプロパティを右クリックして Remove Property And Binding を選択します。
Blur Effect 2D エフェクトをAPIで使用する¶
ぼかし効果を作成するには、以下の手順に従います。
// Create a blur effect template.
NodeEffectTemplate2DSharedPtr blurEffectTemplate =
NodeEffectTemplate2D::create(BlurEffect2D::getStaticMetaclass()->getName(), "BlurEffect");
// Set the value of the RadiusProperty in the blur effect template.
// RadiusProperty defines the amount of blur.
blurEffectTemplate->addPropertyValue(BlurEffect2D::RadiusProperty, Variant(6.f));
// Create a blur effect prefab.
NodeEffectPrefab2DSharedPtr blurEffectPrefab =
NodeEffectPrefab2D::create(getDomain(), "BlurEffect prefab", blurEffectTemplate);
// Assign the blur effect to a 2D node.
node2d->setEffectPrefab(blurEffectPrefab);
// Get the node-specific effect instance created from the assigned prefab.
BlurEffect2DSharedPtr blurEffect = dynamic_pointer_cast<BlurEffect2D>(node2d->getEffect());
// Set the MaskedProperty to true. Masked mode maintains the original alpha channel and
// prevents the blur from spreading to fully transparent pixels.
blurEffect->setMasked(true);
詳細については、BlurEffect2D クラスを参照してください。