TIPプラグインのもう少し突っ込んだ使い方について解説します。
※太字は任意の部分です。
CSVデータの形式
TIPプラグインV4以降は、データをtf変数に保存しています。
CSVデータは、tf.system.tip_conf.data_ファイル名=[] に入れてあるので、
tip_data.csvの場合は、tf.system.tip_conf.data_tip_data=[] となります。
csvデータ
key,tip
hoge,ほげほげほげ
fuga,ふがふがふが
配列
tf.system.tip_conf.data_tip_data=[
{key:hoge,tip:ほげほげほげ},
{key:fuga,tip:ふがふがふが}
]
こんな感じ。
0番目のtip項目は、tf.system.tip_conf.data_tip_data[0]["tip"] になります。長いね！！！
embタグでテキスト表示もできます。長いけど。
[emb exp="tf.system.tip_conf.data_tip_data[0]['tip']"]
※tf.system は文字通りシステムで使うデータが入っているので、下手に上書きしないよう tip_conf という配列内に全部入れるようにしております。
※tf.system はsleepgameでも消えない一時変数なのでちょっと便利かも。普通にこういう変数欲しい。
フラグについて
フラグはsf変数 または f変数 に保存し、CSV呼び出し時に tf.system.tip_conf.data_tip_data の中に格納しなおしています。
その為、ゲーム途中でフラグ立てをする場合は、tf.system.tip_conf.data_tip_data と sf(f)変数 の2か所更新しないといけません。
フラグの名前は半角英数のみですが、フラグの中身自体は何でも入ります。
例えば、キャラ一覧CSVを作っておいて、パラメータ値を入れたりといった使い方も可能ではあります。
「フラグ名」に、csvデータの項目名を入れるとデータが上書きされますが、ゲーム再起動時にcsvを読むので元に戻ります。（戻らないようには出来るかも）
例えば、サンプルゲームの途中で、
[tip_flag key=tyrano flag_name=tip flag_val="テストだよん"]
を実行すると、「ティラノスクリプト」の説明テキストが「テストだよん」になっちゃいます。
テンプレートに {{:フラグ名(半角英数)}} と記述すると「フラグの値」が表示されます。
マクロ例
使えるかどうかはわかりませんが、こんな事もできますよ～的な例です。
TIPタグの記述をさらにマクロにする
[macro name="tip_emb"]
[iscript]
var tip_conf = tf.system.tip_conf;
mp.data_name = mp.data_name || tip_conf.data_name;
var data = tip_conf["data_"+mp.data_name];
var tip = $.grep(data,function(e, i) {
return (e.key == mp.key);
});
tf.tip_title = tip[0]["title"];
[endscript]
[tip key=%key data_name=%data_name]
[emb exp=tf.tip_title]
[endtip]
[endmacro]
[tip_emb key=hoge] または [tip_emb key=hoge data_name=dataname]
簡略化はできますが、シナリオの視認性は良くないですね…。
自動書き出しマクロ
CSVデータを0番目から順番に表示していくマクロです。
TIPプラグインじゃないと出来ない事ではないし、連想配列である必要すらないけど。
[eval exp=tf.text_num=0] [macro name="シナリオ"] *シナリオループ [iscript] var tip_conf = tf.system.tip_conf; mp.data_name = mp.data_name || tip_conf.data_name; var data = tip_conf["data_"+mp.data_name]; tf.data_max = data.length; var num = tf.text_num; tf.tip_title = data[num]['title']; tf.tip_tip = data[num]['tip']; tf.text_num=tf.text_num+1; //0スタートなので最後にカウント [endscript] [chara_ptext name="&tf.tip_title"] //キャラ名に入れる場合 [emb exp=tf.tip_tip] //テキスト [p] [jump target=シナリオループ cond="tf.data_max>tf.text_num"] //全部書き出したら終了 [endmacro] [シナリオ]
keyからidを取得しティラノ変数に格納するマクロ
[macro name="tip_id"]
[iscript]
mp.data_name = mp.data_name || tf.system.tip_conf.data_name; //csvファイル名
const data = tf.system.tip_conf["data_"+mp.data_name]; //csvデータを取得
const tip = $.grep(data,function(e, i) { return (e.key == mp.key); }); //keyが存在する配列を抽出
TG.evalScript(mp.fname + "=" + tip[0]["id"]); //ティラノ変数にid数を格納
[endscript]
[endmacro]
マクロで使える属性
- key … csvファイルのkey項目。必須
- fname … 代入先の変数名（ティラノの変数です。f.hoge など）必須
- data_name … csvファイル名（拡張子なし）デフォルトファイルの場合は省略可
記述例
※サンプルのtip_data.csvを使用した場合
@tip_id key="plugin" fname="tf.hoge" @emb exp="tf.hoge" @emb exp="tf.system.tip_conf.data_tip_data[tf.hoge]['title']"
シナリオ表記
3プラグイン
nextボタンで最後ページの次は詳細を閉じる（未確定）
※実装場所に悩んでいるので、今後変更の可能性があります。
CSV読み込み時に、nextend=close を指定すると、TIP詳細のnextボタンが最後のページの次は閉じる動作になります。（※リストのnextはなりません）
[tip_loadcsv nextend=close]
エロゲのCGモードとかで、クリックしてくと差分表示をして最後閉じるやつみたいなイメージです。
実際にエロゲのCGモードっぽくするにはCSSの知識が必要です。
エロゲの標準的なCGモードがどんなのかはわからないけど…私が遊んだのはそんなシステムのばっかだった！（どうでもいい）
TIPプラグインのレイヤー順について
使い方ではありませんが、TIPプラグインのレイヤー順について説明しておきます。
z-index の説明が必要なのですが、ざっくり説明すると、親要素にz-indexが指定されている場合、子要素のz-indexは親要素の外には出ません。
という事をふまえてティラノの場合です。（※DOM要素をある程度理解してないとわからんかも）
layer_event_click（クリックするとゲーム進行する部分） は z-index:9999
message_inner（メッセージの文字表示部分） は z-index:1001
なので、そのままで message_inner 内の span にz-index:999999 と指定しても、layer_event_click の上にはなりません。
そこで、まず message_inner を z-index:auto にします。
次に、message_inner 内の子要素それぞれに z-index:1001 を指定します。
.message_inner p span
.message_inner p img （※[graph]タグ）
.img_next （※グリフ画像） の三点です。
これで文字表示は元に戻ります。
次に、TIP に z-index:10000 を指定します。
.message_inner p span.tip
この方法で、TIPのみを layer_event_click の上に出しています。
…こんな説明でわかりますかね？
もし message_inner を利用してキャラ画像表示したい！という場合は、TIPプラグインとは併用できない事になりますので参考まで。message_inner 内に入れた要素に z-index:1001 を指定してください。message_inner の背景に画像指定とかは無理です。
z-index について詳しくはGoogle先生に解説してもらってください！！ 因みに下記サイトさんが分かりやすいかと思います。
