AirNovel - スライドバー
をテンプレートにして作成
[
ホーム
|
一覧
|
単語検索
|
最終更新
|
ヘルプ
]
開始行:
*AirNovel - スライドバー [#h05cb844]
- 調整ツマミ
- 公式サンプルのようなcssではなく、pluginとAirNovelスクリ...
適当に作ってみました。上手く動作しなかったらごめんなさい。
自由に改変してください。
公式サンプルのを参考にした方がいいかもしれません。
----
#contents
** スライドバー用のスクリプト [#a95dd6d9]
#ref(SlidebarTag.as)
- ビルド方法等は[[AirNovel - プラグイン]]参照。
*** [add_slidebar]タグ [#e75c2fb6]
/**
* スライドバーを追加する
*
* @note [add_slidebar]
* layer : [必須] スライドバーを判定するレイヤー
* align : [必須] どちらの方向へスライドバーがあるか...
* left : [alignがleft, rightの場合は必須] スライド...
* right : [alignがleft, rightの場合は必須] スライド...
* top : [alignがtop, bototmの場合は必須] スライド...
* bottom: [alignがtop, bototmの場合は必須] スライド...
* default : [defaultかdefault_pどちらか必須]デフォ...
* default_p : [defaultかdefault_pどちらか必須]デフ...
* page : レイヤーのどちらのページを使うか[fore, ba...
*/
*** [del_slidebar]タグ [#g17b7392]
/**
* スライドバーを削除する
*
* @note [del_slidebar]
* layer : [必須] スライドバーを判定するレイヤー
*/
*** [slidebar_pos]タグ [#t41a6b10]
/**
* スライドバーの座標を取得する
*
* @note [slidebar_pos]
* layer : [必須] スライドバーを判定するレイヤー
* name : [必須] 保存変数名
*/
*** [slidebar_percent]タグ [#e6d829ab]
/**
* スライドバーのパーセンテージを取得する
*
* @note [slidebar_percent]
* layer : [必須] スライドバーを判定するレイヤー
* name : [必須] 保存変数名
*/
** 使用例(マクロ込み) [#ud2a95fd]
- 引数多いのは勘弁
;//----------------------------------------------------...
;/**
; * スライドバーをセットアップ
; *
; * @param[ in ] base_layer : [必須]ベース画像用grpレ...
; * @param[ in ] button_layer : [必須]ツマミ画像用grpレ...
; * @param[ in ] align : [必須] どちらの方向へス...
; * @param[ in ] left : [alignがleft, rightの場...
; * @param[ in ] right : [alignがleft, rightの場...
; * @param[ in ] top : [alignがtop, bototmの場...
; * @param[ in ] bottom : [alignがtop, bototmの場...
; * @param[ in ] default : [defaultかdefault_pどち...
; * @param[ in ] default_p : [defaultかdefault_pどち...
; * @param[ in ] base_center : [必須]ベース画像の配置...
; * @param[ in ] base_middle : [必須]ベース画像の配置...
; * @param[ in ] base_pic : [必須]ベース画像
; * @param[ in ] button_pic : [必須]ボタン画像
; */
;//----------------------------------------------------...
[macro name="SlidebarSetup"]
; [plugin] スライドバーの設定
[add_slidebar * layer="&mp:base_layer" page=fore]
[lay layer="&mp:base_layer" visible=true b_alpha=0]
[lay layer="&mp:button_layer" page=fore visible=true ...
; ベース画像を設定(この表示エリアで当たり判定が取ら...
[lay layer="&mp:base_layer" page=fore join=true fn="&...
center="&mp:base_center" middle="&mp:base_middle"]
; ボタン画像を設定
[let name="tmp:pos" text="0"]
[slidebar_pos layer="&mp:base_layer" name="tmp:pos"]
[lay layer="&mp:button_layer" page=fore join=true fn=...
center="&tmp:pos" middle="&mp:base_middle"
cond="mp:align == 'left' || mp:align == 'right'"]
[lay layer="&mp:button_layer" page=fore join=true fn=...
center="&mp:base_center" middle="&tmp:pos"
cond="mp:align == 'top' || mp:align == 'bottom'"]
[endmacro]
;//----------------------------------------------------...
;/**
; * スライドバーを削除
; *
; * @param[ in ] base_layer : [必須]ベース画像用grpレ...
; * @param[ in ] button_layer : [必須]ツマミ画像用grpレ...
; */
;//----------------------------------------------------...
[macro name="SlidebarFinish"]
[del_slidebar layer="&mp:base_layer" page=fore]
[clear_lay layer="&mp:base_layer"]
[clear_lay layer="&mp:button_layer"]
[endmacro]
;//----------------------------------------------------...
;/**
; * スライドバーを更新
; *
; * @param[ in ] base_layer : [必須]ベース画像用grpレ...
; * @param[ in ] button_layer : [必須]ツマミ画像用grpレ...
; * @param[ in ] align : [必須] どちらの方向へス...
; * @param[ in ] center : [alignがtop, bottomの場...
; * @param[ in ] middle : [alignがleft, rightの場...
; * @param[ in ] var : 使用する一時変数名
; * @param[ in ] var_num : varの変数の中身
; */
;//----------------------------------------------------...
[macro name="SlidebarUpdate"]
[let name="tmp:pos" text="0"]
[let name="tmp:last_pos" text="-1"]
[let name="tmp:last_pos" text="&mp:var_num" cond="mp:...
[slidebar_pos layer="&mp:base_layer" name="tmp:pos"]
; 前回から変更が無ければ何もしない(処理負荷対策)
[let name="&mp:var" text="&tmp:pos"]
[return cond="(tmp:pos - tmp:last_pos) == 0"]
; レイヤー自体を移動させる。
[lay layer="&mp:button_layer" center="&tmp:pos" middl...
[lay layer="&mp:button_layer" center="&mp:center" mid...
[endmacro]
; 必要なレイヤーの生成
[add_lay layer="option_bgm_slidebar_base" class="grp"]
[add_lay layer="option_bgm_slidebar_button" class="grp"]
[add_lay layer="option_se_slidebar_base" class="grp"]
[add_lay layer="option_se_slidebar_button" class="grp"]
[add_lay layer="option_text_speed_slidebar_base" class=...
[add_lay layer="option_text_speed_slidebar_button" clas...
[add_lay layer="option_automode_speed_slidebar_base" cl...
[add_lay layer="option_automode_speed_slidebar_button" ...
[add_lay layer="option_window_alpha_slidebar_base" clas...
[add_lay layer="option_window_alpha_slidebar_button" cl...
; 初期設定
; BGM
[SlidebarSetup base_layer="option_bgm_slidebar_base" bu...
align="right" left=100 right=400 default_p=100 base...
base_pic="slidebar_base" button_pic="slidebar_butto...
; SE
[SlidebarSetup base_layer="option_se_slidebar_base" but...
align="right" left=100 right=400 default_p=100 base...
base_pic="slidebar_base" button_pic="slidebar_butto...
; TextSpeed
[SlidebarSetup base_layer="option_text_speed_slidebar_b...
align="right" left=100 right=400 default_p=100 base...
base_pic="slidebar_base" button_pic="slidebar_butto...
; AutomodeSpeed
[SlidebarSetup base_layer="option_automode_speed_slideb...
align="right" left=100 right=400 default_p=100 base...
base_pic="slidebar_base" button_pic="slidebar_butto...
; WindowAlpha
[SlidebarSetup base_layer="option_window_alpha_slidebar...
align="right" left=100 right=400 default_p=100 base...
base_pic="slidebar_base" button_pic="slidebar_butto...
; 更新用のイベント生成
[event key="enter_frame" call=true label=*SlidebarButto...
[s]
;//----------------------------------------------------...
;/// スライドバーのツマミ位置更新
;//----------------------------------------------------...
*SlidebarButtonUpdate
[let name="tmp:percent" text="0"]
; BGM
[SlidebarUpdate
base_layer="option_bgm_slidebar_base" button_laye...
middle=100 var="tmp:option_bgm_slidebar_pos" var_...
; パーセンテージの取得
[slidebar_percent layer="option_bgm_slidebar_base" na...
; ここで設定を行う
; [let name="hogehoge" text="&tmp:percent"]
; SE
[SlidebarUpdate
base_layer="option_se_slidebar_base" button_layer...
middle=200 var="tmp:option_se_slidebar_pos" var_n...
; TextSpeed
[SlidebarUpdate
base_layer="option_text_speed_slidebar_base" butt...
middle=300 var="tmp:option_text_speed_slidebar_po...
; AutomodeSpeed
[SlidebarUpdate
base_layer="option_automode_speed_slidebar_base" ...
middle=400 var="tmp:option_automode_speed_slideba...
; WindowAlpha
[SlidebarUpdate
base_layer="option_window_alpha_slidebar_base" bu...
middle=500 var="tmp:option_window_alpha_slidebar_...
[return]
** やってること [#leb16e59]
- プラグインで、指定レイヤーのクリックされているマウス座...
- AirNovelスクリプトでループを回してマウス座標を取得[slid...
** 何か [#c0cd5dfd]
- ベース、ツマミは固定画像のみになります。([button enable...
** 使用した画像データサンプル [#gecdab70]
- slidebar_base : スライドバーの下地。当たり判定領域。
#ref(slidebar_base.png)
- slidebar_button : スライドバーのツマミ
#ref(slidebar_button.png)
終了行:
*AirNovel - スライドバー [#h05cb844]
- 調整ツマミ
- 公式サンプルのようなcssではなく、pluginとAirNovelスクリ...
適当に作ってみました。上手く動作しなかったらごめんなさい。
自由に改変してください。
公式サンプルのを参考にした方がいいかもしれません。
----
#contents
** スライドバー用のスクリプト [#a95dd6d9]
#ref(SlidebarTag.as)
- ビルド方法等は[[AirNovel - プラグイン]]参照。
*** [add_slidebar]タグ [#e75c2fb6]
/**
* スライドバーを追加する
*
* @note [add_slidebar]
* layer : [必須] スライドバーを判定するレイヤー
* align : [必須] どちらの方向へスライドバーがあるか...
* left : [alignがleft, rightの場合は必須] スライド...
* right : [alignがleft, rightの場合は必須] スライド...
* top : [alignがtop, bototmの場合は必須] スライド...
* bottom: [alignがtop, bototmの場合は必須] スライド...
* default : [defaultかdefault_pどちらか必須]デフォ...
* default_p : [defaultかdefault_pどちらか必須]デフ...
* page : レイヤーのどちらのページを使うか[fore, ba...
*/
*** [del_slidebar]タグ [#g17b7392]
/**
* スライドバーを削除する
*
* @note [del_slidebar]
* layer : [必須] スライドバーを判定するレイヤー
*/
*** [slidebar_pos]タグ [#t41a6b10]
/**
* スライドバーの座標を取得する
*
* @note [slidebar_pos]
* layer : [必須] スライドバーを判定するレイヤー
* name : [必須] 保存変数名
*/
*** [slidebar_percent]タグ [#e6d829ab]
/**
* スライドバーのパーセンテージを取得する
*
* @note [slidebar_percent]
* layer : [必須] スライドバーを判定するレイヤー
* name : [必須] 保存変数名
*/
** 使用例(マクロ込み) [#ud2a95fd]
- 引数多いのは勘弁
;//----------------------------------------------------...
;/**
; * スライドバーをセットアップ
; *
; * @param[ in ] base_layer : [必須]ベース画像用grpレ...
; * @param[ in ] button_layer : [必須]ツマミ画像用grpレ...
; * @param[ in ] align : [必須] どちらの方向へス...
; * @param[ in ] left : [alignがleft, rightの場...
; * @param[ in ] right : [alignがleft, rightの場...
; * @param[ in ] top : [alignがtop, bototmの場...
; * @param[ in ] bottom : [alignがtop, bototmの場...
; * @param[ in ] default : [defaultかdefault_pどち...
; * @param[ in ] default_p : [defaultかdefault_pどち...
; * @param[ in ] base_center : [必須]ベース画像の配置...
; * @param[ in ] base_middle : [必須]ベース画像の配置...
; * @param[ in ] base_pic : [必須]ベース画像
; * @param[ in ] button_pic : [必須]ボタン画像
; */
;//----------------------------------------------------...
[macro name="SlidebarSetup"]
; [plugin] スライドバーの設定
[add_slidebar * layer="&mp:base_layer" page=fore]
[lay layer="&mp:base_layer" visible=true b_alpha=0]
[lay layer="&mp:button_layer" page=fore visible=true ...
; ベース画像を設定(この表示エリアで当たり判定が取ら...
[lay layer="&mp:base_layer" page=fore join=true fn="&...
center="&mp:base_center" middle="&mp:base_middle"]
; ボタン画像を設定
[let name="tmp:pos" text="0"]
[slidebar_pos layer="&mp:base_layer" name="tmp:pos"]
[lay layer="&mp:button_layer" page=fore join=true fn=...
center="&tmp:pos" middle="&mp:base_middle"
cond="mp:align == 'left' || mp:align == 'right'"]
[lay layer="&mp:button_layer" page=fore join=true fn=...
center="&mp:base_center" middle="&tmp:pos"
cond="mp:align == 'top' || mp:align == 'bottom'"]
[endmacro]
;//----------------------------------------------------...
;/**
; * スライドバーを削除
; *
; * @param[ in ] base_layer : [必須]ベース画像用grpレ...
; * @param[ in ] button_layer : [必須]ツマミ画像用grpレ...
; */
;//----------------------------------------------------...
[macro name="SlidebarFinish"]
[del_slidebar layer="&mp:base_layer" page=fore]
[clear_lay layer="&mp:base_layer"]
[clear_lay layer="&mp:button_layer"]
[endmacro]
;//----------------------------------------------------...
;/**
; * スライドバーを更新
; *
; * @param[ in ] base_layer : [必須]ベース画像用grpレ...
; * @param[ in ] button_layer : [必須]ツマミ画像用grpレ...
; * @param[ in ] align : [必須] どちらの方向へス...
; * @param[ in ] center : [alignがtop, bottomの場...
; * @param[ in ] middle : [alignがleft, rightの場...
; * @param[ in ] var : 使用する一時変数名
; * @param[ in ] var_num : varの変数の中身
; */
;//----------------------------------------------------...
[macro name="SlidebarUpdate"]
[let name="tmp:pos" text="0"]
[let name="tmp:last_pos" text="-1"]
[let name="tmp:last_pos" text="&mp:var_num" cond="mp:...
[slidebar_pos layer="&mp:base_layer" name="tmp:pos"]
; 前回から変更が無ければ何もしない(処理負荷対策)
[let name="&mp:var" text="&tmp:pos"]
[return cond="(tmp:pos - tmp:last_pos) == 0"]
; レイヤー自体を移動させる。
[lay layer="&mp:button_layer" center="&tmp:pos" middl...
[lay layer="&mp:button_layer" center="&mp:center" mid...
[endmacro]
; 必要なレイヤーの生成
[add_lay layer="option_bgm_slidebar_base" class="grp"]
[add_lay layer="option_bgm_slidebar_button" class="grp"]
[add_lay layer="option_se_slidebar_base" class="grp"]
[add_lay layer="option_se_slidebar_button" class="grp"]
[add_lay layer="option_text_speed_slidebar_base" class=...
[add_lay layer="option_text_speed_slidebar_button" clas...
[add_lay layer="option_automode_speed_slidebar_base" cl...
[add_lay layer="option_automode_speed_slidebar_button" ...
[add_lay layer="option_window_alpha_slidebar_base" clas...
[add_lay layer="option_window_alpha_slidebar_button" cl...
; 初期設定
; BGM
[SlidebarSetup base_layer="option_bgm_slidebar_base" bu...
align="right" left=100 right=400 default_p=100 base...
base_pic="slidebar_base" button_pic="slidebar_butto...
; SE
[SlidebarSetup base_layer="option_se_slidebar_base" but...
align="right" left=100 right=400 default_p=100 base...
base_pic="slidebar_base" button_pic="slidebar_butto...
; TextSpeed
[SlidebarSetup base_layer="option_text_speed_slidebar_b...
align="right" left=100 right=400 default_p=100 base...
base_pic="slidebar_base" button_pic="slidebar_butto...
; AutomodeSpeed
[SlidebarSetup base_layer="option_automode_speed_slideb...
align="right" left=100 right=400 default_p=100 base...
base_pic="slidebar_base" button_pic="slidebar_butto...
; WindowAlpha
[SlidebarSetup base_layer="option_window_alpha_slidebar...
align="right" left=100 right=400 default_p=100 base...
base_pic="slidebar_base" button_pic="slidebar_butto...
; 更新用のイベント生成
[event key="enter_frame" call=true label=*SlidebarButto...
[s]
;//----------------------------------------------------...
;/// スライドバーのツマミ位置更新
;//----------------------------------------------------...
*SlidebarButtonUpdate
[let name="tmp:percent" text="0"]
; BGM
[SlidebarUpdate
base_layer="option_bgm_slidebar_base" button_laye...
middle=100 var="tmp:option_bgm_slidebar_pos" var_...
; パーセンテージの取得
[slidebar_percent layer="option_bgm_slidebar_base" na...
; ここで設定を行う
; [let name="hogehoge" text="&tmp:percent"]
; SE
[SlidebarUpdate
base_layer="option_se_slidebar_base" button_layer...
middle=200 var="tmp:option_se_slidebar_pos" var_n...
; TextSpeed
[SlidebarUpdate
base_layer="option_text_speed_slidebar_base" butt...
middle=300 var="tmp:option_text_speed_slidebar_po...
; AutomodeSpeed
[SlidebarUpdate
base_layer="option_automode_speed_slidebar_base" ...
middle=400 var="tmp:option_automode_speed_slideba...
; WindowAlpha
[SlidebarUpdate
base_layer="option_window_alpha_slidebar_base" bu...
middle=500 var="tmp:option_window_alpha_slidebar_...
[return]
** やってること [#leb16e59]
- プラグインで、指定レイヤーのクリックされているマウス座...
- AirNovelスクリプトでループを回してマウス座標を取得[slid...
** 何か [#c0cd5dfd]
- ベース、ツマミは固定画像のみになります。([button enable...
** 使用した画像データサンプル [#gecdab70]
- slidebar_base : スライドバーの下地。当たり判定領域。
#ref(slidebar_base.png)
- slidebar_button : スライドバーのツマミ
#ref(slidebar_button.png)
ページ名: