空想曲線

吉里吉里2/KAG3でのゲーム制作に使える小ネタ置き場。ゲーム用素材も置いてます。

吉里吉里/KAG:adjustGammaで画像の明度を調整する  

2016-08-27
2017-06-14
cm0
tb0

吉里吉里/KAG ちょいネタシリーズ。

テキストリンクにカーソルが乗っているときだけ画像の明度を上げ
それ以外は画像の明度を下げて表示するスクリプトを書いていきます。
昔のエントリ「oneterを使って遊んでみた」で書いたことのある小ネタなのですが
到底、実用に耐えうるものではなかったので、再度、組み直してきました。
今回は Layer クラスの adjustGamma メソッドを利用しています。


まずはマクロを定義します。

*macro
; キャラ表示(選択肢使用時)
[ macro name=charaLinkImg ]
[ image * storage=%sto pos=%pos layer=%lay visible=1 rceil=100 gceil=100 bceil=100 ]
[ endmacro ]

; キャラ表示(通常)
[ macro name=charaImg ]
[ image * storage=%sto pos=%pos layer=%lay visible=1 ]
[ endmacro ]

次に link タグの onenter, onleave 属性に使用する関数を作ります。

[ iscript ]

/* 画像を読み込ませる関数 */

function onImg(num,elm)
 {
  kag.fore.layers[num].loadImages(%[storage:elm]);
  // 指定した前景レイヤに画像を読み込ませる
 }

/* 画像の輝度を下げる関数 */
function offImg(num)
 {
  kag.fore.layers[num].adjustGamma(,,100,,,100,,,100);
  // 指定した前景レイヤの赤・緑・青の輝度を100に
  // charaLinkImgマクロのrceil,gceil,bceilの数値と同じにしてください
 }

[ endscript ]

準備はこれで終わりです。それではスクリプトを書いていきましょう。

*001

; 背景画像を読み込む
[ image storage=bg_base layer=base ]

; キャラ画像を読み込ませる

; 左のキャラ:前景レイヤ0
[ charaLinkImg sto=c_l pos=left lay=0 ]

; 真ん中のキャラ:前景レイヤ1
[ charaLinkImg sto=c_c pos=center lay=1 ]

; 右のキャラ:前景レイヤ2
[ charaLinkImg sto=c_r pos=right lay=2 ]

; メッセージレイヤ0の設定
[ position layer=message0 top=320 height=150 ]

誰に話を聞きますか?[ r ]
[ nowait ]

; onImg()の引数 num にはキャラを読み込ませているレイヤ番号、elm には画像ファイル名を書く
; offImg()の引数 num にはキャラを読み込ませているレイヤ番号を書く
[ link target=*002 onenter="onImg(0,'c_l')" onleave="offImg(0)" ]星の精霊[ endlink ][ r ]
[ link target=*003 onenter="onImg(1,'c_c')" onleave="offImg(1)" ]火の精霊[ endlink ][ r ]
[ link target=*004 onenter="onImg(2,'c_r')" onleave="offImg(2)" ]花の精霊[ endlink ]

[ endnowait ]
[ s ]

実行すると以下のような画面になります。キャラ画像はすべて暗く表示されます。

kag045_001.jpg
※背景素材は「誰そ彼亭」さまより、キャラ素材は「SUGAR STAR」さまよりお借りしました

テキストリンクにマウスカーソルを乗せると選んだキャラが明るく表示されます。
マウスカーソルが外れると再び暗く表示されます

▼星の精霊(左のキャラ)にマウスカーソルが乗ったとき
kag045_002.jpg

▼火の精霊(真ん中のキャラ)にマウスカーソルが乗ったとき
kag045_003.jpg

▼花の精霊(右のキャラ)にマウスカーソルが乗ったとき
kag045_004.jpg

*002
[ cm ]
; キャラ画像を読み込む
[ charaImg sto=c_l pos=left lay=0 ]
星の精霊を選びました。[ s ]

*003
[ cm ]
[ charaImg sto=c_c pos=center lay=1 ]
火の精霊を選びました。[ s ]

*004
[ cm ]
[ charaImg sto=c_r pos=right lay=2 ]
花の精霊を選びました。[ s ]

▼星の精霊を選んだときの実行画面
kag045_005.jpg

キャラ画像の明度をスクリプトで制御するため、差分を準備する手間が省けるのがメリットです。
関数もたいして難しいことは書いていませんので導入も容易だと思われます。
adjustGamma メソッドについては吉里吉里2リファレンスの Layer クラスの項を参照してください。

今回は書いていませんが、関数 onImg() の loadImags の storage を引数で指定するのが面倒なときは

var file = kag.fore.layers[num].Anim_loadParams.storage;

と、該当レイヤに読み込まれている画像ファイル名を取得して変数に格納。でもって

kag.fore.layers[num].loadImages(%[storage:file]);

と書くと少しラクちんになります。では今回はこれにてー (´∀`*)ノシ


関連記事

コメント

コメントの投稿

Secret

トラックバック

トラックバックURL
→http://kopacurve.blog33.fc2.com/tb.php/426-4723163b
この記事にトラックバックする(FC2ブログユーザー)

Author

Recent

Category

Link

Comment

Mailform

Twitter