NAVIEW-OBJECT フィルタ効果

フィールドや画像一覧の画像などには、カラー変換やドロップシャドウ、ぼかしなどのフィルタ効果を加える事ができます。フィルタは、例えば矩形ボタンのマウス・オーバー・イベントなどにコマンドで適用する事ができますので、変化のあるボタンの作成などに使用する事ができます。

【フィルタの種類】

NAVIEW-OBJECTのフィルタ効果には、「ぼかし」「ドロップシャドゥ」「カラー変換」「ベベル」「ブレンド」の5種類があります。

NAVIEW-OBJECTのフィルター効果

【フィルタの書式】

NAVIEW-OBJECTのフィルタは複数のフィルタを一行で指定する為、ターゲットとフィルタ毎を","(半角カンマ)で区切り、各フィルタのパラメータは":"(半角コロン)で区切ります。

フィールド設定でフィルタを設定する際は、フィールド設定の後に下記のように記述します。

  • //Filter Ft,TGT,COL,BLUR,SHADOW,BEVEL,BLEND
  • // FldImgを配置し、文字にシャドウ、画像にブラーフィルタをかける
  • FldImg1,Im,30,,10,40,20%,25%-30,,,,,,,,,,{COMM}/btn/sky.jpg,CFG
  • FldImg1,Ft,TXT,0::::,,4:4:4
  • FldImg1,Ft,IMG,,15:15,

イベント設定での書式は、下記のようになります。

  • //Event ,CmdTgt,CmdFldFilter,FldId,TGT,COL,BLUR,SHADOW,BEVEL,BLEND
  • // FldImgを全体的に緑にする
  • EvFldImgOver1 ,ME,CmdFldFilter,FldImg,ALL,:::::100,:
  • // FldImgの内文字に青いドロップシャドウを付ける例
  • EvFldImgOver1 ,ME,CmdFldFilter,FldImg,TXT,,,10:2:4:#0000CC:50:45:1

ここで"TGT"は、フィルタをかけるフィールド内の要素で、下記のALL/IMG/TXT/SCR/LIN/FILから選びます。

  • ALL:全体 (全フィールド)
  • IMG:画像 (画像フィールド)
  • TXT:テキスト(文字/矩形/画像フィールド)
  • SCR:スクロール (文字フィールド)
  • LIN:線 (線/矩形/画像文字フィールド)
  • BAK:背景 (矩形/画像フィールド)

"COL"以降は、フィルタの種類を表しています。必要なフィルタを下記の順で記述します。

  • COL:カラー変換
  • BLUR:ぼかしフィルタ
  • SHADOW:ドロップシャドウフィルタ
  • BEVEL:ベベルフィルタ
  • BLEND:ブレンドモード

※ ","(半角カンマ)で囲まれた位置のフィルタは使用されません。

※ ドロップシャドウとベベルは":"(半角コロン)だけあってもデフォルトのフィルタが働きます。

【カラー変換】

カラー変換は、画像やフィールド全体の色を、赤(r)、緑(g)、青(b)、アルファ透明度(a)の各カラーチャンネルの値を元に、乗算(a)と加算(b)で変換します。

上記の赤(r)/緑(g)/青(b)/アルファ(a) と乗算(a)/加算(b) で表記すると、"ra:ga:ba:aa:rb:gb:bb,ab"で指定しますが、乗算(a)は-100〜100、加算(b)は-255〜255で指定します。また各セクションを空欄とすると乗算(a)はデフォルト値として100が、加算(b)はデフォルト値として0が使用されます。

  • 書式 :ra:ga:ba:aa:rb:gb:bb,ab (*a:-100〜100 *b:-255〜255)
  •     [100:100:100:100:0:0:0:0]
  • 変化無し:100:100:100:100:0:0:0:0:0 (空欄または":::::::"も同じ)
  • 色の反転:-100:-100:-100:100:-255:-255:-255:0
  • 青を強調:100:100:100:100:0:0:100:0 ("::::::100:")
  • 半透明 :100:100:100:50:0:0:0:0 (":::50::::")

