スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

カテゴリ : スポンサー広告

KAGEX講座(25) - 選択肢設定([selopt])

前回 KAGEX講座(24) - 選択肢表示([select], [seladd])
選択肢の設定を色々変えてみます。

選択肢の設定には[selopt]タグを使います。
このタグには様々な属性があります。
[selopt]の設定は設定を変えるまで何度選択肢を表示しても有効です。

ボタン設定
@道路
@selopt selectwidth=400 selectheight=80 selectbasecolor=0xFF0000 selectcolor=0x00FF00

*START
@cm
選択肢を表示します。[p][r]

@seladd text=選択肢1 target=*SELECTED
@seladd text=選択肢2 target=*SELECTED
@seladd text=選択肢3 target=*SELECTED
@select

*SELECTED
@cm
戻ります。[p][r]
@jump target=*START
selectwidthで選択肢ボタンの幅、selectheightで選択肢ボタンの高さ、selectcolorで選択肢の文字色、selectbasecolorで選択肢ボタンの色が設定できます。
selopt_1.png

領域設定
前回も言いましたが、KAGEXの選択肢はメッセージレイヤ上にではなく専用のレイヤ上に配置されます。
その専用のレイヤ(以下、領域レイヤ)の位置や大きさも設定できます。
領域レイヤは透明で見えませんが、デフォルトでは画面と同じ大きさになっています。
@道路
@selopt left=120 top=80 width=400 height=320 selectwidth=300 selectheight=50

*START
@cm
選択肢を表示します。[p][r]

@seladd text=選択肢1 target=*SELECTED
@seladd text=選択肢2 target=*SELECTED
@seladd text=選択肢3 target=*SELECTED
@select

*SELECTED
@cm
戻ります。[p][r]
@jump target=*START
leftで領域レイヤの左端、topで上端、widthで幅、heightで高さを設定します。
この画像ではわかりやすいように選択肢領域レイヤの範囲を緑色で塗っています。
selopt_2.png
領域レイヤは選択肢ボタンの表示する範囲になります。
選択肢ボタンはその数に合わせて領域レイヤの中で中央寄せされて配置されます。
選択肢ボタンの位置を1つずつ指定する必要はなく、選択肢を表示する範囲を指定するだけで勝手に配置してくれるわけです。

画像を使う
選択肢ボタンに画像を使うこともできます。
今回は↓の画像を「selopt_button.png」として使います。
「通常の状態」「ボタンが押された状態」「ボタンの上にマウスカーソルがある状態」が並んだボタン用の画像です。
selopt_button.png
@道路
@selopt graphic=selopt_button
*START
@cm
選択肢を表示します。[p][r]

@seladd text=選択肢1 target=*SELECTED
@seladd text=選択肢2 target=*SELECTED
@seladd text=選択肢3 target=*SELECTED
@select

*SELECTED
@cm
戻ります。[p][r]
@jump target=*START
画像ファイルをgraphic属性に指定します。
選択肢の文字は画像の中央に表示されます。
selopt_3.png

graphic属性以外の属性でも画像を指定できます。
↓の三枚をそれぞれ「selopt_button_normal」「selopt_button_on」「selopt_button_over」として使います。
先ほどのボタン画像を三枚に分割しただけです。
selopt_button_normal.png
selopt_button_on.png
selopt_button_over.png
@道路
@selopt normal=selopt_button_normal over=selopt_button_over on=selopt_button_on
*START
@cm
選択肢を表示します。[p][r]

@seladd text=選択肢1 target=*SELECTED
@seladd text=選択肢2 target=*SELECTED
@seladd text=選択肢3 target=*SELECTED
@select

*SELECTED
@cm
戻ります。[p][r]
@jump target=*START
normal属性に通常時の画像、over属性にマウスオーバー時の画像、on属性にボタンが押されたときの画像を指定します。
graphic属性とは異なり一枚ずつ別々に指定できるので便利です。
動作画面はgraphicの例と全く同じになります。

その他にも様々な属性があるのですが、それはまた別の場で紹介します。

次回 KAGEX講座(26) - メッセージ操作([eraftername])
スポンサーサイト

タグ : 吉里吉里 KAGEX 講座

カテゴリ : KAGEX

コメントの投稿

非公開コメント

最新記事
カテゴリ

openclose

記事一覧
Twitter
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。