【ぼかしフィルタ】

ぼかしフィルタは画像やフィールド全体にぼかしをかけるフィルタです。左右もしくは/上下のみぼかしをかけると「移動ぼかし」になります。

  • 書式 :blurX:blurY:quality
  • blurX :左右方向ぼかし量(0〜255)[0]
  • blurY :上下方向ぼかし量(0〜255)[0]
  • quality:フィルタ回数(0〜15)[1]
  • 通常のぼかし :8:8:2
  • 左右移動ぼかし:10:0:1
  • 上下移動ぼかし:0:10:1

【ドロップシャドゥ・フィルタ】

ドロップシャドゥフィルタは影を付けるフィルタです。影の色と透明度、上下左右のぼかし量と移動量などを設定して影を付けることができます。

  • 書式 :blurX:blurY:dist:col:alpha:angle:quality:strength:inner:knockout:hide
  •     [4:4:4:#000000:70:45:1:1:OFF:OFF:OFF]
  • blurX:左右方向ぼかし量(0〜255)[4]
  • blurY:上下方向ぼかし量(0〜255)[4]
  • dist :オフセット量(0〜2880)[4]
  • col :影の色(#RRGGBB)[0x000000]
  • alpha:影の透明度(0〜100)[70]
  • angle:角度(0〜360)[45]
  • quality :フィルタ回数(0〜15)[1]
  • strength:強さ(0〜255)[1]
  • inner  :内部シャドウ(ON/OFF)[OFF]
  • knockout:ノックアウト効果(ON/OFF)[OFF]
  • hide  :ターゲット非表示(ON/OFF)[OFF]
  • 左上の黒い影  :4:4:4:#000000:75:225:1:1:OFF:OFF:OFF (4:4::::225)
  • 右下に長く青い影:10:10:4:#0000cc:50:45:1:1:OFF:OFF:OFF (10:10::#0000cc:50)
  • 影のみ表示   :10:10:0:#000000:50:45:1:1:OFF:OFF:ON (10:10:0::50:::::ON:ON)

【ベベル・フィルタ】

ベベル・フィルタは浮き彫りのようなハイライトと影を付けるフィルタです。ボタンなどを立体的に見せることが出来ます。また境界線に適用すると、額縁のような表現ができます。

  • 書式 :blurX:blurY:dist:lightc:lighta:shadowc:shadowa:angle:quality:strength:type:knockout
  •     [4:4:4:#ffffff:40:#000000:70:45:1:1:OFF:OFF:OFF]
  • blurX:左右方向ぼかし量(0〜255)[4]
  • blurY:上下方向ぼかし量(0〜255)[4]
  • dist :オフセット量(0〜2880)[4]
  • lightc :ハイライトの色(#RRGGBB)[0xffffff]
  • lighta :ハイライトの透明度(0〜100)[40]
  • shadowc:影の色(#RRGGBB)[0x000000]
  • shadowa:影の透明度(0〜100)[70]
  • angle :角度(0〜360)[45]
  • quality :フィルタ回数(0〜15)[1]
  • strength:強さ(0〜255)[1]
  • type   :タイプ(inner/outer/ful)[inner]
  • knockout:ノックアウト効果(ON/OFF)[OFF]
  • 立体的ボタン:0:0:4:#ffffff:40:#000000:70:45:1:1:inner:OFF (0:0)

【ブレンド】

「ブレンド」はフィルタとして指定しますが、画像処理ソフトのレイヤに対する「ブレンドモード」と同等で、背景や他のフィールドと重なった部分の複合イメージの作成に用います。

ブレンドは"normal"、"difference"など、下記の文字列で指定します。

  • ブレンド指定: normal layer multiply screen lighten darken difference add subtract invert alpha erase overlay hardlight

詳細な説明はFlashの解説ページを参照して下さい。

NAVIEW-OBJECT ブレンド
CMS+FLASHのWEBシステム 写KIT

NAVIEW-OBJECT