• iPhone・Androidアプリ化対応。HTML5で動くノベルゲーム製作キット
初心者の壁を突破しよう!
クイック検索

基本

[ ] で囲まれた部分がタグになります。
@で始まる行もタグとして認識されますが、1行に複数のタグを書くことはできません。

;(セミコロン)で始まる行はコメントとして扱われます。
複数行をまとめてコメントにしたいときは、コメントにしたい行を /* と */ で囲みます。/* と */ はどちらも独立した行に記述する必要があります。

すべてのタグに共通して指定可能なパラメータにcond属性があります。cond属性は『そのタグが実行される条件』であり、JavaScriptの式で記述します。

基本的にスクリプトの行頭の空白はないものとして扱われます。テキストの前に空白を入れたいときは、行頭に_(半角アンダーバー)を書く必要があります。

[l] クリック待ち

  • メッセージ・テキスト

このタグの位置でプレイヤーのクリックを待ちます。

解説チュートリアル

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
テキスト表示[l]
テキスト表示[l][r]

[p] クリック待ち+改ページ

  • メッセージ・テキスト

プレイヤーのクリックを待ちます。
プレイヤーがクリックすると改ページされます。

解説チュートリアル

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
テキスト表示[p]
テキスト表示[p][r]

[graph] インライン画像表示

  • メッセージ・テキスト

任意の画像をメッセージ中に表示します。絵文字や特殊文字などに活用できます。
表示する画像はdata/imageフォルダに配置してください。
よく使う記号についてはマクロを組んでおくと楽です。

解説チュートリアル

パラメータ必須解説初期値
storage表示する画像ファイル名を指定します。
  • サンプルコード
;heart.png はハートマークの画像
[macro name="heart"]
[graph storage="heart.png"]
[endmacro]

;以後、[heart] タグでハートマークを使用可能
大好き[heart][p]

[r] 改行

  • メッセージ・テキスト

改行します。

解説チュートリアル

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
テキスト表示[l]
改行します[l][r]
改行します[l][r]

[er] メッセージレイヤの文字の消去

  • メッセージ・テキスト

現在の操作対象のメッセージレイヤの文字を消去します。

操作対象のメッセージレイヤを切り替えるには[current]タグを使います。

解説チュートリアル

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
クリックするとメッセージがクリアされます[l][er]
クリアされました[l]

[cm] すべてのメッセージレイヤのクリア

  • メッセージ・テキスト

すべてのメッセージレイヤの文字を消去します。[button][glink][html]タグなどで表示した要素も消去されます。

フォントスタイルがデフォルトの設定に戻ります。

[ct]タグとは異なり、操作対象のメッセージレイヤがmessage0に変更されるようなことはありません。このタグを実行したあとも操作対象のメッセージレイヤは同じままです。

解説チュートリアル

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
テキスト表示[l]
画面クリアする[l][cm]
もう一度画面クリアする[l][cm]

[ct] メッセージレイヤにのリセット

  • メッセージ・テキスト

すべてのメッセージレイヤの文字が消去されます。

フォントスタイルがデフォルトの設定に戻り、操作対象のメッセージレイヤがmessage0の表ページに変更されます。

解説チュートリアル

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
テキスト表示[l]
画面リセットする[l][ct]
もう一度画面リセットする[l][ct]

[current] 操作対象のメッセージレイヤの指定

  • メッセージ・テキスト

操作対象とするメッセージレイヤを指定します。以後、テキストや[font]タグでの文字属性の指定、[l]タグ等のクリック待ちなどはこのレイヤに対して行われます。

message0はデフォルトで可視の状態ですが、message1[layopt]タグを使用しないと表示されないので注意してください。

解説チュートリアル

パラメータ必須解説初期値
layer操作対象のメッセージレイヤを指定します。省略すると、現在のメッセージレイヤとみなされます。
pageレイヤの表ページと裏ページ、どちらを対象とするか。foreまたはbackで指定します。省略すると、表ページとみなされます。fore
  • サンプルコード
[current layer="message0"]
message0レイヤに表示されています[l]
[current layer="message1"]
message1レイヤに表示されています[l]

[fuki_start] メッセージレイヤをふきだし化する

  • メッセージ・テキスト

メッセージレイヤを漫画のふきだし風に表現できます。

このタグでふきだし表示を有効にする前に[fuki_chara]タグで設定が必要です。

ふきだしのデザインは[position]タグの設定が引き継がれますが、[fuki_chara]タグで個別に設定することも可能です。

パラメータ必須解説初期値
layer対象とするメッセージレイヤを指定します。message0
  • サンプルコード
;通常のメッセージレイヤに対して、ふきだしに適応したいデザインを設定する
[font color="black"]
[position layer="message0" page=fore radius=15 visible=true color="white" opacity=255 border_size="3" border_color="black" ]

;ふきだしの表示位置をキャラごとに設定する
[fuki_chara name="akane" left=200 top=270 sippo_left=30 sippo_top=30 sippo="top" max_width=300 radius=15]
[fuki_chara name="yamato" left=350 top=280  sippo_left=30 sippo_top=30 sippo="top" ]

;キャラクターが画面上に存在しない場合に適応するふきだし設定 name=others
[fuki_chara name="others" left=250 top=500 max_width=700 fix_width=700 radius=0 ]

;ふきだし表示を開始する
[fuki_start ]

#akane
あかねの位置にふきだしを表示[p]

#yamato
やまとのいちにふきだしを表示[p]

#
othersで設定した位置にふきだしを表示[p]

[fuki_stop] メッセージレイヤのふきだし化を無効にする

  • メッセージ・テキスト

ふきだし表示を停止します。

メッセージレイヤのスタイルは[fuki_start]タグの前の状態に戻ります。

パラメータ必須解説初期値
指定できるパラメータはありません。

[fuki_chara] ふきだしのキャラクター登録

  • メッセージ・テキスト

ふきだしのデザインをキャラクターごとに設定できます。

name属性にothersを指定すると、画面上にキャラクターがいない場合のデザインを設定できます。

パラメータ必須解説初期値
nameキャラクター名を指定します。キャラクターがいないときデザインを設定するにはothersを指定します。
leftどの位置にふきだしを表示するかを指定します。(キャラクター画像左端からの相対位置)
topどの位置にふきだしを表示するかを指定します。(キャラクター画像上端からの相対位置)
sippoしっぽをどの方向に表示するかを指定します。top(上)、 bottom(下)、left(左)、right(右)top
sippo_leftふきだしの位置がtopbottomの場合、しっぽを表示する左端からの位置を指定できます。40
sippo_topふきだしの位置がleftrightの場合、しっぽを表示する上端からの位置を指定できます。40
sippo_widthしっぽの幅を指定できます。12
sippo_topしっぽの高さを指定できます。40
max_widthふきだしのサイズは自動的に調整されますが、その際の横幅の上限サイズを指定できます。300
fix_widthこれを指定することで、ふきだしの横幅の自動調節機能を停止し、指定した横幅で固定できます。
colorふきだしの表示色を0xRRGGBB形式で指定します。
border_color外枠の線の色を0xRRGGBB形式で指定します。border_sizeの指定が同時に必要です。
border_size外枠の線の太さを指定します。0を指定すると外枠は表示されません。初期値は0
opacityふきだしの不透明度を0255の数値で指定します。0で完全に透明。(文字の不透明度や、レイヤ自体の不透明度ではありません)
radiusふきだしの角の丸みを数値で指定します。例:10(控えめな角丸)、30(普通の角丸)、100(巨大な角丸)
font_colorフォントの色を0xRRGGBB形式で指定します。
font_sizeフォントサイズを指定します。
  • サンプルコード
;ふきだしの表示位置をキャラごとに設定する
[fuki_chara name="akane" left=200 top=270 sippo_left=30 sippo_top=30 sippo="top" max_width=300 radius=15]
[fuki_chara name="yamato" left=350 top=280  sippo_left=30 sippo_top=30 sippo="top" ]

;キャラクターが画面上に存在しない場合に適応するふきだし設定 name=others
[fuki_chara name="others" left=250 top=500 max_width=700 fix_width=700 radius=0 ]

[ptext] レイヤにテキストを表示

  • メッセージ・テキスト

前景レイヤにテキストを表示します。メッセージウィンドウのテキストとは別に画面上にテキストを出したいときに使用できます。

テキストを消す時は[freeimage]タグを使うか、このタグで指定しておいたname属性に対して[free]タグを使う必要があります。

初期状態ではレイヤ自体が非表示になっているため、そのままでは[ptext]タグで文字を追加しても画面に表示されません。はじめに[layopt]タグでレイヤ自体を表示状態にする必要があります。

解説チュートリアル

パラメータ必須解説初期値
layer対象とする前景レイヤを0以上の整数で指定します。0
pageレイヤの表ページと裏ページ、どちらを対象とするか。foreまたはbackで指定します。省略すると、表ページとみなされます。fore
text表示するテキストの内容。
xテキストの左端位置を指定します。(ピクセル)
yテキストの上端位置を指定します。(ピクセル)
vertical縦書きにするかどうか。trueまたはfalseで指定します。false
sizeフォントサイズをピクセル単位で指定します。
faceフォントの種類を指定します。非KAG互換ですが、ウェブフォントも使用できます。
colorフォントの色を0xRRGGBB形式で指定します。
bold太字にする場合はboldと指定します。(このパラメータをCSSのfont-styleにセットします)
V515以降:trueでも太字にできるようにしました。
edge文字の縁取りを有効にできます。縁取りする文字色を0xRRGGBB形式で指定します。
V515以降:縁取りの太さもあわせて指定できます。4px 0xFF0000のように、色の前に縁取りの太さをpx付きで記述します。太さと色は半角スペースで区切ってください。さらに4px 0xFF0000, 2px 0xFFFFFFのようにカンマ区切りで複数の縁取りを指定できます。
shadow文字に影をつけます。影の色を0xRRGGBB形式で指定します。縁取りをしている場合は無効化されます。
name[anim]タグなどからこの名前でアニメーションさせられます。カンマで区切ることで複数指定できます。(高度な知識:name属性で指定した値はHTMLのクラス属性になります)
widthテキスト表示部分の横幅をピクセルで指定します。
align文字の横方向に関する位置を指定できます。widthパラメータを同時に指定する必要があります。left(左寄せ)、center(中央寄せ)、right(右寄せ)left
timeフェードイン時間をミリ秒単位で指定します。これを指定すると、画像が透明な状態から徐々に表示されていきます。省略すると、一瞬で表示されます。
overwrite上書きするかどうかをtrueまたはfalseで指定します。trueを指定すると、同じnameが指定されたテキストがすでに存在している場合に、新規テキストを追加するのではなく既存のテキストの内容を書き変える処理を行います。false
gradientV515以降:文字にグラデーションを適用することができます。CSSのグラデーション関数を指定します。グラデーション関数とはlinear-gradient(45deg, red 0%, yellow 100%)のような文字列です。
グラデーション関数を簡単に作れるサイトがWeb上にいくつか存在しますので、「CSS グラデーション ジェネレーター」で検索してみてください。
  • サンプルコード
[backlay]
[ptext page=back text="テキストテキスト" size=30 x=200 y=300 color=red vertical=true]
[trans time=2000]
[wt]
[l]
表示したテキストを消去します
[freeimage layer=0]

[mtext] 演出テキスト

  • メッセージ・テキスト

多彩な演出効果をもったテキストを画面上に表示します。

指定できる演出アニメーションは http://tyrano.jp/mtext/ を参照してください。

初期状態ではレイヤ自体が非表示になっているため、そのままでは[mtext]タグで文字を追加しても画面に表示されません。はじめに[layopt]タグでレイヤ自体を表示状態にする必要があります。

解説チュートリアル

パラメータ必須解説初期値
layer対象とする前景レイヤを0以上の整数で指定します。0
pageレイヤの表ページと裏ページ、どちらを対象とするか。foreまたはbackで指定します。省略すると、表ページとみなされます。fore
text表示するテキストの内容を指定します。
xテキストの左端位置を指定します。(ピクセル)
yテキストの上端位置を指定します。(ピクセル)
vertical縦書きにするかどうか。trueまたはfalseで指定します。false
sizeフォントサイズをピクセルで指定します。
faceフォントの種類を指定します。Webフォントを使用する場合はtyrano/css/font.cssに定義を記述してください。
colorフォントの色を0xRRGGBB形式で指定します。
widthテキスト表示部分の横幅をピクセルで指定します。
align文字の横方向に関する位置を指定できます。同時にwidthパラメータを指定する必要があります。left(左寄せ)、center(中央寄せ)、right(右寄せ)left
name[anim]タグなどからこの名前でアニメーションさせられます。カンマで区切ることで複数指定できます。(高度な知識:name属性で指定した値はHTMLのクラス属性になります)
bold太字にする場合はboldと指定します。
edge文字の縁取りを有効にできます。縁取り色を0xRRGGBB形式で指定します。
shadow文字に影をつけます。影の色を0xRRGGBB形式で指定します。縁取りをしている場合は無効化されます。
fadeoutテキスト表示後にフェードアウトを実行するか否かをtrueまたはfalseで指定します。残った文字を消す場合は[freeimage]タグや[free]タグを使います。true
timeテキストが静止している時間をミリ秒で指定します。2000
waitアニメーションの完了を待つかどうか。trueまたはfalseを指定します。falseを指定すると、テキストの演出完了を待たずに次のタグに進みます。true
in_effect文字が表示される際のアニメーション演出を指定します。fadeIn
in_delay文字が表示される際の速度を指定します。何秒遅れて1文字が表示されるかをミリ秒で指定します。50
in_delay_scale1文字にかかるアニメーションの比率を指定します。1.5
in_synctrueを指定すると、すべての文字が同時にアニメーションを開始します。false
in_shuffletrueを指定すると、文字アニメーションのタイミングがランダムに実行されます。false
in_reversetrueを指定すると、文字が後ろから表示されていきます。"false
out_effect文字が消える際のアニメーション演出を指定します。指定できるアニメーションは http://tyrano.jp/mtext/ を参照。fadeOut
out_delay文字が消える際の速度を指定します。何秒遅れて1文字が消えるかをミリ秒で指定します。50
out_delay_scale1文字にかかるアニメーションの比率を指定します。
out_synctrueを指定すると、すべての文字が同時にアニメーションを開始します。false
out_shuffletrueを指定すると、文字アニメーションのタイミングがランダムに実行されます。false
out_reversetrueを指定すると、文字が後ろから消えていきます。"false
  • サンプルコード
;レイヤ0を表示状態に
[layopt layer=0 visible=true]
;演出テキストを表示
[mtext text="演出テキスト" x=100 y=100 in_effect="fadeIn" out_effect="fadeOut"]

[ruby] ルビを振る

  • メッセージ・テキスト

次の一文字に対するルビを指定します。
ルビを表示させたい場合は毎回指定する必要があります。
複数の文字にルビを振る場合は、一文字毎にルビを指定する必要があります。

解説チュートリアル

パラメータ必須解説初期値
textルビとして表示させる文字を指定します。
  • サンプルコード
[ruby text="かん"]漢[ruby text="じ"]字

[mark] テキストマーカー

  • メッセージ・テキスト

テキストに蛍光ペンでマーカーを引いたような効果をつけることができます。
色やサイズも指定可能。

解説チュートリアル

パラメータ必須解説初期値
colorマーカーの色を0xRRGGBB形式で指定します。デフォルトは黄色。0xFFFF00
font_colorマーカーを引いたときのフォントの色を0xRRGGBB形式で指定します。省略すると、ゲーム中のフォント色を継承します。
sizeマーカーのサイズを0100で指定します。たとえば50だとテキストの下半分にマーカーが引かれます。10だとただの下線に近くなります。
  • サンプルコード
ここはまだです。[mark]ここにマーカーがひかれています。[endmark]ここはひかれません。

[mark color="0xff7f50" size=70]マーカーの色やサイズを指定することもできます。[endmark]

[endmark] テキストマーカー終了

  • メッセージ・テキスト

[mark]タグで開始したテキストマーカーを終了します。

解説チュートリアル

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
ここはまだです。[mark]ここにマーカーがひかれています。[endmark]ここはひかれません。

[mark color="0xff7f50" size=70 ]マーカーの色やサイズを指定することもできます。[endmark]

[config_record_label] 既読管理の設定

  • メッセージ関連の設定

既読管理の設定を変更できます。

パラメータ必須解説初期値
color既読テキスト色を0xRRGGBB形式で指定します。
skipプレイヤーが未読テキストをスキップできるかどうか。trueまたはfalseで指定します。falseを指定すると、プレイヤーが未読テキストに到達したときにスキップが解除されます。

[position] メッセージウィンドウの属性変更

  • メッセージ関連の設定

メッセージウィンドウに対する様々な属性を指定します。
いずれの属性も、省略すれば設定は変更されません。

解説チュートリアル

パラメータ必須解説初期値
layer対象とするメッセージレイヤを指定します。message0
pageレイヤの表ページと裏ページ、どちらを対象とするか。foreまたはbackで指定します。省略すると、表ページとみなされます。fore
leftメッセージウィンドウの左端位置を指定します。(ピクセル)
topメッセージウィンドウの上端位置を指定します。(ピクセル)
widthメッセージウィンドウの横幅を指定します。(ピクセル)
heightメッセージウィンドウの高さを指定します。(ピクセル)
frame

メッセージウィンドウのフレーム画像として表示させる画像を指定します。

画像サイズはwidthheight属性に準じて調整してください。margin属性で実際にメッセージが表示される箇所の調整も行いましょう。

noneと指定することで標準枠に戻すこともできます。

colorメッセージウィンドウの表示色を0xRRGGBB形式で指定します。
border_color外枠の線が有効な場合の色を0xRRGGBB形式で指定します。border_size属性の指定が同時に必要です
border_size外枠の線が有効な場合の太さを指定します。0を指定すると外枠は表示されません。初期値は0です。
opacityメッセージウィンドウの不透明度を0255の数値で指定します。0で完全に透明。(文字の不透明度や、レイヤ自体の不透明度ではありません)
marginlメッセージウィンドウの左余白を指定します。
margintメッセージウィンドウの上余白を指定します。
marginrメッセージウィンドウの右余白を指定します。
marginbメッセージウィンドウの下余白を指定します。
marginメッセージウィンドウの余白を一括で指定します。たとえば30と指定すると上下左右すべてに30pxの余白ができます。
カンマ区切りで方向ごとの余白を一括指定することもできます。上下,左右上,左右,下上,右,下,左のように指定できます(方向の部分は数値に変えてください)。
radiusメッセージウィンドウの角の丸みを数値で指定します。例:10(控えめな角丸)、30(普通の角丸)、100(巨大な角丸)
verticalメッセージウィンドウを縦書きモードにするかどうか。trueまたはfalseで指定します。trueで縦書き、falseで横書き。
visibleメッセージレイヤを表示状態にするかどうか。trueまたはfalseを指定すると、同時にメッセージレイヤの表示状態を操作できます。
gradient背景にグラデーションを適用することができます。CSSグラデーション形式で指定します。CSSグラデーションとは、たとえばlinear-gradient(45deg, red 0%, yellow 100%)のような形式です。
CSSグラデーションを簡単に作れるサイトがWeb上にいくつか存在しますので、「CSS グラデーション ジェネレーター」で検索してみてください。
  • サンプルコード
;メッセージウィンドウの位置とサイズを変更
[position width=400 height=300 top=100 left=20]
;メッセージウィンドウの色と透明度を変更
[position color=blue opacity=100]

[hidemessage] メッセージレイヤの一時的な非表示

  • メッセージ関連の設定

メッセージレイヤを一時的に隠してクリックを待ちます。テキストは消去されません。メニューから「メッセージを消す」を選んだのと同じ動作を行います。

クリックされると再びメッセージレイヤが表示されます。

パラメータ必須解説初期値
指定できるパラメータはありません。

[font] テキストスタイルの変更

  • メッセージ関連の設定

テキストのスタイルを変更します。スタイルはメッセージレイヤごとに個別に設定できます。

いずれのパラメータについても、省略すると変更を行いません。またdefaultと指定した場合はデフォルトの値(Config.tjs内あるいは[deffont]タグで指定した値)に戻ります。

このタグで変更したスタイルは、[resetfont][ct][cm][er]などのタグが実行されたタイミングでデフォルトの値に戻ります。デフォルトの値自体を変更したい場合は、Config.tjsを編集するか、[deffont]タグを使用します。

解説チュートリアル

パラメータ必須解説初期値
size文字サイズを指定します
color文字色を0xRRGGBB形式で指定します。
bold太字にするかどうか。trueまたはfalseで指定します。
italicイタリック体にするかどうか。trueまたはfalseで指定します。
faceフォントの種類を指定します。Webフォントを使用する場合はtyrano/css/font.cssに定義を記述してください。
edge文字の縁取りを有効にできます。縁取り色を0xRRGGBB形式等で指定します。縁取りを解除する場合はnoneと指定します。
V515以降:縁取りの太さもあわせて指定できます。4px 0xFF0000のように、色の前に縁取りの太さをpx付きで記述します。太さと色は半角スペースで区切ってください。さらに4px 0xFF0000, 2px 0xFFFFFFのようにカンマ区切りで複数の縁取りを指定できます。
edge_method縁取りの実装方式を選択できます。指定できるキーワードはshadowまたはfilter
shadow文字に影をつけます。影の色を0xRRGGBB形式で指定します。影を解除する場合はnoneと指定します。
effectフォントの表示演出にアニメーションを設定できます。noneを指定すると無効。指定できるキーワードは以下のとおり。fadeInfadeInDownfadeInLeftfadeInRightfadeInUprotateInzoomInslideInbounceInvanishInpuffInrollInnone
effect_speedeffectパラメータがnone以外の場合に、表示されるまでの時間を指定します。デフォルトは0.2sです。sは秒を表します。
gradientV515以降:文字にグラデーションを適用することができます。CSSグラデーション形式で指定します。CSSグラデーションとは、たとえばlinear-gradient(45deg, red 0%, yellow 100%)のような形式です。
CSSグラデーションを簡単に作れるサイトがWeb上にいくつか存在しますので、「CSS グラデーション ジェネレーター」で検索してみてください。
  • サンプルコード
[font size=40 bold=true]
この文字は大きく、そして太字で表示されます。
[resetfont]
もとの大きさに戻りました。

[deffont] デフォルトのテキストスタイル設定

  • メッセージ関連の設定

現在操作対象のメッセージレイヤに対する、デフォルトのテキストスタイルを指定します。

ここで指定したスタイルは[resetfont]タグを通過したときに反映されます。つまり、[deffont]タグを使用しただけでは実際のスタイルは変更されません。

解説チュートリアル

パラメータ必須解説初期値
size文字サイズを指定します
color文字色を0xRRGGBB形式で指定します。
bold太字にするかどうか。trueまたはfalseで指定します。
italicイタリック体にするかどうか。trueまたはfalseで指定します。
faceフォントの種類を指定します。Webフォントも利用可能。Webフォントを使用する場合、フォントファイルをdata/othersフォルダに配置し、tyrano.css@font-faceを設定する必要があります。
edge文字の縁取りを有効にできます。縁取り色を0xRRGGBB形式等で指定します。縁取りを解除する場合はnoneと指定します。
V515以降:縁取りの太さもあわせて指定できます。4px 0xFF0000のように、色の前に縁取りの太さをpx付きで記述します。太さと色は半角スペースで区切ってください。さらに4px 0xFF0000, 2px 0xFFFFFFのようにカンマ区切りで複数の縁取りを指定できます。
edge_method縁取りの実装方式を選択できます。指定できるキーワードはshadowまたはfilter
shadow文字に影をつけます。影の色を0xRRGGBB形式で指定します。影を解除する場合はnoneと指定します。
effectフォントの表示演出にアニメーションを設定できます。noneを指定すると無効。指定できるキーワードは以下。fadeInfadeInDownfadeInLeftfadeInRightfadeInUprotateInzoomInslideInbounceInvanishInpuffInrollInnone
effect_speedeffectパラメータがnone以外の場合に、表示されるまでの時間を指定します。デフォルトは0.2sです。sは秒を表します。
gradientV515以降:文字にグラデーションを適用することができます。CSSのグラデーション関数を指定します。グラデーション関数とはlinear-gradient(45deg, red 0%, yellow 100%)のような文字列です。
グラデーション関数を簡単に作れるサイトがWeb上にいくつか存在しますので、「CSS グラデーション ジェネレーター」で検索してみてください。

[message_config] メッセージコンフィグ

  • メッセージ関連の設定

ティラノスクリプトV515以降。
メッセージに関連する詳細な設定を行えます。
省略した属性の設定は変更されません。

パラメータ必須解説初期値
ch_speed_in_click文字表示の途中でクリックされたあとの文字表示速度。1文字あたりの表示時間をミリ秒で指定します。
defaultと指定した場合はクリック前の文字表示速度を引き継ぐようになります。
effect_speed_in_click文字表示の途中でクリックされたあとの文字エフェクト速度。0.2s200ms、あるいは単に200などで指定します。例はいずれも200ミリ秒となります。
defaultと指定した場合はクリック前の文字表示速度を引き継ぐようになります。
edge_overlap_text縁取りテキストの縁をひとつ前の文字に重ねるかどうか。trueまたはfalseで指定します。現状はedge_methodstrokeの場合にのみ有効なパラメータです。
speech_bracket_floatキャラのセリフの最初のカギカッコを左側に浮かして、開始カギカッコの下に文字が周りこまないようにするための設定です。trueを指定すると、開始カギカッコだけが左側にずれます。falseで無効。trueのかわりに20のような数値を指定することで、開始カギカッコを左側にずらす量を直接指定できます。
speech_margin_leftspeech_bracket_floatが有効のときに、さらにテキスト全体を右側に動かすことができます。trueで有効、falseで無効。20のように数値で直接指定することで全体を右側にずらす量を直接指定できます。
kerning字詰めを有効にするか。trueまたはfalseで指定します。フォント、もともとの字間設定、プレイヤーの使用ブラウザによっては効果が見られないこともあります。(高度な知識:CSSのfont-feature-settingsプロパティを設定する機能です)
add_word_nobreakワードブレイク(単語の途中で自然改行される現象)を禁止する単語を追加できます。カンマ区切りで複数指定可能。
remove_word_nobreak一度追加したワードブレイク禁止単語を除外できます。カンマ区切りで複数指定可能。
line_spacing行間のサイズをpx単位で指定できます。
letter_spacing字間のサイズをpx単位で指定できます。
control_line_break禁則処理を手動で行なうかどうかをtrueまたはfalseで指定します。などの特定の文字が行頭に来ていたとき、そのひとつ前の文字で改行するようにします。基本的にはこれを指定しなくても自動で禁則処理が行われますが、フォントの設定(エフェクトや縁取りなど)によっては禁則処理が自動で行われなくなることがあるので、その場合はこのパラメータにtrueを指定してみてください。
control_line_break_chars行頭に来ていたときに禁則処理を行なう文字をまとめて指定します。デフォルトでは、。)」』】,.)]が禁則処理の対象です。
  • サンプルコード
;クリックされても文字表示速度を変更しない
[message_config ch_speed_in_click="default" effect_speed_in_click="default"]

;クリックされたら残りを瞬間表示
[message_config ch_speed_in_click="0" effect_speed_in_click="0ms"]

;セリフの先頭のカギカッコだけを左側にずらして、カギカッコの下に文章が回り込まないようにする
[message_config speech_bracket_float="true"]

;"――"はワードブレイクされてほしくない
[message_config add_word_nobreak="――"]

;行間も字間もめちゃくちゃ広げてみる
[message_config line_spacing="50" letter_spacing="30"]

;ダッシュの字間を詰めてみる
@macro name="――"
  [message_config letter_spacing="-4"]―[message_config letter_spacing="0"]―
@endmacro
――力が欲しいか?[l][r]
[――]力が欲しいか?[l][r]

[delay] 文字の表示速度の設定

  • メッセージ関連の設定

文字の表示速度を指定します。
文字表示をノーウェイトにするには[nowait]タグを使うこともできます。

解説チュートリアル

パラメータ必須解説初期値
speed

文字の表示速度を指定します。小さいほど早くなります。

ここで指定した値は、次の1文字を表示するまでの時間(ミリ秒)として解釈されます。たとえば1000と指定すると1秒ごとに1文字ずつ表示されます。


[resetdelay] 文字の表示速度をデフォルトに戻す

  • メッセージ関連の設定

文字の表示速度をデフォルト速度に戻します。

パラメータ必須解説初期値
指定できるパラメータはありません。

[configdelay] デフォルトの文字の表示速度の設定

  • メッセージ関連の設定

デフォルトの文字の表示速度を指定します。
つまり、[resetdelay]タグを使用したときにこの速度に戻るようになります。
コンフィグ画面などでゲーム全体の文字速度を変更したい場合にこのタグを使います。

★注意
あくまで演出のために一時的に文字速度を変更したいだけの場合には、[configdelay]タグではなく[delay]タグを使用します。

パラメータ必須解説初期値
speed

文字の表示速度を指定します。小さいほど早くなります。

ここで指定した値は、次の1文字を表示するまでの時間(ミリ秒単位)として解釈されます。たとえば1000と指定すると1秒ごとに1文字表示されていきます。


[nowait] テキスト瞬間表示モードの開始

  • メッセージ関連の設定

テキスト瞬間表示モードを開始します。このモード中は、テキスト全体が一瞬で表示されます。文字が1文字ずつ追加されていく処理(通常の処理)は行われません。

通常のモードに戻すには[endnowait]タグを使います。

パラメータ必須解説初期値
指定できるパラメータはありません。

[endnowait] テキスト瞬間表示モードの停止

  • メッセージ関連の設定

[nowait]によるテキスト瞬間表示モードを停止します。
テキストの表示速度は[nowait]タグを指定する前の状態に戻ります。

パラメータ必須解説初期値
指定できるパラメータはありません。

[resetfont] テキストスタイルのリセット

  • メッセージ関連の設定

テキストスタイルをもとに戻します。すなわち[deffont]で指定されたスタイルにリセットされます。

[font]タグで一時的(部分的)にテキストスタイルを変更したあと、[resetfont]でもとに戻す、というふうに活用できます。

テキストスタイルは、メッセージレイヤごとに個別に設定できます。

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
[deffont size=30]
デフォルトの文字サイズ[p]

[font size=55 bold=true]
うおおおおおおおおおお!!![p]

[resetfont]
い、いきなりなんだよ!
[font size=20](びっくりした…)[p]

[resetfont]

[skipstart] スキップモード開始

  • メッセージ関連の設定

スキップモードを開始します。テキストが一瞬で表示されるようになります。

パラメータ必須解説初期値
指定できるパラメータはありません。

[skipstop] スキップモード停止

  • メッセージ関連の設定

スキップモードを解除します。[cancelskip]と同じ動作。

パラメータ必須解説初期値
指定できるパラメータはありません。

[cancelskip] スキップモード解除

  • メッセージ関連の設定

スキップモードを解除します。[skipstop]と同じ動作。

パラメータ必須解説初期値
指定できるパラメータはありません。

[autostart] オートモード開始

  • メッセージ関連の設定

オートモードを開始します。テキストの文字数に応じた時間経過によってクリック待ちを自動的で通過するようになります。

オートモード時の進行速度はConfig.tjsautoSpeed、もしくは[autoconfig]タグを確認してください。

パラメータ必須解説初期値
指定できるパラメータはありません。

[autostop] オートモード停止

  • メッセージ関連の設定

オートモードを停止します。

パラメータ必須解説初期値
指定できるパラメータはありません。

[autoconfig] オート設定

  • メッセージ関連の設定

オートモードに関する設定を行います。

パラメータ必須解説初期値
speedオートモード時のスピードをミリ秒で指定してください
clickstop画面クリック時にオートモードを停止するかどうか。trueまたはfalseで指定します。falseを指定すると、画面をクリックしてもオートモードが止まらないようになります。

[position_filter] メッセージウィンドウ裏にフィルター効果

  • メッセージ関連の設定

メッセージウィンドウの裏側にフィルター効果をかけることができます。
これによって、たとえばメッセージウィンドウをすりガラスのように見せることができます。

パラメータ必須解説初期値
layer対象とするメッセージレイヤを指定します。message0
pageレイヤの表ページと裏ページ、どちらを対象とするか。foreまたはbackで指定します。省略すると、表ページとみなされます。fore
removetrueまたはfalsetrueを指定すると、フィルターを除去する処理を行います。false
grayscale0(デフォルト)~100を指定することで、画像の表示をグレースケールに変換できます。
sepia0(デフォルト)~100を指定することで、画像の表示をセピア調に変換できます。
saturate0100(デフォルト)を指定してあげることで、画像の表示の彩度(色の鮮やかさ)を変更できます。
hue0(デフォルト)~360を指定することで、画像の表示の色相を変更できます。
invert0(デフォルト)~100を指定することで、画像の表示の階調を反転させることができます。
opacity0100(デフォルト)を指定することで、画像の表示の透過度を変更できます。
brightness100(デフォルト)を基準とする数値を指定することで、画像の明度を変更できます。0で真っ暗に、100以上の数値でより明るくなります。
contrast0100(デフォルト)を指定することで、画像の表示のコントラストを変更できます。
blur0(デフォルト)~任意の値を指定することで、画像の表示をぼかすことができます。
  • サンプルコード
フィルターをかける[p]
[position_filter blur="5"]
すりガラスのような効果[p]
[position_filter invert="100"]
色調反転[p]
[position_filter grayscale="100"]
グレースケールに[p]

[nolog] バックログ記録の一時停止

  • メッセージ関連の設定

このタグに到達すると、テキストがバックログに記録されなくなります。

[endnolog]タグに到達すると、バックログへの記録が再開されます。

解説チュートリアル

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
ここはログに記録される[p]
[nolog]
ログに記録されない[p]
ここもログに記録されない[p]
[endnolog]
ここから、ログ記録再開[p]

[endnolog] バックログ記録の再開

  • メッセージ関連の設定

[nolog]タグで一時停止したバックログへの記録を再開します。

解説チュートリアル

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
ここはログに記録される[p]
[nolog]
ログに記録されない[p]
ここもログに記録されない[p]
[endnolog]
ここから、ログ記録再開[p]

[pushlog] バックログにテキスト追加

  • メッセージ関連の設定

バックログに任意のテキストを追加できます。

たとえば[mtext]で表示したアニメーションテキストは、そのままではバックログに記録されません。しかし、[mtext]に併せて[pushlog]を使うことで、バックログにアニメーションテキストの内容を記録することができます。

解説チュートリアル

パラメータ必須解説初期値
textバックログに追加するテキストを指定します。
joinバックログを前のテキストに連結するかどうか。trueまたはfalseで指定します。false
  • サンプルコード
[pushlog text="ここに好きなログ文字列を記述できます"]

[jump] シナリオのジャンプ

  • ラベル・ジャンプ操作

指定シナリオファイルの指定ラベルに移動します。

[call]タグとは異なり、[jump]タグの移動はコールスタックに残りません。つまり一方通行であり、[return]で戻ってくることはできません。

解説チュートリアル

パラメータ必須解説初期値
storageジャンプ先のシナリオファイル名を指定します。省略すると、現在のシナリオファイルとみなされます。
targetジャンプ先のラベル名を指定します。省略すると、シナリオファイルの先頭にジャンプします。
  • サンプルコード
;second.ks というシナリオファイルの *start ラベルへ移動する
[jump storage=second.ks target=*start]

[link] ハイパーリンク(選択肢)の開始

  • ラベル・ジャンプ操作

[link]タグと[endlink]タグで囲まれた部分のテキストをリンク化します。選択肢の表示として使用可能。

リンク化されたテキストはマウスやキーボードで選択可能になります。クリックやキー入力で選択されたときに、特定のシナリオファイルまたはラベルにジャンプします。

ページをまたいでテキストをリンク化することはできません。(行をまたぐことはできます)

選択肢を表示したあとには[s]タグを配置して進行を停止させる必要があります。

解説チュートリアル

パラメータ必須解説初期値
storageジャンプ先のシナリオファイル名を指定します。省略すると、現在のシナリオファイルとみなされます。
targetジャンプ先のラベル名を指定します。省略すると、シナリオファイルの先頭にジャンプします。
keyfocusfalseを指定すると、キーボードやゲームパッドで選択できなくなります。また12などの数値を指定すると、キーコンフィグのfocus_nextアクションでボタンを選択していくときの順序を指定できます。
  • サンプルコード
選択肢を表示します[l][r][r]

[link target=*select1]【1】選択肢 その1[endlink][r]
[link target=*select2]【2】選択肢 その2[endlink][r]

[s]

*select1
[cm]
「選択肢1」がクリックされました[l]
@jump target=*common

*select2
[cm]
「選択肢2」がクリックされました[l]
@jump target=*common

*common
[cm]

共通ルートです

[endlink] ハイパーリンク(選択肢)の終了

  • ラベル・ジャンプ操作

[link]タグと組み合わせて使います。リンク化を終了します。

解説チュートリアル

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
[link target=*select1]【1】選択肢 その1[endlink][r]
[link target=*select2]【2】選択肢 その2[endlink][r]

[button] グラフィカルボタンの表示

  • ラベル・ジャンプ操作

グラフィカルボタンを表示します。[link]タグの画像版となります。

グラフィックボタン表示中は強制的にシナリオ進行が停止しますので、必ずジャンプ先を指定してください。また、ジャンプ後に必ず[cm]タグを配置してボタンを消去する必要があります。

グラフィックボタンの表示位置は直前の[locate]タグによる指定位置を参照します。ただし、xy属性が指定されている場合はそちらが優先されます。

【通常の選択肢ボタン(fix=false)の場合】このボタンでシナリオを飛ぶときは[jump]タグでジャンプするときと同様、コールスタックに残りません。つまり、[return]タグで戻ってくることはできません。

【固定ボタン(fix=true)の場合】[call]タグでジャンプするときと同様、コールスタックに残ります。つまり、コール先から[return]タグで戻ってくる必要があります。

解説チュートリアル

パラメータ必須解説初期値
graphicボタンにする画像を指定します。ファイルはdata/imageフォルダに配置します。
folder画像が入っているフォルダを指定できます。デフォルトでは前景レイヤ用の画像はfgimageフォルダ、背景レイヤ用の画像はbgimageフォルダと決まっていますが、これを変更できます。image
storageジャンプ先のシナリオファイル名を指定します。省略すると、現在のシナリオファイルとみなされます。
targetジャンプ先のラベル名を指定します。省略すると、シナリオファイルの先頭にジャンプします。
name[anim]タグなどからこの名前でアニメーションさせられます。カンマで区切ることで複数指定できます。(高度な知識:name属性で指定した値はHTMLのクラス属性になります)
xボタンの横位置を指定します
yボタンの縦位置を指定します。
widthボタンの横幅をピクセルで指定できます
heightボタンの高さをピクセルで指定できます
fix

固定ボタン(セーブボタンなどの常に表示しておくボタン)にするかどうか。trueまたはfalseで指定します。通常の選択肢ボタンはfalse(デフォルト)。選択肢ボタンとは異なり、固定ボタンはそれが表示されている間も画面をクリックしてふつうにシナリオを読み進めることができます。

trueを指定すると、fixレイヤという特殊なレイヤにボタンが配置されます。fixレイヤに追加した要素を消す場合は[clearfix]タグを使います。

fixtrueを指定した場合は別のstoragetargetを指定して、そこにボタンが押されたときの処理を記述する必要があります。

fixtrueを指定した場合、コールスタックが残ります。コールスタックが消化されるまではボタンが有効にならないのでご注意ください。

false
roleボタンに特別な機能を割り当てることができます。この場合、storagetargetは無視されます。また、強制的にfix属性がtrueになります。指定できるキーワードは以下のとおりです。
save(セーブ画面を表示)
load(ロード画面を表示)
title(タイトル画面に戻る)
menu(メニュー画面を表示)
window(メッセージウィンドウの非表示)
skip(スキップモードを開始)
backlog(バックログを表示)
fullscreen(フルスクリーン切り替え)
quicksave(クイックセーブ実行)
quickload(クイックロード実行)
auto(オートモード開始)
sleepgame(ゲームの状態を保存してジャンプ)
expボタンがクリックされた時に実行されるJSを指定できます。
preexpタグが実行された時点で、この属性に指定した値が変数preexpに格納されます。そしてボタンがクリックされた時にexp内でpreexpという変数が利用できるようになります。
hintマウスカーソルをボタンの上で静止させたときに表示されるツールチップの文字列を指定できます。
clickseボタンをクリックした時に再生される効果音を設定できます。効果音ファイルはsoundフォルダに配置してください。
enterseボタンの上にマウスカーソルが乗った時に再生する効果音を設定できます。効果音ファイルはsoundフォルダに配置してください
leaveseボタンの上からマウスカーソルが外れた時に再生する効果音を設定できます。効果音ファイルはsoundフォルダに配置してください。
activeimgボタンの上でマウスボタンを押している間に切り替える画像ファイルを指定できます。ファイルはimageフォルダに配置してください。
clickimgボタンをクリックしたあとに切り替える画像ファイルを指定できます。ファイルはimageフォルダに配置してください。
enterimgボタンの上にマウスカーソルが乗った時に切り替える画像ファイルを指定できます。ファイルはimageフォルダに配置してください。
autoimgオートモードが開始されたときに切り替える画像ファイルを指定できます。ファイルはimageフォルダに配置してください。
skipimgスキップモードが開始されたときに切り替える画像ファイルを指定できます。ファイルはimageフォルダに配置してください。
visible最初からボタンを表示するかどうか。trueで表示、falseで非表示となります。true
auto_nexttrueまたはfalseを指定します。これにfalseが指定してあり、かつfix=trueの場合、[return]で戻ったときに次のタグに進まなくなります。yes
savesnaptrueまたはfalseで指定します。trueにすると、このボタンが押された時点でのセーブスナップを確保します。セーブ画面へ移動する場合はここをtrueにして、保存してからセーブを実行します。false
keyfocusfalseを指定すると、キーボードやゲームパッドで選択できなくなります。また12などの数値を指定すると、キーコンフィグのfocus_nextアクションでボタンを選択していくときの順序を指定できます。
  • サンプルコード
[locate x=20 y=100]
[button graphic="oda.png" target=*oda]

[locate x=300 y=100]
[button graphic="toyo.png" target=*toyo]

[glink_config] グラフィカルリンクの設定

  • ラベル・ジャンプ操作

V515以降で使用可能。

[glink](グラフィカルリンク)の自動配置の設定ができます。自動配置が有効の場合(デフォルトで有効)、xとyがどちらも指定されていない[glink]が自動配置の対象となります。自動配置対象の[glink]はすぐには表示されず、[s]タグに到達した時点で表示されるようになります。

省略したパラメータの設定は変更されません。

パラメータ必須解説初期値
auto_place[glink]の自動配置を有効にするかどうか。trueを指定すると、xとyが指定されていない[glink]を対象とする自動配置を有効にします。falseで無効。
auto_place_forcetrueを指定すると、xとyが指定されている[glink]も強制的に自動配置の対象にします。
margin_xボタンの外側に付ける横余白を数値(px)で指定します。
margin_yボタンの外側に付ける縦余白を数値(px)で指定します。
padding_xボタンの内側に付ける横余白を数値(px)で指定します。defaultを指定すると調整を行いません。
padding_yボタンの内側に付ける縦余白を数値(px)で指定します。defaultを指定すると調整を行いません。
widthmaxと指定すると、ボタンの横幅を『一番横幅の大きいボタンの横幅』に揃えることができます。数値を直接指定することで共通の横幅を指定することもできます。defaultを指定すると調整を行いません。
heightmaxと指定すると、ボタンの高さを『一番横幅の大きいボタンの高さ』に揃えることができます。数値を直接指定することで共通の高さを指定することもできます。defaultを指定すると調整を行いません。
verticalボタンの縦方向の揃え方をtop(上揃え)、center(中央揃え)、bottom(下揃え)のいずれかで指定します。
horizontalボタンの横方向の揃え方をleft(左揃え)、center(中央揃え)、right(右揃え)のいずれかで指定します。
wrapwrapを指定すると、ボタンが収まりきらないときの折り返しが有効になります。
place_area揃え方の基準となる領域の位置や大きさを指定できます。auto(デフォルト)を指定すると、メッセージウィンドウ考慮して自動で領域を調整します。coverだと画面全体を基準にします。領域の位置とサイズを直接指定したい場合は100,100,1000,1000のようにカンマ区切りで数値を4つ指定してください。そうすると、順にleft, top, width, heightとして解釈されます。
show_time表示アニメーションにかける時間をミリ秒単位で指定します。0を指定するとアニメーションを行いません。なお、アニメーション中はクリックすることができません。
show_effect表示アニメーションのエフェクトを以下のキーワードから指定できます。
fadeInfadeInDownfadeInLeftfadeInRightfadeInUplightSpeedInrotateInrotateInDownLeftrotateInDownRightrotateInUpLeftrotateInUpRightzoomInzoomInDownzoomInLeftzoomInRightzoomInUpbounceInbounceInDownbounceInLeftbounceInRightbounceInUprollInvanishInpuffIn
show_keyframe表示アニメーションとして[keyframe]タグで定義したキーフレームアニメーションのnameを指定できます。これを指定した場合、show_effectは無視されます。
show_delay各ボタンを表示していく際の遅延をミリ秒で指定できます。0だとすべてのボタンが同時に表示され、たとえば100と指定すると100ミリ秒ごとに1個ずつボタンが表示されます。
show_easing表示アニメーションの変化パターンを指定できます。以下のキーワードが指定できます。デフォルトはlinear
ease(開始時点と終了時点を滑らかに再生する)
linear(一定の間隔で再生する)
ease-in(開始時点をゆっくり再生する)
ease-out(終了時点をゆっくり再生する)
ease-in-out(開始時点と終了時点をゆっくり再生する)
この他にcubic-bezier関数を使って独自のイージングを指定することも可能です。
select_timeボタンが選択されたときの退場アニメーションにかける時間をミリ秒単位で指定します。0を指定するとアニメーションを行いません。
select_effect

選択時の退場アニメーションのエフェクトを以下のキーワードが指定できます。

fadeOutfadeOutDownBigfadeOutLeftBigfadeOutRightBigfadeOutUpBigflipOutXflipOutYlightSpeedOutrotateOutrotateOutDownLeftrotateOutDownRightrotateOutUpLeftrotateOutUpRightzoomOutzoomOutDownzoomOutLeftzoomOutRightzoomOutUpslideOutDownslideOutLeftslideOutRightslideOutUpbounceOut bounceOutDownbounceOutLeftbounceOutRightbounceOutUp

select_keyframe選択時の退場アニメーションとして[keyframe]タグで定義したキーフレームアニメーションのnameを指定できます。これを指定した場合、select_effectは無視されます。
select_delay選択時の退場アニメーションを開始するまでの遅延をミリ秒単位で指定します。
select_easing選択時の退場アニメ―ションのイージングを指定します。
reject_timeボタンが選択されなかったときの退場アニメーションにかける時間をミリ秒単位で指定します。0を指定するとアニメーションを行いません。
reject_effect

非選択時の退場アニメーションのエフェクトを以下のキーワードが指定できます。

fadeOutfadeOutDownBigfadeOutLeftBigfadeOutRightBigfadeOutUpBigflipOutXflipOutYlightSpeedOutrotateOutrotateOutDownLeftrotateOutDownRightrotateOutUpLeftrotateOutUpRightzoomOutzoomOutDownzoomOutLeftzoomOutRightzoomOutUpslideOutDownslideOutLeftslideOutRightslideOutUpbounceOut bounceOutDownbounceOutLeftbounceOutRightbounceOutUp

reject_keyframe非選択時の退場アニメーションとして[keyframe]タグで定義したキーフレームアニメーションのnameを指定できます。これを指定した場合、reject_effectは無視されます。
reject_delay選択時の退場アニメーションを開始するまでの遅延をミリ秒単位で指定します。
reject_easing選択時の退場アニメ―ションのイージングを指定します。
  • サンプルコード
[glink_config auto_place="true" show_time="300"]
[position left="160" top="500" width="1000" height="200" visible="true"]
[position margint="45" marginl="50" marginr="70" marginb="60"]
ティラノスクリプトに興味ある?[l]
[glink  color="btn_13_red" text="はい。興味あります"  target="*selectinterest"]
[glink  color="btn_13_red" text="興味あります!"  target="*selectinterest"]
[glink  color="btn_13_red" text="どちらかと言うと興味あり"  target="*selectinterest"]
[s]

*selectinterest
ホント!?うれしいなー[p]

[glink] グラフィカルリンク

  • ラベル・ジャンプ操作

グラフィカルリンク(テキストボタン)を表示できます。画像は必要ありません。

グラフィックリンク表示中は強制的にシナリオ進行が停止しますので、必ずジャンプ先を指定してください。

グラフィックリンクの表示位置は直前の[locate]タグによる指定位置を参照します。ただし、xy属性が指定されている場合は、そちらが優先されます。

このボタンでシナリオを移動するときは、[jump]タグでジャンプするときと同様に、コールスタックに残りません。つまり、[return]タグで戻ってくることはできません。

ジャンプ後は自動的に[cm]タグが実行され、ボタンが消去されます。

glinkはV501c以降で大幅にデザインが追加されています。ぜひ次のURLからサンプルをご覧ください。
https://tyrano.jp/sample2/code/siryou/1

解説チュートリアル

パラメータ必須解説初期値
color

ボタンの色をキーワードで指定できます。デフォルトはblackです。blackgraywhiteorangeredbluerosygreenpinkのキーワードが指定できます。

V501c以降では200パターン以上のデザインが追加されました。詳しくは https://tyrano.jp/sample2/code/siryou/1 をご覧ください。

black
font_colorフォントの色を0xRRGGBB形式で指定します。
storageジャンプ先のシナリオファイル名を指定します。省略すると、現在のシナリオファイルとみなされます。
targetジャンプ先のラベル名を指定します。省略すると、シナリオファイルの先頭にジャンプします。
name[anim]タグなどからこの名前でアニメーションさせられます。カンマで区切ることで複数指定できます。(高度な知識:name属性で指定した値はHTMLのクラス属性になります)
textテキストの内容を指定します。
font_colorフォントの色を指定できます。
xボタンの横位置を指定します。auto
yボタンの縦位置を指定します。
widthボタンの横幅をピクセルで指定できます。
heightボタンの高さをピクセルで指定できます。
sizeフォントサイズを指定できます。30
faceフォントを指定できます。Webフォントを使用する場合はtyrano/css/font.cssに定義を記述してください。
graphicボタンの背景画像を指定します。ファイルはdata/imageフォルダに入れてください。画像が指定された場合はcolorは無視されます。
enterimggraphicが指定されている時に有効。カーソルが重なった時の画像を指定できます
clickseボタンをクリックした時に再生される効果音を設定できます。効果音ファイルはdata/soundフォルダに配置してください
enterseボタンの上にマウスカーソルが乗った時に再生する効果音を設定できます。効果音ファイルはsoundフォルダに配置してください
leaveseボタンの上からマウスカーソルが外れた時に再生する効果音を設定できます。効果音ファイルはsoundフォルダに配置してください。
cm

ボタンクリック後に[cm]を実行するかどうか。[glink]は通常、ボタンクリック後に自動的に[cm]が実行されますが、falseを指定するとこの[cm]を実行しません。

プレイヤー入力などの決定を[glink]で行いたい場合はfalseを指定しておき、[commit]後に手動で[cm]を実行してボタンや入力ボックスを消してください。

true
expボタンがクリックされた時に実行されるJSを指定できます。
preexpタグが実行された時点で、この属性に指定した値が変数preexpに格納されます。そしてボタンがクリックされた時にexp内でpreexpという変数が利用できるようになります。
bold太字にする場合はtrueを指定します。
opacity領域の不透明度を0255の数値で指定します。0で完全に透明です。
edge文字の縁取りを有効にできます。縁取り色を0xRRGGBB形式等で指定します。
V515以降:縁取りの太さもあわせて指定できます。4px 0xFF0000のように、色の前に縁取りの太さをpx付きで記述します。太さと色は半角スペースで区切ってください。さらに4px 0xFF0000, 2px 0xFFFFFFのようにカンマ区切りで複数の縁取りを指定できます。
shadow文字に影をつけます。影の色を0xRRGGBB形式で指定します。
keyfocusfalseを指定すると、キーボードやゲームパッドで選択できなくなります。また12などの数値を指定すると、キーコンフィグのfocus_nextアクションでボタンを選択していくときの順序を指定できます。
  • サンプルコード
[glink target="j1" text="選択肢1" size=20  width="500" y=300]
[glink target="j2" text="選択肢2" size=30  width="500" y=400]
[glink target="j3" text="選択肢3" size=30  width="500" y=400]

[s]

[clickable] クリック可能な領域を設定

  • ラベル・ジャンプ操作

透明なクリック可能領域を設定できます。

クリッカブルエリアの表示中は強制的にシナリオ進行が停止しますので、必ずジャンプ先を指定してください。

このボタンでシナリオを移動するときは、[jump]タグでジャンプするときと同様に、コールスタックに残りません。つまり、[return]タグで戻ってくることはできません。

[s]タグに到達していない間は、クリッカブルは有効になりません。必ず[s]タグでゲームを停止させてください。

解説チュートリアル

パラメータ必須解説初期値
width領域の横幅を指定します。0
height領域の高さを指定します。0
x領域の左端位置のX座標を指定します。
y領域の左端位置のY座標を指定します。
borderstyle領域に表示する線のデザインを指定できます。線の太さ:線の種類:線の色のフォーマットで記述してください。各項目はCSSの記法で記述します。線の種類はsoliddoublegroovedashed dottedなどが指定できます。
color表示色を0xRRGGBB形式で指定します。
opacity領域の不透明度を0255の数値で指定します。0で完全に透明です。140
mouseopacity領域にマウスが乗ったときの不透明度を指定できます。
storageジャンプ先のシナリオファイル名を指定します。省略すると、現在のシナリオファイルとみなされます。
targetジャンプ先のラベル名を指定します。省略すると、シナリオファイルの先頭にジャンプします。
  • サンプルコード
[locate x=20 y=100]
[clickable width=200 height=300 target=*oda]

[locate x=300 y=100]
[clickable width=100 height=100 border="10px:dotted:red" target=*oda]

[s]

[chara_ptext] キャラクターの名前表示と表情変更

  • キャラクター操作

キャラクターの名前を表示するためのタグです。いましゃべっているキャラクターの名前をメッセージウィンドウの上部に出すのが主な使い方になるでしょう。face属性を指定することで、名前を出すと同時にそのキャラクターの表情を変更することもできます。

あらかじめ[ptext]で作っておいたテキスト領域にキャラクターの名前を上書きする処理を行います。[chara_ptext]を使用する前に[ptext]および[chara_config]による事前準備が必要になります。実際の手順はサンプルコードを参照してください。

このタグは省略して書くことができます。省略記法では、行の先頭に#を書き、続けてname属性に指定する値を書きます。表情を変更する場合は続けて:を書き、face属性に指定する値を書きます。

つまり、#akane:gekioko[chara_ptext name=akane face=gekioko]は同じ動作をします。

パラメータ必須解説初期値
name[chara_new]タグで定義したnameを指定します。それをひもついたjnameがテキストエリアに表示されます。そのnameのキャラクター定義が存在しなかった場合、nameに指定された内容がそのままテキストエリアに表示されます。
face[chara_face]タグで定義したfaceを指定します。
  • サンプルコード
;レイヤ0を表示
[layopt layer="0" visible="true"]

;テキスト領域をレイヤ0に作成
[ptext layer="0" name="name_space" x="100" y="200" text="ここにキャラの名前が入る"]

;↑で作ったテキスト領域(name_space)をキャラ名表示用であると宣言する
[chara_config ptext="name_space"]

;キャラ定義
[chara_new name="akane" storage="chara/akane/normal.png" jname="あかね"]
[chara_new name="yamato" storage="chara/yamato/normal.png" jname="やまと"]

;キャラ名表示!
[chara_ptext name="akane"]
あかねです[p]

;このような省略記法もあります(行頭に#を書いて、キャラのnameを続けて書く)
;実際にはこの書き方を使うことがほとんどでしょう
#yamato
やまとです[p]

;消去もできる
#
地の文です[p]

;キャラ登録されていなくてもOK
#???
こんにちは[p]

[chara_config] キャラクター操作タグの基本設定

  • キャラクター操作

キャラクター操作タグの基本設定を変更できます

解説チュートリアル

パラメータ必須解説初期値
pos_modetrueまたはfalseを指定します。デフォルトはtrueです。trueの場合、[chara_show]タグでキャラクターを表示したときの立ち位置を自動的に計算して配置します。
ptext[ptext]で作っておいた、キャラクターの名前を表示するためのテキスト領域のnameを指定します。詳しくは[chara_ptext]の項目を参照してください。
time[chara_mod]タグで表情を変える際のクロスフェード時間をミリ秒で指定します。0を指定すると瞬間的に切り替わります。
memoryキャラクターを退場させたときの表情を記憶しておくかどうか。trueまたはfalseを指定します。trueを指定すると、キャラクターを再登場させたときに、前回退場時の表情のまま表示されます。
animpos_mode=trueによってキャラクターの自動配置が有効になっている場合に、キャラクターの立ち位置変化のアニメーションを行うかどうか。trueまたはfalseで指定します。
pos_change_timeキャラクターの位置を自動で調整する際のアニメーション時間をミリ秒で指定します。
talk_focus現在話しているキャラクターの立ち絵を目立たせる演出を有効にするための設定です。以下のキーワードが指定できます。brightness(明度)、blur(ぼかし)、none(無効)
現在誰が話しているかの指定は[chara_ptext]タグもしくはその省略表記である#akaneのような記述で行います。
brightness_valuetalk_focus=brightnessの場合の、話していないキャラクターの明度を0100で指定します。デフォルトは60。つまり、話していないキャラクターをちょっと暗くします。
blur_valuetalk_focus=blurの場合の、話していないキャラクターのぼかし度合を数値で指定します。デフォルトは2。数値が大きくなるほど強くぼけるようになります。
talk_animキャラクターが話し始めるときに、キャラクターの立ち絵にピョンと跳ねるようなアニメーション演出を自動で加えることができる設定です。以下のキーワードが指定できます。up(上に跳ねる)、down(下に沈む)、zoom(拡大)、none(無効)
talk_anim_timetalk_animが有効な場合の、アニメーション時間をミリ秒で指定できます。
talk_anim_valuetalk_animが有効な場合の、キャラクターの移動量を指定できます。(ピクセル)
talk_anim_zoom_ratetalk_animzoomを使用している場合の拡大率を指定します。デフォルトは1.2
effectキャラクターが位置を入れ替わる際のエフェクト(動き方)を指定できます。指定できるキーワードは次のとおりです。jswingdefeaseInQuadeaseOutQuadeaseInOutQuadeaseInCubiceaseOutCubiceaseInOutCubiceaseInQuarteaseOutQuarteaseInOutQuarteaseInQuinteaseOutQuinteaseInOutQuinteaseInSineeaseOutSineeaseInOutSineeaseInExpoeaseOutExpoeaseInOutExpoeaseInCirceaseOutCirceaseInOutCirceaseInElasticeaseOutElasticeaseInOutElasticeaseInBackeaseOutBackeaseInOutBackeaseInBounceeaseOutBounceeaseInOutBounce

[chara_new] キャラクターの定義

  • キャラクター操作

登場するキャラクターの情報を定義します。

このタグでキャラクターを定義しておくことで、[chara_show]タグでそのキャラクターを表示したり、[chara_mod]タグでキャラクターの表情を変更したりできます。

このタグに指定したnameパラメータは[chara_show]を始めとするキャラクター操作系のタグに使われます。他にも[anim]タグや[kanim]タグにキャラクターのnameを指定することもできます。つまり、キャラクターを自由にアニメーションさせられます。

解説チュートリアル

パラメータ必須解説初期値
nameキャラクターを管理するための名前を半角英数で指定します。このnameは必ずユニーク(一意、固有)である必要があります。すなわち、他のキャラクターとnameが重複してはいけません。また[ptext][image]などのタグに指定するnameとも重複してはいけません。
storageキャラクター画像を指定します。画像ファイルはdata/fgimageフォルダに配置します。
width画像の横幅を指定できます。
height画像の高さを指定できます。
reflect画像を左右反転するかどうか。trueまたはfalseで指定します。trueを指定すると、画像を左右反転して表示します。false
colorキャラクターの名前を表示するときの色を指定できます。0xRRGGBB形式で指定します。
jnameこのキャラクターをネームスペースに表示する場合、適用する名称を指定できます。例えば、#yuko と指定すると メッセージエリアに ゆうこ と表示できます
  • サンプルコード
[chara_new name=yuko storage=yuko.png jname=ゆうこ]

[chara_show] キャラクターの登場

  • キャラクター操作

定義しておいたキャラクターを画面に表示します。

解説チュートリアル

パラメータ必須解説初期値
name[chara_new]で定義したname属性を指定します。
timeミリ秒で指定します。指定した時間をかけて登場します。1000
layerキャラクターを配置するレイヤを0以上の整数で指定します。0
zindexキャラクターの重なりを指定できます。ここで指定した値が大きいほうが前に表示できます。省略すると、後に登場するキャラクターが前に表示されます。"1
depthzindexが同一な場合の重なりをfront(最前面)、back(最後面) で指定できます。front
pageforeかbackを指定します。fore
waittrueを指定すると、キャラクターの登場完了を待ちます。true
face[chara_face]タグで定義したface属性を指定します。
storage変更する画像ファイルを指定します。画像ファイルはdata/fgimageフォルダに配置します。
reflect画像を左右反転するかどうか。trueまたはfalseで指定します。trueを指定すると、画像を左右反転して表示します。
widthキャラクターの横幅を指定できます。
heightキャラクターの縦幅を指定できます。
leftキャラクターの横位置を指定できます。指定した場合、自動配置が有効であっても無効になります。
topキャラクターの縦位置を指定できます。指定した場合、自動配置が有効であっても無効になります。
  • サンプルコード
[chara_show name="yuko" ]

[chara_hide] キャラクターの退場

  • キャラクター操作

[chara_show]タグで表示したキャラクターを退場させます。

解説チュートリアル

パラメータ必須解説初期値
name[chara_new]で定義したname属性を指定します。
timeフェードアウト時間をミリ秒で指定します。1000
waitフェードアウトの完了を待つかどうか。trueまたはfalseで指定します。true
layer削除対象のレイヤ。[chara_show]でにレイヤ指定した場合はここでも指定します。0
pos_modeキャラクターの立ち位置自動調整が有効な場合に、このパラメータにfalseを指定すると退場後に立ち位置の調整を行いません。true
  • サンプルコード
[chara_hide name="yuko"]

[chara_hide_all] キャラクターを全員退場

  • キャラクター操作

[chara_show]タグで表示したキャラクターを全員退場させます。

パラメータ必須解説初期値
timeフェードアウト時間をミリ秒で指定します。1000
waitフェードアウトの完了を待つかどうか。trueまたはfalseで指定します。true
layer削除対象のレイヤ。[chara_show]でにレイヤ指定した場合はここでも指定します。0
  • サンプルコード
[chara_hide_all time=1000 wait=true]

[chara_delete] キャラクター情報の削除

  • キャラクター操作

キャラクターの定義情報を削除します。

キャラクターの立ち絵を画面から退場させたい場合はこのタグではなく[chara_hide]を使用してください。

パラメータ必須解説初期値
name[chara_new]で定義したname属性を指定します。
  • サンプルコード
[chara_delete="yuko" ]

[chara_mod] キャラクター画像変更

  • キャラクター操作

キャラクター画像を変更します。表情変更に活用できます。

解説チュートリアル

パラメータ必須解説初期値
name[chara_new]で定義したnameを指定します。
face[chara_face]で定義したfaceを指定します。
time[chara_mod]タグで表情を変える際のクロスフェード時間をミリ秒で指定します。0を指定すると瞬間的に切り替わります。
storage変更する画像ファイルを指定します。画像ファイルはdata/fgimageフォルダに配置します。
reflect画像を左右反転するかどうか。trueまたはfalseで指定します。trueを指定すると、画像を左右反転して表示します。
wait表情変更のクロスフェードが終わるのを待つかどうか。trueまたはfalseで指定します。true
cross

クロスフェードの方式をtrueまたはfalseを指定します。trueを指定すると、旧画像がフェードアウトさせるのと同時に新画像をフェードインさせます。falseを指定すると、旧画像を残したままその上に新画像をフェードインさせます。

trueの場合、クロスフェードの瞬間にキャラクターが若干透けて背景が見えてしまうことがあります。そのような場合はfalseを指定することでキャラクターを透けさせずに表情変更ができます。ただし透けなくはなりますが、シルエットが変わるような表情変更の場合は違和感が出ることがあります。

true
  • サンプルコード
[chara_mod name="yuko" storage="newface.png"]

[chara_move] キャラクターの位置変更

  • キャラクター操作

キャラクターの立ち位置や大きさを変更します。指定時間をかけてアニメ―ションさせることもできます。

パラメータ必須解説初期値
name[chara_new]で定義したnameを指定します。
left変更後の横位置を指定できます。left="+=200"left="-=200"のように指定すると、「いまの場所からどれだけ動くか」という相対指定ができます。
top変更後の縦位置を指定できます。top="+=100"top="-=100"のように指定すると、「いまの場所からどれだけ動くか」という相対指定ができます。
width変更後の横幅を指定できます。
height変更後の高さを指定できます。
animアニメーションさせるかどうか。truefalseで指定します。trueを指定すると、位置を変更するときにアニメーションさせることができます。この場合、アニメーション効果は[chara_config]effectパラメータを参照します。false
timeアニメーション時間をミリ秒で指定します。600
waitアニメーションの完了を待つかどうか。truefalseで指定します。true
effect変化のエフェクトを指定します。以下のキーワードが指定できます。jswingdefeaseInQuadeaseOutQuadeaseInOutQuadeaseInCubiceaseOutCubiceaseInOutCubiceaseInQuarteaseOutQuarteaseInOutQuarteaseInQuinteaseOutQuinteaseInOutQuinteaseInSineeaseOutSineeaseInOutSineeaseInExpoeaseOutExpoeaseInOutExpoeaseInCirceaseOutCirceaseInOutCirceaseInElasticeaseOutElasticeaseInOutElasticeaseInBackeaseOutBackeaseInOutBackeaseInBounceeaseOutBounceeaseInOutBounce
  • サンプルコード
[chara_move name="yuko" time=100 left=20 top=100 ]

[chara_face] キャラクター表情登録

  • キャラクター操作

キャラクターの表情画像を登録できます。

パラメータ必須解説初期値
name表情を登録するキャラクターの名前。[chara_new]で定義したname属性を指定します。
face登録する表情の名前を指定します。happyangryなど、自分がわかりやすいものを自由につけましょう。
storage画像ファイルを指定します。画像ファイルはdata/fgimageフォルダに配置します。
  • サンプルコード
;表情の登録
[chara_face name="yuko" face="angry" storage="newface.png"]

;表情の適用
[chara_mod name="yuko" face="angry"]

;発言者の名前も同時にかえたい場合
[chara_ptext name="yuko" face="angry"]

;短縮して書けます。以下も同じ意味
#yuko:angry

;chara_new で登録した画像はdefaultという名前で指定可能
#yuko:default

[chara_layer] キャラクターの差分パーツ定義

  • キャラクター操作

キャラクターの表情を差分パーツを定義します。
デフォルトのパーツは一番最初に登録したものになります。

パラメータ必須解説初期値
nameパーツを登録するキャラクターの名前。[chara_new]で定義したname属性を指定します。
partパーツとして登録する名前を指定します。例えばというパーツをpartを登録しておき、このpartの中で他の差分をいくつでも登録できます。
idパーツの中の差分を識別するための名前を指定します。例えばというpartの中で笑顔の目泣いてる目のようにidを分けて登録できます。
storage差分として登録する画像を指定します。画像はdata/fgimageフォルダの中に配置します。noneを指定すると、デフォルトでそのパーツがない状態を表現できます。
zindexこのパーツが他のパーツと重なった時にどちらが前面に表示されるかを決定するための優先度を数字で指定します。数字が大きいほど前面に表示されます。一度登録しておけば、同パーツの他の差分にも適用されます。
  • サンプルコード
[chara_layer name="yuko" part=mouse id=egao storage="image/egao.png" ]

[chara_layer_mod] キャラクターの差分の定義を変更

  • キャラクター操作

[chara_layer]タグで定義した設定を変更できます。

パラメータ必須解説初期値
nameパーツ定義の変更対象となるキャラクターの名前。[chara_new]で定義したname属性を指定します。
part変更したいパーツ名を指定します。
zindexこのパーツが他のパーツと重なった時にどちらが前面に表示されるかを決定するための優先度を数字で指定します。数字が大きいほど前面に表示されます。この設定は即時反映されません。次回表示時に反映されます。
  • サンプルコード
[chara_layer_mod name="yuko" part=mouse zindex=20 ]

[chara_part] キャラクターの差分パーツ変更

  • キャラクター操作

[chara_layer]タグで定義したパーツ差分の実際の表示を切り替えます。

このタグのパラメータの指定の方法は特殊です。[chara_layer]タグで定義したpartidの組み合わせをパラメータとして自由に指定できます。

[chara_part name=yuko eye=happy]

同時に複数のpartを変更することも可能です。
id登録をせずに差分画像ファイルを直接指定することもできます。この場合、allow_storage=trueを指定してください。
特定部位のzindexを変更して出力するために、part名+_zindexという名前のパラメータに数値を指定できます。

[chara_part name=yuko eye=happy eye_zindex=10]

パラメータ必須解説初期値
name[chara_new]で指定したキャラクター名を指定します。
timeパーツが表示されるまでのフェードイン時間を指定できます。ミリ秒で指定します。
waitフェードインの完了を待つかどうか。trueまたはfalseで指定します。true
allow_storagetrueまたはfalsetrueを指定すると、partの指定にidではなく直接画像ファイルを指定できます。画像はfgimageフォルダに配置してください。false
  • サンプルコード
[chara_part name=yuko mouse=happy eye=happy]

[chara_part_reset] キャラクターの差分パーツをデフォルトに戻す

  • キャラクター操作

[chara_part]で差分を変更した際、デフォルトの表情に戻すことができます。
キャラクターが表示されている場合は即時デフォルトに戻ります。

パラメータ必須解説初期値
name[chara_new]で指定したキャラクター名を指定します。
part特定のpartに絞ってリセットすることが可能です。カンマ区切りで複数指定が可能です。省略すると、すべてのパーツをデフォルトに戻します。
  • サンプルコード
[chara_part_reset name=yuko]

[image] 画像を表示

  • 画像・背景・レイヤ操作

指定したレイヤに画像を追加します。キャラクター表示や背景切り替えなどに使用できます。

初期状態ではレイヤ自体が非表示になっているため、そのままでは[image]タグで画像を追加しても画面に表示されません。はじめに[layopt]タグでレイヤ自体を表示状態にする必要があります。

解説チュートリアル

パラメータ必須解説初期値
storage画像ファイル名を指定します。ファイルは背景レイヤならdata/bgimage、前景レイヤならdata/fgimageに入れてください。
layer画像を追加するレイヤを指定します。
baseを指定すると背景レイヤ。0以上の整数を指定すると対応する前景レイヤに画像を表示します。
base
pageレイヤの表ページと裏ページ、どちらを対象とするか。foreまたはbackで指定します。省略すると、表ページとみなされます。fore
visibletrueまたはfalseを指定します。trueを指定すると、画像を追加すると同時に対象レイヤを表示状態にします。つまり、[layopt visible="true"]を省略できます。
left画像の左端位置を指定します。(ピクセル)
top画像の上端位置を指定します。(ピクセル)
x画像の左端位置を指定します。leftと同様。こちらが優先度高。(ピクセル)
y画像の上端位置を指定します。topと同様。こちらが優先度高。(ピクセル)
width画像の横幅を指定します。(ピクセル)
height画像の高さを指定します。(ピクセル)
folder画像が入っているフォルダを指定できます。デフォルトでは前景レイヤ用の画像はfgimageフォルダ、背景レイヤ用の画像はbgimageフォルダと決まっていますが、これを変更できます。
name[anim]タグなどからこの名前でアニメーションさせられます。カンマで区切ることで複数指定できます。(高度な知識:name属性で指定した値はHTMLのクラス属性になります)
timeフェードイン時間をミリ秒単位で指定します。これを指定すると、画像が透明な状態から徐々に表示されていきます。省略すると、一瞬で表示されます。
waitフェードインの完了を待つかどうか。trueまたはfalseで指定します。true
zindex画像同士の重なりを指定できます。数値が大きい方が前に表示されます。1
depthzindexが同一な場合の重なりを指定できます。front(最前面)またはback(最後面)で指定します。デフォルトはfront。front
reflecttrueを指定すると左右反転します。
pos

画像の位置をキーワードで決定します。

指定できるキーワードはleft(左端)、left_center(左寄り)、center(中央)、right_center(右寄り)、right(右端)。各キーワードに対応する実際の座標はConfig.tjsで設定されており、自由に編集できます。

各キーワードにはそれぞれ省略形があり、llccrcrと指定することもできます。動作は同じです。

この属性を指定した場合はleftパラメータは無視されます。

layerbaseと指定した場合、この属性は指定しないでください。

  • サンプルコード
;レイヤ1を表示状態に
[layopt layer="1" visible="true"]
;レイヤ1にcat.pngを追加
[image layer="1" x="150" y="150" storage="cat.png"]
[l]

;画像を削除
[freeimage layer="1"]

[freeimage] レイヤのクリア

  • 画像・背景・レイヤ操作

指定したレイヤに存在する画像などをすべて削除します。

解説チュートリアル

パラメータ必須解説初期値
layer対象のレイヤを指定します。
pageレイヤの表ページと裏ページ、どちらを対象とするか。foreまたはbackで指定します。省略すると、表ページとみなされます。fore
timeフェードアウト時間をミリ秒単位で指定します。これを指定すると、画像が徐々に透明になっていきます。省略すると、一瞬で消去されます。
waitフェードアウトの完了を待つかどうか。trueまたはfalseで指定します。true
  • サンプルコード
;イメージを配置
[image layer="0" page="fore" visible="true" top="100" left="300"  storage="chara.png"]

;レイヤをクリア
[freeimage layer="0"]

;名前を指定してイメージを配置
[image name="myimg" layer="0" visible="true" top="100" left="300"  storage="myimg.png"]

;イメージの名前を指定して1つだけ消す
[free name="myimg" layer="0"]

[free] オブジェクトの解放

  • 画像・背景・レイヤ操作

レイヤに追加されたnameで指定された要素をすべて削除します。name指定は必須です。

解説チュートリアル

パラメータ必須解説初期値
layer対象のレイヤを指定します。
name削除する要素のnameを指定します。レイヤ内のあらゆる要素に適応できます。
timeフェードアウト時間をミリ秒単位で指定します。これを指定すると、画像が徐々に透明になっていきます。省略すると、一瞬で消去されます。
waitフェードアウトの完了を待つかどうか。trueまたはfalseで指定します。true
  • サンプルコード
[backlay]
;キャラクター表示
[image name="myimage" layer=0 page=back visible=true top=100 left=300  storage = chara.png]
[trans time=2000]
@wt

;キャラクター非表示
[free name="myimage" layer=0 ]

[backlay] レイヤ情報の表ページから裏ページへのコピー

  • 画像・背景・レイヤ操作

指定したレイヤ(あるいはすべてのレイヤ)の情報を、表ページから裏ページにコピーします。

[trans]タグと組み合わせて使います。まず[backlay]タグで表ページの画像を裏ページにコピーし、裏ページで画像の書き変えを行なってから、[trans]で裏ページの画像を表に持ってくる……というふうにすると、画像の書き変え最中の様子がゲーム画面上に映ってしまう心配がありません。

解説チュートリアル

パラメータ必須解説初期値
layer対象となるレイヤを指定します。baseを指定すると背景レイヤに、0以上の整数を指定すると前景レイヤに、message0message1のように指定するとメッセージレイヤになります。messageとのみ指定した場合は[current]タグで指定してある現在の操作対象のメッセージレイヤが対象になります。省略すると、すべてのレイヤの情報が裏ページにコピーされます。
  • サンプルコード
;背景変更をトランジションで実施
@layopt layer=message0 visible=false
[backlay]
[image layer=base page=back storage=rouka.jpg]
[trans time=2000]
[wt]

[wt] トランジションの終了待ち

  • 画像・背景・レイヤ操作

トランジションが終了するまで、待ちます。

解説チュートリアル

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
[backlay]
[image layer=base page=back storage=rouka.jpg]
[trans time=2000]
トランジションしてるよ……
[wt]

[cm]
トランジションが終わったよ[p]

[layopt] レイヤの属性設定

  • 画像・背景・レイヤ操作

レイヤの属性を指定します。

解説チュートリアル

パラメータ必須解説初期値
layer対象となる前景レイヤまたはメッセージレイヤを指定します。messageとのみ指定した場合は、[current]タグで指定した現在の操作対象のメッセージレイヤが対象となります。
page対象レイヤの表ページと裏ページのどちらを対象とするか。forebackで指定します。ただしlayer属性にmessageとのみ指定し、さらにこの属性を省略した場合には、現在操作対象のページが選択されます。fore
visiblelayer属性で指定したレイヤを表示するかどうか。trueを指定するとレイヤは表示状態に、falseを指定すると非表示状態になります。省略すると、表示状態は変更されません。
leftlayer属性で指定したレイヤの左端位置を指定します。省略すると位置は変更されません。(メッセージウィンドウの位置やデザインを調整したい場合はこのタグの代わりに[position]タグを使用します)
toplayer属性で指定したレイヤの上端位置を指定します。省略すると位置は変更されません。(メッセージウィンドウの位置やデザインを調整したい場合はこのタグの代わりに[position]タグを使用します)
opacityレイヤの不透明度を0255の範囲で指定します。0で完全に透明、255で完全に不透明。
  • サンプルコード
;メッセージレイヤを消去
@layopt layer=message0 visible=false
[backlay]
[image layer=0 page=back visible=true top=100 left=50  storage = miku1.png]
[trans time=2000]
@wt
;そしてレイヤ表示
@layopt layer=message0 visible=true

[locate] 表示位置の指定

  • 画像・背景・レイヤ操作

グラフィックボタンの表示位置を指定します。
テキストには対応していません。

パラメータ必須解説初期値
x横方向の位置を指定します。(ピクセル)
y縦方向の位置を指定します。(ピクセル)
  • サンプルコード
[locate x=20 y=100]
[button graphic="oda.png" target=*oda]

[locate x=300 y=100]
[button graphic="toyo.png" target=*toyo]

[trans] レイヤのトランジション

  • 画像・背景・レイヤ操作

指定したレイヤでトランジションを行います。

指定したレイヤに対して、裏ページの内容を表ページに持ってくる処理を行います。トランジション後の表ページの内容(画像、位置、サイズ、表示状態など)はもとの裏ページと同一になります。

トランジション中はレイヤの属性変更などは行わないでください。

解説チュートリアル

パラメータ必須解説初期値
layer対象となるレイヤを指定します。baseを指定すると背景レイヤ、0以上の整数を指定すると前景レイヤ、message0message1を指定するとメッセージレイヤを指定できます。messageとのみ指定した場合は、[current]タグで指定した現在の操作対象のメッセージレイヤが対象になります。(通常は背景の変更などに使用されます)base
timeトランジション時間をミリ秒で指定します。1500
method

切り替えのタイプを指定します。デフォルトはfadeInです。指定できる演出は次の通りです。

【V450以降】fadeInfadeInDownfadeInLeftfadeInRightfadeInUplightSpeedInrotateInrotateInDownLeftrotateInDownRightrotateInUpLeftrotateInUpRightzoomInzoomInDownzoomInLeftzoomInRightzoomInUpslideInDownslideInLeftslideInRightslideInUpbounceIn bounceInDownbounceInLeftbounceInRightbounceInUprollInvanishInpuffIn

【V450以前】crossfadeexplodeslideblindbounceclipdropfoldpuffscaleshakesize

fadeIn
children【廃止】falseの場合、layerで指定した場所だけトランジションします。デフォルトはfalseです。
  • サンプルコード
[backlay]
[image storage=fg0 layer=0 page=back]
[trans time=1500 ]
[wt]

[bg] 背景の切り替え

  • 画像・背景・レイヤ操作

背景の切り替えを簡易的に実行できます。
常にforeのレイヤに対して切り替えが実行されます。

解説チュートリアル

パラメータ必須解説初期値
storage画像ファイル名を指定します。ファイルはdata/bgimageに配置してください
time背景の切り替えにかける時間をミリ秒で指定します。3000
wait背景の切り替えを待つかどうか。trueまたはfalseで指定します。falseを指定すると、切り替えの完了を待たずに次のタグに進みます。true
crosstrueまたはfalseを指定します。デフォルトはfalsetrueを指定すると、2つの画像が同じタイミングで透明になりながら入れ替わります。falseを指定すると、古い背景を残しながら上に重ねる形で新しい背景を表示します。CG差分などで使用する場合はfalseが良いでしょう。false
position省略すると、画像がゲーム画面いっぱいに引き伸ばされます(比率は崩れる)。この値を指定すると、背景画像と画面サイズの比率が異なる場合に、比率を崩さずに背景を配置できます。配置位置を次のキーワードから選択してください。left(左寄せ)、center(中央寄せ)、right(右寄せ)、top(上寄せ)、bottom(下寄せ)
method

切り替えのタイプを指定します。デフォルトはfadeInです。指定できる演出は次の通りです。

【V450以降】fadeInfadeInDownfadeInLeftfadeInRightfadeInUplightSpeedInrotateInrotateInDownLeftrotateInDownRightrotateInUpLeftrotateInUpRightzoomInzoomInDownzoomInLeftzoomInRightzoomInUpslideInDownslideInLeftslideInRightslideInUpbounceIn bounceInDownbounceInLeftbounceInRightbounceInUprollInvanishInpuffIn

【V450以前】crossfadeexplodeslideblindbounceclipdropfoldpuffscaleshakesize

crossfade
  • サンプルコード
[bg storage=fg0.png time=1500 wait=true]

[bg2] 背景の切り替え

  • 画像・背景・レイヤ操作

背景の切り替えを簡易的に実行できます。
常にforeのレイヤに対して切り替えが実行されます。

パラメータ必須解説初期値
name[anim]タグなどからこの名前でアニメーションさせられます。カンマで区切ることで複数指定できます。(高度な知識:name属性で指定した値はHTMLのクラス属性になります)
storage画像ファイルの名前を指定します。ファイルはdata/bgimage以下に配置します。
left画像左端の位置をピクセル単位で指定します。0でゲーム画面の上端に表示されます。
top画像上端の位置をピクセル単位で指定します。0でゲーム画面の上端に表示されます。
width画像の横幅をピクセル単位で指定します。省略すると、ゲーム画面いっぱいに引き伸ばされます。
height画像の高さ位置をピクセル単位で指定します。省略すると、ゲーム画面いっぱいに引き伸ばされます。
time背景の切り替えにかける時間をミリ秒で指定します。3000
wait背景の切り替えを待つかどうか。trueまたはfalseで指定します。falseを指定すると、切り替えの完了を待たずに次のタグに進みます。true
crosstrueまたはfalseを指定します。デフォルトはfalsetrueを指定すると、2つの画像が同じタイミングで透明になりながら入れ替わります。falseを指定すると、古い背景を残しながら上に重ねる形で新しい背景を表示します。CG差分などで使用する場合はfalseが良いでしょう。false
method

切り替えのタイプを指定します。デフォルトはfadeInです。指定できる演出は次の通りです。

【V450以降】fadeInfadeInDownfadeInLeftfadeInRightfadeInUplightSpeedInrotateInrotateInDownLeftrotateInDownRightrotateInUpLeftrotateInUpRightzoomInzoomInDownzoomInLeftzoomInRightzoomInUpslideInDownslideInLeftslideInRightslideInUpbounceIn bounceInDownbounceInLeftbounceInRightbounceInUprollInvanishInpuffIn

【V450以前】crossfadeexplodeslideblindbounceclipdropfoldpuffscaleshakesize

crossfade
  • サンプルコード
[bg storage=fg0.png time=1500 wait=true]

[clearfix] fixレイヤーのクリア

  • 画像・背景・レイヤ操作

fixレイヤーの要素を消去します。name属性を指定することで特定の要素のみを消去することもできます。

fixレイヤーはゲームの最前面にある特殊なレイヤーであり、主にセーブやロードなどの固定ボタンを配置する場所です。

パラメータ必須解説初期値
nameこれを指定すると、該当する要素だけを消去することができます。
  • サンプルコード
;fixレイヤーへの追加
[ptext name="sample" layer=fix page=fore text="テキストテキスト" size=30 x=200 y=100 color=red ]

;fixレイヤーのクリア
[clearfix name="sample"]

[quake] 画面を揺らす

  • 演出・効果・動画

指定したミリ秒だけ、画面を揺らします。
vmax属性を0に設定すると横揺れに、hmax属性を0に設定すると縦揺れになります。

解説チュートリアル

パラメータ必須解説初期値
count揺らす回数を指定します。5
wait揺れの終了を待つかどうか。trueまたはfalseで指定します。true
time1回揺れるのにかかる時間をミリ秒で指定します。300
hmax揺れの横方向への最大振幅を指定します。0
vmax揺れの縦方向への最大振幅を指定します。10
  • サンプルコード
[quake count=5 time=300 hmax=20]

[quake2] 画面を揺らす

  • 演出・効果・動画

指定したミリ秒だけ画面を揺らします。

パラメータ必須解説初期値
time揺れ全体の時間をミリ秒で指定します。1000
hmax揺れの横方向への最大振幅を指定します。0
vmax揺れの縦方向への最大振幅を指定します。200
wait揺れの終了を待つかどうか。trueまたはfalseで指定します。true
copybasetrueを指定した場合、画面が揺れている間、ベースレイヤの背景のコピーが最後面に固定されます。これによって、たとえば画面が上に揺れた瞬間に下側にできる隙間から黒色がのぞくことがなくなります。true
  • サンプルコード
画面を揺らすよ。[l][s]

[quake2 time="1000"]

[cm]揺れたね。[p]

[quake2 time="1000" wait="false"]

揺らしたまま次のタグに進むよ。[p]

[quake2 time="3000" wait="false"]

揺らしたまま次のタグに進んで、揺れの完了を待つよ…[wa]終わったよ。[p]

[vibrate] スマホ・パッドの振動

  • 演出・効果・動画

プレイヤーが使用しているモバイル端末やゲームパッドを振動させることができます。

指定した振動時間が長すぎると振動しなくなることがありますので注意してください。環境にもよりますが、目安として振動時間は5000ミリ秒以下に抑えるとよいでしょう。

パラメータ必須解説初期値
time振動させる時間(ミリ秒)。600,200,1000,200,600のようにカンマ区切りで複数の数値を指定すると、600ミリ秒振動→200ミリ秒静止→1000ミリ秒静止→…というパターンを指定することができます。500
power振動させる強さ(0~100)。ゲームパッドを振動させるときのみ有効なパラメータです。100
count振動を繰り返す回数。
  • サンプルコード
[vibrate time=1000 power=100]
1秒振動[p]

[vibrate time="800,200" power="50" count="3"]
パターン振動を3回繰り返し[p]

[vibrate time="5000" power="50" count="3"]
途中で振動停止…
[wait time="1000"]
[vibrate_stop]
停止させました。[p]

[vibrate_stop] スマホ・パッドの振動停止

  • 演出・効果・動画

[vibrate]で開始したモバイル端末やゲームパッドの振動を途中で停止することができます。

パラメータ必須解説初期値
指定できるパラメータはありません。

[layermode] レイヤーモード

  • 演出・効果・動画

ゲーム画面上に画像を合成できます。乗算、スクリーン、オーバーレイなどの合成方法を選べます。

IEなど一部の古いブラウザでは動作しないため、ブラウザゲームとして公開する場合は注意してください。PCアプリとして出力するゲームで使用することを推奨。

解説チュートリアル

パラメータ必須解説初期値
name合成する画像につける名前を指定します。ここで指定した名前は[free_layremovde]で特定の合成のみを消したい際に使用します。
graphic合成する画像ファイルを指定します。ファイルはimageフォルダに配置します。
color画像を使わず単色を合成することもできます。その場合、このパラメータに合成色を0xRRGGBB形式で指定します。
mode合成方法を指定できます。以下のキーワードが指定できます。
multiply(乗算)
screen(スクリーン)
overlay(オーバーレイ)
darken(暗く)
lighten(明るく)
color-dodge(覆い焼きカラー)
color-burn(焼き込みカラー)
hard-light(ハードライト)
soft-light(ソフトライト)
difference(差の絶対値)
exclusion(除外)
hue(色相)
saturation(彩度)
color(カラー)
luminosity(輝度)
multiply
foldergraphicで指定する画像のフォルダを変更できます。たとえばbgimageと指定するとbgimageから画像を取得します。
opacity不透明度を0255の数値で指定します。0で完全に透明になります。
timeフェードイン時間をミリ秒単位で指定します。これを指定すると、画像が透明な状態から徐々に表示されていきます。省略すると、一瞬で表示されます。500
waitフェードインの完了を待つかどうか。trueまたはfalseで指定します。true
  • サンプルコード
[layermode graphic=fg0.png time=1500 mode=overlay]

[layermode_movie] レイヤーモード(動画)

  • 演出・効果・動画

ゲーム画面上に動画レイヤを合成できます。IEなど一部の古いブラウザでは動作しないため、ブラウザゲームとして公開する場合は注意してください。

合成した動画を消去するためには[free_layermode]タグを使用します。

mp4形式推奨ogvwebm形式にも対応します。

ブラウザゲームとして出力する場合、ブラウザによってはサポートしない動画形式があるので注意してください。特に、webm形式はSafariでは動作しません

また、mp4形式はFireFoxやOperaでは動作しません。このとき、もしmp4ファイルと同じ場所に同名のwebmファイルがある場合は自動的にそちらを選択します。

解説チュートリアル

パラメータ必須解説初期値
name合成するレイヤに名前をつけることができます。この名前は[free_layremovde]タグで特定の合成レイヤのみを消したい場合に使用します。
video合成する動画ファイルを指定します。ファイルはdata/videoフォルダに配置します。
volume合成する動画の音量を0100で指定します。
mute動画の音をミュートするかどうか。trueまたはfalseで指定します。ブラウザ上では動画を再生する前にユーザアクション(タップなど)が必要という制限がありますが、trueを指定することでこの制限を無視できます。false
loop動画をループするかどうか。trueまたはfalseで指定します。デフォルトはtrue。ループ指定した場合、[free_layermode]を行うまで演出が残ります。true
speed動画の再生スピードを指定できます。2を指定すると2倍速、0.5を指定すると半分の速度で再生されます。
mode合成方法を指定できます。デフォルトは「multiply」 次の効果が使えます→ multiply(乗算)screen(スクリーン)overlay(オーバーレイ)darken(暗く)lighten(明るく)color-dodge(覆い焼きカラー)color-burn(焼き込みカラー)hard-light(ハードライト)soft-light(ソフトライト)difference(差の絶対値)exclusion(除外)hue(色相)saturation(彩度)color(カラー)luminosity(輝度)multiply
opacity不透明度を0255の数値で指定します。0で完全に透明になります。
timeフェードイン時間をミリ秒単位で指定します。500
left合成レイヤの位置を指定できます。(ピクセル)
top合成レイヤの位置を指定できます。(ピクセル)
width合成レイヤの横幅を指定します。(ピクセル)
height合成レイヤの高さを指定します。(ピクセル)
fit合成レイヤをゲーム画面いっぱいに引き伸ばすかどうか。trueまたはfalseで指定します。true
wait合成した動画の再生完了を待つかどうか。trueまたはfalseで指定します。false
  • サンプルコード
[layermode_movie video=test.webm time=1500 wait=true]

[free_layermode] 合成レイヤの消去

  • 演出・効果・動画

合成レイヤを消去します。

解説チュートリアル

パラメータ必須解説初期値
name消去する合成レイヤのnameを指定します。省略すると、すべての合成レイヤが消去されます。
timeフェードアウト時間をミリ秒で指定します。500
waitフェードアウトの完了を待つかどうか。trueまたはfalseで指定します。true
  • サンプルコード
[free_layermode name="test"]

[movie] 動画の再生

  • 演出・効果・動画

ゲーム画面上で動画を再生します。動画ファイルはdata/videoフォルダに配置します。

mp4形式推奨ogvwebm形式にも対応します。

ブラウザゲームとして出力する場合、ブラウザによってはサポートしない動画形式があるので注意してください。特に、webm形式はSafariでは動作しません

また、mp4形式はFireFoxやOperaでは動作しません。このとき、もしmp4ファイルと同じ場所に同名のwebmファイルがある場合は自動的にそちらを選択します。

パラメータ必須解説初期値
storage再生する動画ファイルを指定します。
skip動画を途中でスキップできるようにするかどうか。trueまたはfalseで指定します。trueを指定すると、プレイヤーが画面クリックで動画を飛ばせるようになります。false
mute動画の音をミュートするかどうか。trueまたはfalseで指定します。ブラウザ上では動画を再生する前にユーザアクション(タップなど)が必要という制限がありますが、trueを指定することでこの制限を無視できます。false
volume動画の音量を0100で指定します。
  • サンプルコード
;動画を再生した回数をゲーム変数f.watch_countで数えてみる
[eval exp="f.watch_count = 0"]

*loop
動画を再生するよ[p]

;動画を再生したことがまだ1回もないなら、スキップできない
;動画を再生したことが1回以上あるなら、スキップできる
;という設定を一時変数tf.skipにをセット
[iscript]
if (f.watch_count === 0) {
  tf.skip = "false";
} else {
  tf.skip = "true";
}
[endscript]

;data/video/cat.mp4を再生するよ
[movie storage="cat.mp4" skip=&tf.skip]

動画を再生しおわったよ[p]

;動画を再生した回数を増やす
[eval exp="f.watch_count += 1"]
[jump target="loop"]

[bgmovie] 背景ムービーの再生

  • 演出・効果・動画

ゲーム画面の背景に動画を使用できます。動画ファイルはdata/videoフォルダに配置します。

[stop_bgmovie]タグを指定すると再生が終わります。
[bgmovie]をループ中に別の[bgmovie]を重ねることで、ループが完了してから次の動画を再生させる事ができます。

mp4形式推奨ogvwebm形式にも対応します。

ブラウザゲームとして出力する場合、ブラウザによってはサポートしない動画形式があるので注意してください。特に、webm形式はSafariでは動作しません

また、mp4形式はFireFoxやOperaでは動作しません。このとき、もしmp4ファイルと同じ場所に同名のwebmファイルがある場合は自動的にそちらを選択します。

★注意
このタグはPC限定です。スマホでは利用できません。

パラメータ必須解説初期値
storage再生する動画ファイルを指定します。
timeフェードイン時間をミリ秒で指定します。300
mute動画の音をミュートするかどうか。trueまたはfalseで指定します。ブラウザ上では動画を再生する前にユーザアクション(タップなど)が必要という制限がありますが、trueを指定することでこの制限を無視できます。false
volume動画の音量を0100で指定します。
loop背景動画をループさせるかどうか。trueまたはfalseで指定します。falseを指定すると動画の最後の状態で停止します。true
  • サンプルコード
[bgmovie storage=cat.mp4]

[wait_bgmovie] 背景ムービーの再生完了を待つ

  • 演出・効果・動画

再生中の背景ムービーの完了を待ちます。

パラメータ必須解説初期値
指定できるパラメータはありません。

[stop_bgmovie] 背景ムービーの停止

  • 演出・効果・動画

bgmovieで再生した背景動画を停止します。

パラメータ必須解説初期値
timeフェードアウト時間をミリ秒で指定します。300
waitフェードアウト完了を待つかどうかをtrueまたはfalseで指定できます。true
  • サンプルコード
[bgmovie storage=cat.mp4]
動画を停止します[p]

[stop_bgmovie]
動画を停止しました[p]

[filter] フィルター効果演出

  • 演出・効果・動画

レイヤやオブジェクトを指定して、様々なフィルター効果を追加できます。

解説チュートリアル

パラメータ必須解説初期値
layerフィルタをかけるレイヤを指定します。省略すると、もしくはallと指定するとゲーム画面全てに効果がかかります。all
name特定の要素にフィルタをかけたい場合に、その要素のnameを指定します。
grayscale0(デフォルト)~100を指定することで、画像の表示をグレースケールに変換できます。
sepia0(デフォルト)~100を指定することで、画像の表示をセピア調に変換できます。
saturate0100(デフォルト)を指定してあげることで、画像の表示の彩度(色の鮮やかさ)を変更できます。
hue0(デフォルト)~360を指定することで、画像の表示の色相を変更できます。
invert0(デフォルト)~100を指定することで、画像の表示の階調を反転させることができます。
opacity0100(デフォルト)を指定することで、画像の表示の透過度を変更できます。
brightness100(デフォルト)を基準とする数値を指定することで、画像の明度を変更できます。0で真っ暗に、100以上の数値でより明るくなります。
contrast0100(デフォルト)を指定することで、画像の表示のコントラストを変更できます。
blur0(デフォルト)~任意の値を指定することで、画像の表示をぼかすことができます。
  • サンプルコード
;特定のオブジェクトを指定して、フィルター効果
[filter layer=0 name=chara_a grayscale=50 ]

;レイヤを指定してフィルター効果
[filter layer=0 brightness=50 ]

[free_filter] フィルター効果消去

  • 演出・効果・動画

レイヤやオブジェクトを指定して、[filter]効果を無効にします。

解説チュートリアル

パラメータ必須解説初期値
layerフィルターを消去するレイヤを指定します。指定がない場合、すべてのフィルターが消去されます。
name特定の要素のフィルターを消去したい場合に、その要素のnameを指定します。
  • サンプルコード
;特定のオブジェクトを指定して、フィルターを打ち消す
[free_filter layer=0 name=chara_a]

;全部のフィルターを打ち消す
[free_filter]

[mask] スクリーンマスク表示

  • 演出・効果・動画

ゲーム画面全体を豊富な効果とともに暗転させることができます。
暗転中にゲーム画面を再構築して[mask_off]タグでゲームを再開する使い方ができます。

解説チュートリアル

パラメータ必須解説初期値
time暗転が完了するまでの時間をミリ秒で指定できます。1000
effect

暗転の効果を指定できます。以下のキーワードが指定できます。

fadeInfadeInDownBigfadeInLeftBigfadeInRightBigfadeInUpBigflipInXflipInYlightSpeedInrotateInrotateInDownLeftrotateInDownRightrotateInUpLeftrotateInUpRightzoomInzoomInDownzoomInLeftzoomInRightzoomInUpslideInDownslideInLeftslideInRightslideInUpbounceIn bounceInDownbounceInLeftbounceInRightbounceInUprollIn

fadeIn
color暗転の色を0xRRGGBB形式で指定します。デフォルトは黒。0x000000
graphic指定すると、暗転部分に画像を使用できます。画像はdata/imageフォルダに配置します。
foldergraphicで指定するフォルダをimage以外に変更したい場合はこちらに記述します。bgimagefgimageなどを指定します。
  • サンプルコード
;暗転開始
[mask effect="fadeInDownBig" time=2000]

;裏で画面操作
[bg storage="umi.jpg" time=500]

;暗転解除
[mask_off]

[mask_off] スクリーンマスク消去

  • 演出・効果・動画

スクリーンマスクを消去してゲームを再開します。

解説チュートリアル

パラメータ必須解説初期値
time暗転が完了するまでの時間をミリ秒で指定できます。1000
effect

暗転の効果を指定できます。以下のキーワードが指定できます。

fadeOutfadeOutDownBigfadeOutLeftBigfadeOutRightBigfadeOutUpBigflipOutXflipOutYlightSpeedOutrotateOutrotateOutDownLeftrotateOutDownRightrotateOutUpLeftrotateOutUpRightzoomOutzoomOutDownzoomOutLeftzoomOutRightzoomOutUpslideOutDownslideOutLeftslideOutRightslideOutUpbounceOut bounceOutDownbounceOutLeftbounceOutRightbounceOutUp

fadeOut
  • サンプルコード
;暗転開始
[mask effect="fadeInDownBig" time=2000]

;裏で画面操作
[bg storage="umi.jpg" time=500]

;暗転解除
[mask_off]

[anim] アニメーション

  • アニメーション

画像やボタン、レイヤなどの中身をアニメーションさせることができます。

アニメーションさせる要素の指定には、[image][ptext][button]タグなどに指定したnameを利用します。あるいはレイヤを指定することで、レイヤの中にあるすべての要素をアニメーション対象にすることもできます。

このタグはアニメーションの終了を待ちません。アニメーションの完了を待つには[wa]タグを使用してください。

アニメーションの座標指定については、+=100-=100のように指定することで相対位置で指定できます。(いま表示されているところから右に100px移動、といった表現が可能)

透明度を指定することでフェードインやフェードアウトも可能です。

解説チュートリアル

パラメータ必須解説初期値
nameここで指定した値が設定されている要素に対してアニメーションを開始します。name属性で指定した値です。
layername属性が指定されている場合は無視されます。前景レイヤを指定します。必ずforeページに対して実施されます。
left指定した横位置にアニメーションで移動します。
top指定した縦位置にアニメーションで移動します。
width幅を指定します
height高さを指定します
opacity0~255の値を指定します。指定した透明度へアニメーションします
color色指定
timeアニメーションにかける時間をミリ秒で指定してください。デフォルトは2000ミリ秒です2000
effect変化のエフェクトを指定します。以下のキーワードが指定できます。jswingdefeaseInQuadeaseOutQuadeaseInOutQuadeaseInCubiceaseOutCubiceaseInOutCubiceaseInQuarteaseOutQuarteaseInOutQuarteaseInQuinteaseOutQuinteaseInOutQuinteaseInSineeaseOutSineeaseInOutSineeaseInExpoeaseOutExpoeaseInOutExpoeaseInCirceaseOutCirceaseInOutCirceaseInElasticeaseOutElasticeaseInOutElasticeaseInBackeaseOutBackeaseInOutBackeaseInBounceeaseOutBounceeaseInOutBounce
  • サンプルコード
[ptext layer=1 page=fore text="文字列" size=30 x=0 y=0 color=red vertical=true]

[image layer=0 left=100 top=100  storage = yuko1.png page=fore visible=true name=yuko,chara ]
[image layer=1 left=300 top=100 storage = haruko1.png page=fore visible=true name=haruko ]

;name属性を指定してアニメーション
[anim name=haruko left="+=100" time=10000 effect=easeInCirc opacity=0  ]

;レイヤを指定してアニメーション
[anim layer=1 left="+=100" effect=easeInCirc opacity=0  ]

;すべてのアニメーション完了を待ちます
[wa]

アニメーション終了

[wa] アニメーション終了待ち

  • アニメーション

実行中のアニメーションすべて終了するまで処理を待ちます。

パラメータ必須解説初期値
指定できるパラメータはありません。

[stopanim] アニメーション強制停止

  • アニメーション

実行中のアニメーションを強制的に停止します。

パラメータ必須解説初期値
nameアニメーションを強制停止する要素のnameを指定します。

[keyframe] キーフレームアニメーション定義の開始

  • アニメーション

キーフレームアニメーションの定義を開始します。

定義したキーフレームアニメーションは[kanim]タグで使用できます。

解説チュートリアル

パラメータ必須解説初期値
nameキーブレームアニメーションの名前を指定します。[kanim]タグで使用します。
  • サンプルコード
;----keyframeの定義
[keyframe name="fuwafuwa"]

[frame p=40%  x="100" ]
[frame p=100% y="-200" opacity=0 ]

[endkeyframe]

;-----定義したアニメーションを実行

[endkeyframe] キーフレームアニメーション定義の終了

  • アニメーション

キーフレームアニメーション定義を終了します。

パラメータ必須解説初期値
指定できるパラメータはありません。

[frame] キーフレームアニメーション定義

  • アニメーション

キーフレームをひとつ定義します。[keyframe][endkeyframe]の間に記述します。

解説チュートリアル

パラメータ必須解説初期値
pキーフレームの位置をパーセンテージ(0%100%)で指定します。たとえば50%と指定すれば、全体の長さが4秒のアニメーションのなかの2秒目、となります。0%のキーフレームを省略することで前回のアニメーション状態を継承できます。
xX軸方向へのアニメーション量をピクセル単位で指定してください。*(アスタリスク)で始めることで、絶対位置として指定できます。
例) x="100"(前へ100px移動する)、x="*100"(画面左端から100pxの位置へ移動する)
yY軸方向へのアニメーション量をピクセル単位で指定してください。*(アスタリスク)で始めることで、絶対位置として指定できます。
zZ軸方向へのアニメーション量をピクセル単位で指定してください。*(アスタリスク)で始めることで、絶対位置として指定できます。

このパラメータを使用することで三次元的な表現が可能ですが、対応しているのは一部のブラウザのみとなります。
rotate対象を回転させることができます。たとえば180度回転させたい場合、180degのように指定します。
rotateX対象をX軸を軸として回転させることができます。
rotateY対象をY軸を軸として回転させることができます。
rotateZ対象をZ軸を軸として回転させることができます。
scale対象を拡大または縮小できます。2倍に拡大するには2を、半分に縮小するには0.5を指定します。
scaleXX方向に拡大または縮小できます。
scaleYY方向に拡大または縮小できます。
scaleZZ方向に拡大または縮小できます。
skew傾斜を指定できます。
skewXX傾斜を指定できます。
skewYY傾斜を指定できます。
perspective遠近効果を付与できます。一部ブラウザのみ対応。
opacity不透明度を0255の数値で指定します。0で完全に透明になります。
その他CSSのスタイルを各種指定できます。

[kanim] キーフレームアニメーションの実行

  • アニメーション

キーフレームアニメーションを実行します。事前に[keyframe]タグでキーフレームアニメーションを定義しておく必要があります。

解説チュートリアル

パラメータ必須解説初期値
nameアニメーションさせる画像やテキストのnameを指定します。
layernameを指定せずにlayerを指定することで、そのレイヤに存在するすべての要素をアニメーションさせることができます。
keyframe適用するキーフレームアニメーションのnameを指定します。
timeアニメーション時間をミリ秒で指定します。
easingアニメーションの変化パターンを指定できます。以下のキーワードが指定できます。
ease(開始時点と終了時点を滑らかに再生する)
linear(一定の間隔で再生する)
ease-in(開始時点をゆっくり再生する)
ease-out(終了時点をゆっくり再生する)
ease-in-out(開始時点と終了時点をゆっくり再生する)
この他にcubic-bezier関数を使って独自のイージングを指定することも可能です。
count再生回数を指定できます。infiniteを指定することで無限ループさせることもできます。
delay開始までの時間を指定できます。初期値は0、つまり遅延なしです。
directionアニメーションを複数回ループさせる場合に、偶数回目のアニメーションを逆再生にするかを設定できます。偶数回目を逆再生にする場合はalternateを指定します。
modeアニメーションの最後のフレームの状態(位置、回転など)をアニメーション終了後も維持するかを設定できます。forwards(デフォルト)で維持。noneを指定すると、アニメーション再生前の状態に戻ります。

[stop_kanim] キーフレームアニメーションの停止

  • アニメーション

キーフレームアニメーションを停止します。

パラメータ必須解説初期値
nameアニメーションを停止する画像やテキストのnameを指定します。
layernameを指定せずにlayerを指定することで、そのレイヤに存在するすべての要素のアニメーションを停止できます。

[xanim] 汎用アニメーションの実行

  • アニメーション

V515以降で使用可能。

[anim][kanim]の機能を併せ持つ、汎用的なアニメーション実行タグです。

事前に[keyframe]タグで定義したキーフレームアニメーションをkeyframeパラメータに指定して実行することもできますし、[anim]タグのように変化対象のパラメータを直接指定することもできます。

パラメータ必須解説初期値
nameアニメーションさせる画像やテキストのnameを指定します。
layernameを指定せずにlayerを指定することで、そのレイヤに存在するすべての要素をアニメーションさせることができます。
keyframe適用するキーフレームアニメーションのnameを指定します。
timeアニメーション時間をミリ秒で指定します。
easing[anim]タグに指定できるキーワードと[kanim]に指定できるキーワードがすべて使用可能です。ease
count再生回数を指定できます。infiniteを指定することで無限ループさせることもできます。1
delay開始までの時間を指定できます。初期値は0、つまり遅延なしです。0
directionアニメーションを複数回ループさせる場合に、偶数回目のアニメーションを逆再生にするかを設定できます。偶数回目を逆再生にする場合はalternateを指定します。normal
modeアニメーションの最後のフレームの状態(位置、回転など)をアニメーション終了後も維持するかを設定できます。forwards(デフォルト)で維持。noneを指定すると、アニメーション再生前の状態に戻ります。forwards
svgsvgファイルを指定できます。svgファイルはimageフォルダに配置します。これを指定すると、svgファイル内で定義されたに沿ってアニメーションさせることができます。
svg_xsvgファイルを指定したとき、X座標をに沿わせるかどうか。trueまたはfalseで指定します。true
svg_ysvgファイルを指定したとき、Y座標をに沿わせるかどうか。trueまたはfalseで指定します。true
svg_rotatesvgファイルを指定したとき、角度をに沿わせるかどうか。trueまたはfalseで指定します。false
waitアニメーションの完了を待つかどうか。trueまたはfalseで指定します。false
この他、[anim]タグに指定できるパラメータや、各種CSSプロパティをアニメーション対象にすることができます。
  • サンプルコード
;キーフレームアニメーションを無限ループで適用
[keyframe name="yoko"]
[frame p="0%" x="0"]
[frame p="100%" x="100"]
[endkeyframe]
[xanim name="akane" keyframe="yoko" count="infinite" time="1000" direction="alternate" easing="linear"]

;2秒かけて500px右に移動 デフォルトではアニメーションの完了は待たずに次に進むよ
[xanim name="akane" x="500" time="2000"]

[stop_xanim] [xanim]の停止

  • アニメーション

V515以降で使用可能。
[xanim]で開始したアニメーションを停止します。

パラメータ必須解説初期値
nameアニメーションを停止する画像やテキストのnameを指定します。
layernameを指定せずにlayerを指定することで、そのレイヤに存在するすべての要素のアニメーションを停止できます。
completetrueを指定すると、当初アニメーションするはずだった地点まで一瞬で移動させます。falseの場合はその場で止まります。false

[camera] カメラを移動する

  • カメラ操作

カメラのズームやパンのような演出ができます。
カメラ機能を使うことで、キャラクターの立ち絵の表情にフォーカスをあてたり、一枚絵のいろんな個所をズームしてみたりと多彩な演出ができます。

カメラ機能を使用するにはConfig.tjsuseCameratrueにする必要があります。
また、カメラ機能を有効にした場合、画面の中央寄せ(ScreenCentering)が無効になります。

カメラの座標は画面中央が(x=0 y=0)です。たとえば画面右上はx=200 y=200、画面左下はx=-200 y=-200という座標指定になります。

カメラを元の位置に戻すためには[reset_camera]タグを使用します。
カメラの演出完了を待つためには[wait_camera]タグを使用します。

★重要
カメラ演出が終わったら、必ず[reset_camera]でカメラの位置を初期値に戻してください。カメラを戻さないと、背景の変更 [bg]タグ等は使用できません。

解説チュートリアル

パラメータ必須解説初期値
timeカメラが座標へ移動する時間をミリ秒で指定します。1000
xカメラの移動するX座標を指定します。
yカメラの移動するY座標を指定します
zoomカメラの拡大率を指定します。と指定すると2倍ズームとなります。
rotateカメラの傾きを指定します。20と指定するとカメラが20度傾きます。
from_xカメラの移動開始時のX座標を指定できます。
from_yカメラの移動開始時のY座標を指定できます。
from_zoomカメラの移動開始時の倍率を指定できます。
from_rotateカメラの移動開始時の傾きを指定できます。
waitカメラ移動の完了を待つかどうかをtrueまたはfalseで指定します。falseを指定するとカメラ移動中もゲームを進行できます。true
layerカメラの効果を与えるレイヤを指定します。背景ならbase、前景レイヤなら0以上の数字。これを指定すると、カメラの影響を特定レイヤに限定できます。通常はすべてのレイヤに対して影響を及ぼします。layer_camera
ease_typeカメラの移動演出を指定できます。
ease(開始時点と終了時点を滑らかに再生する)
linear(一定の速度で再生する)
ease-in(開始時点をゆっくり再生する)
ease-out(終了時点をゆっくり再生する)
ease-in-out(開始時点と終了時点をゆっくり再生する)
ease
  • サンプルコード
[camera zoom=2 x=180 y=100 time=1000]
[camera x=-180 y=100 time=2000]
[camera zoom=2 from_zoom=3 x=180 y=100 time=1000]

;カメラの位置を元に戻す
[reset_camera]

[reset_camera] カメラをリセットする

  • カメラ操作

カメラの位置を初期値に戻します。

★重要
[camera]タグによるカメラ演出が終わったあとは、必ずこのタグでカメラの位置をもとに戻してください。
そうしない場合、背景の変更などで不具合が生じる場合があります。

解説チュートリアル

パラメータ必須解説初期値
timeカメラの移動時間をミリ秒で指定します。1000
waitカメラ移動の完了を待つかどうかをtrueまたはfalseで指定します。falseを指定するとカメラ移動中もゲームを進行できます。true
layerカメラの効果を与えるレイヤを指定します。背景ならbase、前景レイヤなら0以上の数字。これを指定すると、カメラの影響を特定レイヤに限定できます。通常はすべてのレイヤに対して影響を及ぼします。layer_camera
ease_typeカメラの移動演出を指定できます。
ease(開始時点と終了時点を滑らかに再生する)
linear(一定の速度で再生する)
ease-in(開始時点をゆっくり再生する)
ease-out(終了時点をゆっくり再生する)
ease-in-out(開始時点と終了時点をゆっくり再生する)
ease

[wait_camera] カメラの演出を待つ

  • カメラ操作

カメラが演出中である場合、その完了を待つことができます。wait=falseを指定した[camera]タグと組み合わせて使います。

たとえば「背景でカメラを動かしつつ、テキストを読ませる。ただし、メッセージ送りのタイミングでカメラが動き終わるのを待つ」という演出に活用できます。

解説チュートリアル

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
[camera zoom=2 x=180 y=100 time=10000 wait=false]
カメラ演出中[p]
ここでもカメラ演出中[p]
カメラの演出を待ちます[wait_camera]
カメラの演出が終わったので進行[p]

[s] ゲームを停止する

  • システム操作

シナリオファイルの実行を停止します。

プレイヤーの選択を待つ場面、たとえば[link][glink][button]タグなどで選択肢表示したあとに[s]を記述します。

逆に言うと、[s]に到達するとプレイヤーがクリックやタップでシナリオを進めることが不可能になるため、必ずプレイヤーにシナリオをジャンプさせるための手段を提供する必要があります。

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
[link target=*select1]【1】選択肢 その1[endlink][r]
[link target=*select2]【2】選択肢 その2[endlink][r]
[s]

[wait] ウェイト

  • システム操作

ウェイトを入れます。time属性で指定した時間、操作できなくなります。

パラメータ必須解説初期値
timeウェイトをミリ秒で指定します。
  • サンプルコード
2秒待つよ……

;2000ミリ秒(2秒)処理を停止します
[wait time=2000]

2秒待ったよ[p]

[wait_cancel] ウェイトのキャンセル

  • システム操作

[wait]タグによるウェイト状態をキャンセルできます。

これは[wait]中にボタンクリックなどで無理やりシナリオジャンプしたときにジャンプ先でウェイトをキャンセルする、といった使い方をします。

解説チュートリアル

パラメータ必須解説初期値
指定できるパラメータはありません。

[close] ウィンドウを閉じる

  • システム操作

PCアプリの場合、ウィンドウを閉じます。
ブラウザゲームの場合、タブを閉じます。

パラメータ必須解説初期値
ask終了の確認をするかどうか。trueまたはfalseで指定します。デフォルトはtruetrue

[savesnap] セーブスナップの作成

  • システム操作

現在のプレイ状況を一時保存します。その後、tyrano.ks拡張の[setsave]を行うことで、ここで記録したセーブデータが保存されます。

パラメータ必須解説初期値
titleセーブデータのタイトルを指定します。

[autosave] オートセーブを実行

  • システム操作

このタグに到達した際、自動的にプレイ状況を保存します。

[autosave]されたデータが存在する場合、sf.system.autosavetrueが格納されます。

サンプルコードのような判定ロジックをタイトル画面より前に用意しておくことで、前回のプレイ状況からゲームを再開するような仕組みが作れます。

パラメータ必須解説初期値
titleセーブデータのタイトルを指定します。
  • サンプルコード
オートセーブデータの判定を行います[l][r]

[if exp="sf.system.autosave === true"]

  自動的に保存されたデータが存在します。ロードしますか?[r]
  [link target=select1]【1】はい[endlink][r]
  [link target=select2]【2】いいえ[endlink][r]
  [s]

  *select1
  ロードを実行します[l]
  [autoload]

  *select2
  [cm]
  ロードを実行しません[l][r]

[else]

  自動的に保存されたデータはありません[l][r]

[endif]

オートセーブを実行しました[autosave][l][r]
ゲームを再起動してみてください[s]

[autoload] オートロードを実行

  • システム操作

[autosave]タグで保存されたデータを読み込みます。

パラメータ必須解説初期値
指定できるパラメータはありません。

[screen_full] フルスクリーン

  • システム操作

ゲーム画面をフルスクリーンにします。再度呼び出すことでフルスクリーンからウィンドウに戻ります。

PCゲームでのみ動作します。

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
[screen_full]

[dialog] ダイアログ表示

  • システム操作

確認用のダイアログを表示します。

ダイアログは以下のタイプがあります。
alertconfirminput

inputは廃止予定です。使用は推奨されません。

パラメータ必須解説初期値
typeダイアログの種類を以下のキーワードのいずれかで指定します。
alert(警告)
confirm(確認)
input(入力)
alert
name入力ダイアログの場合に、入力内容を保存する変数名を指定します。f.nameなど。tf.dialog_value
textダイアログに表示するメッセージを記述します。
storageOKボタンが押されたときのジャンプ先のシナリオファイルを指定します。省略すると、現在のシナリオファイルとみなされます。
targetOKボタンが押されたときのジャンプ先のラベルを指定します。省略すると、シナリオファイルの先頭とみなされます。

なお、storagetargetが両方省略されている場合、単に次のタグに進みます。
storage_cancelキャンセルボタンが押されたときのジャンプ先のシナリオファイルを指定します。省略すると、現在のシナリオファイルとみなされます。
target_cancelキャンセルボタンが押されたときのジャンプ先のラベルを指定します。省略すると、シナリオファイルの先頭とみなされます。
label_okOKボタンのテキストを変更できます。OK
label_cancelキャンセルボタンのテキストを変更できます。Cancel
  • サンプルコード
;警告
[dialog type="alert" text="ここから先は危険地帯です"]

;確認してOKならシナリオジャンプ
[dialog type="confirm" text="本当に進みますか?" target="ok" target_cancel="cancel"]

*ok
進みます[p]
[jump target=input]

*cancel
進みませんでした[p]
[jump target=input]

*input
;inputは廃止予定!!
;入力
[dialog type="input" name="f.name" text="名前を教えてください" target="next"]

*next
あなたの名前は[emb exp="f.name"]ですね[s]

[start_keyconfig] キーコンフィグ操作の有効化

  • システム操作

[stop_keyconfig]で無効化したキーコンフィグを有効化できます。

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
[start_keyconfig]

[stop_keyconfig] キーコンフィグ操作の無効化

  • システム操作

キーコンフィグを一時的に無効化します。[start_keyconfig]で再び有効化できます。

無効になるのは次の操作です。
・マウス操作
・キーボード操作
・マウスのスワイプ操作

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
キーコンフィグが有効[p]
[stop_keyconfig]
ここは無効[p]
ここも無効[p]
[start_keyconfig]
ここからまた有効[p]

[apply_local_patch] パッチファイルの適用

  • システム操作

V470以降で使用可。PCアプリとして配布している場合のみ有効です

このタグに到達した時点で、パッチファイルをゲームに反映します。

dataフォルダ以外(tyrano本体)をアップデートするときは、このタグではなく、起動時のアップデートで対応してください。

パッチファイルの容量が大きい場合は一時的にゲームが停止します。ロード中などのテキストを表示するとプレイヤーに親切でしょう。

パラメータ必須解説初期値
fileパッチファイルのパスを指定します。exeファイルの階層を起点として指定します
reloadtrueまたはfalseを指定します。trueを指定すると、パッチ反映後にゲームが自動的に再起動されます。false
  • サンプルコード
[apply_local_patch file="test.tpatch" ]

[check_web_patch] アップデートのチェック

  • システム操作

V470以降で使用可。PCアプリとして配布している場合のみ有効です

サーバーに配置してあるアップデートパッチに更新がある場合、自動的にメッセージを表示して、パッチの適応を促すことができます。(パッチの反映にはゲームの再起動が必要です)

サーバーをレンタルしてjsonファイルとtpatchファイルを配置する必要があります。

パラメータ必須解説初期値
urlパッチのjsonファイルのURLを指定します。
  • サンプルコード
[check_web_patch url="http://tyrano.jp/patch/mygame.json" ]

[closeconfirm_on] 終了時の確認の有効化

  • システム操作

このタグを通過してからは、タグが進行する度にゲームが「未保存状態」になります。ゲームが「未保存状態」のときにプレイヤーがゲームを閉じようとすると、確認ダイアログが出ます。

ゲームが「保存状態」になるのはプレイヤーがセーブまたはロードしたときです。

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
ここで閉じようとしても終了時の確認はない[p]
ここで閉じようとしても終了時の確認はない[p]
[closeconfirm_on]
ここから未保存状態で閉じようとすると終了時の確認が出る[p]
ここから未保存状態で閉じようとすると終了時の確認が出る[p]
[closeconfirm_off]
ここで閉じようとしても終了時の確認はない[p]
ここで閉じようとしても終了時の確認はない[p]

[closeconfirm_off] 終了時の確認の無効化

  • システム操作

このタグを通過すると、ゲームが「未保存状態」のときにプレイヤーがゲームを閉じようとしても確認ダイアログが出なくなります。

パラメータ必須解説初期値
指定できるパラメータはありません。

[glyph] クリック待ちグリフの設定

  • システムデザイン変更

クリック待ちグリフ([l][p]でクリックを待つ状態のときにメッセージの末尾に表示される画像)の設定が変更できます。使用する画像を変更したり、位置をメッセージの最後ではなく画面上の固定位置に出すようにしたりできます。

クリック待ちグリフのコンテンツには以下のパターンがあります。

①画像ファイル(lineパラメータを指定する)※GIFやWebPもOK
②図形(figureパラメータを指定する)
③コマアニメ(koma_animパラメータを指定する)
④HTMLを直接指定(htmlパラメータを指定する)※上級者向け

画像ではなく図形をプリセットから選んでクリック待ちグリフを作ることができます。図形には色を自由に指定できます。

アニメーションをプリセットから選んで適用したり、自分で[keyframe]タグで定義したキーフレームアニメーションを適用したりできます。

※クリック待ちグリフの設定は[glyph]タグを通過するたびに(指定しなかったパラメータも含めて)初期化されます。[position][font]のように複数タグに分割して定義することはできませんのでご注意ください。

解説チュートリアル

パラメータ必須解説初期値
lineグリフに使用する画像を指定できます。画像ファイルは、デフォルトではtyrano/images/systemフォルダ(nextpage.gifがあるフォルダ)から探されます。folderパラメータで変更可。nextpage.gif
fixtrueを指定すると、グリフがメッセージの末尾ではなくゲーム画面上の固定位置に表示されます。false
leftグリフを表示する横の位置を指定します。(fix属性をtrueにした場合に有効)0
topグリフを表示する縦の位置を指定します。(fix属性をtrueにした場合に有効)0
folderグリフの画像を探すフォルダを指定できます。tyrano/images/system
widthグリフの横幅をpx単位で指定できます。
heightグリフの高さをpx単位で指定できます。
marginlグリフの左側の余白をpx単位で指定できます。3
marginbグリフの下側の余白をpx単位で指定できます。0
animグリフに適用するアニメーションを以下のキーワードから指定できます。
flash_momentary(瞬間的な点滅)
flash(滑らかな点滅)
spin_x(X軸を中心に回転)
spin_y(Y軸を中心に回転)
spin_z(Z軸を中心に回転)
bounce(バウンド)
rotate_bounce(回転しながらバウンド)
soft_bounce(ぽよんと弾むバウンド)
zoom(拡縮)
timeグリフに適用するアニメーションの時間をミリ秒単位で指定します。
figureグリフに使用する図形を以下のキーワードから指定できます。
circle(円)
triangle(三角形)
v_triangle(下向き三角形)
rectangle(四角形)
diamond(ひし形)
start(星)
colorグリフに図形を使用する場合に、図形の色を指定できます。0xFFFFFF
nameグリフに付けるクラス名を指定できます。(上級者向け)
htmlグリフのコンテンツとしてHTMLを直接指定できます。(上級者向け)
keyframe適用するキーフレームアニメーションのnameを指定します。animと併用することはできません。
easingアニメーションの変化パターンを指定できます。以下のキーワードが指定できます。
ease(開始時点と終了時点を滑らかに再生する)
linear(一定の間隔で再生する)
ease-in(開始時点をゆっくり再生する)
ease-out(終了時点をゆっくり再生する)
ease-in-out(開始時点と終了時点をゆっくり再生する)
この他にcubic-bezier関数を使って独自のイージングを指定することも可能です。
count再生回数を指定できます。infiniteを指定することで無限ループさせることもできます。
delay開始までの時間を指定できます。初期値は0、つまり遅延なしです。
directionアニメーションを複数回ループさせる場合に、偶数回目のアニメーションを逆再生にするかを設定できます。偶数回目を逆再生にする場合はalternateを指定します。
modeアニメーションの最後のフレームの状態(位置、回転など)をアニメーション終了後も維持するかを設定できます。forwards(デフォルト)で維持。noneを指定すると、アニメーション再生前の状態に戻ります。
koma_animグリフに使用するコマアニメの画像を指定できます。コマアニメに使用する画像は「すべてのコマが横並びで連結されたひとつの画像ファイル」である必要があります。
koma_countコマアニメを使用する場合、画像に含まれるコマ数を指定します。これを指定した場合、koma_widthを省略できます。
koma_widthコマアニメを使用する場合、1コマあたりの横幅をpx単位で指定します。これを指定した場合、koma_countを省略できます。
koma_anim_timeコマアニメが1周するまでの時間をミリ秒単位で指定します。1000
  • サンプルコード
[glyph]
デフォルトのクリック待ちグリフ(gif動画)[p]

[glyph fix="true" left="640" top="600"]
画面下中央に固定表示[p]

[glyph figure="rectangle" anim="bounce" width="5" color="0xCEE7F5" marginl="15"]
デフォルトのクリック待ちグリフを図形+アニメーションで再現[p]

[glyph figure="v_triangle" anim="flash_momentary" delay="200"]
瞬間的に点滅する下向き三角[p]

[glyph figure="diamond" anim="flash"]
滑らかに点滅するひし形[p]

[glyph figure="circle" anim="soft_bounce" marginl="10"]
やわらかく弾む円[p]

[glyph figure="rectangle" anim="rotate_bounce"]
ぐるぐるしながらバウンドする四角[p]

[glyph figure="star" anim="spin_y" color="yellow"]
Y軸スピンする星[p]

[glyph figure="star" anim="spin_x" color="yellow"]
X軸スピンする星[p]

[glyph figure="star" anim="spin_z" color="yellow"]
Z軸スピンする星[p]

[glyph figure="star" anim="zoom" color="yellow"]
拡縮する星[p]

[glyph koma_anim="stepanim.jpg" koma_count="4" width="28"]
コマアニメ[p]

[glyph html='<span style="color: white; font-size: 20px;">🥺</span>']
HTMLを直接指定[p]

[keyframe name="yoko"]
[frame p="0%" x="0"]
[frame p="50%" x="10"]
[frame p="100%" x="0"]
[endkeyframe]
[glyph line="nextpage.gif" easing="linear" keyframe="yoko"]
自分で定義したキーフレームアニメーションを適用[p]

[glyph_skip] スキップモードグリフの設定

  • システムデザイン変更

スキップモード中に表示されるグリフを設定できます。

useパラメータを指定したとき
deleteパラメータを指定したとき
・どちらも指定しなかったとき

の3パターンで動作が異なります。

useパラメータを指定した場合、[ptext]などですでに画面上に出している要素をスキップモードグリフにすることができます。

deleteパラメータを指定した場合、以前の[glyph_skip]で設定した定義を削除することができます。

どちらも指定しなかった場合は[glyph]と同等の処理を行います。

パラメータ必須解説初期値
useすでに画面上に出ている要素をスキップモード中のグリフとして扱うようにできます。[ptext][image]に設定したnameをここに指定します。
deletetrueを指定した場合、グリフの定義を削除する処理を実行します。
その他[glyph]と同じパラメータが指定できます。ただしfixパラメータはtrueで固定されます。
  • サンプルコード
;固定スキップモードグリフ、固定オートモードグリフを設定
[glyph_skip fix="true" left="10" top="10" figure="diamond" anim="flash"  color="orange" time="400" width="80"]
[glyph_auto fix="true" left="10" top="10" figure="star"    anim="spin_y" color="green" time="5000" width="80"]

;オートモードグリフについては、
;固定グリフと同時にメッセージ末尾型のオートモードグリフも設定できる
[glyph_auto html="⌛" anim="flash"]

;[ptext]で出した文字をスキップグリフ、オートグリフとして扱うパターン
[ptext     name="glyph_skip" layer="message0" x="20" y="10" text="SKIP!" edge="4px orange" size="30"]
[ptext     name="glyph_auto" layer="message0" x="20" y="10" text="AUTO" edge="4px green" size="30"]
[glyph_skip use="glyph_skip"]
[glyph_auto use="glyph_auto"]

;上記のすべての設定を抹消する
[glyph_auto delete="true" fix="true"]
[glyph_auto delete="true" fix="false"]
[glyph_skip delete="true"]

[glyph_auto] オートモードグリフの設定

  • システムデザイン変更

オートモード中に表示されるグリフを設定できます。

useuseuseパラメータを指定したとき
deleteパラメータを指定したとき
・どちらも指定しなかったとき

の3パターンで動作が異なります。

useパラメータを指定した場合、[ptext]などですでに画面上に出している要素を画面固定のオートモードグリフにすることができます。

deleteパラメータを指定した場合、以前の[glyph_auto]で設定した定義を削除することができます。

どちらも指定しなかった場合は[glyph]と同等の処理を行います。

パラメータ必須解説初期値
fix画面固定グリフの設定をするならtrue、メッセージ末尾のグリフの設定をするならfalseを指定します。オートモードグリフに限り、固定グリフと非固定グリフを両方設定できます。
useすでに画面上に出ている要素を画面固定グリフとして扱うようにできます。[ptext][image]に設定したnameをここに指定します。
deletetrueを指定した場合、グリフの定義を削除する処理を実行します。
その他[glyph]と同じパラメータが指定できます。

[showmenubutton] メニューボタンの表示

  • システムデザイン変更

メニューボタンを表示します。

パラメータ必須解説初期値
keyfocustrueを指定すると、キーボードやゲームパッドで選択できるようになります。また12などの数値を指定すると、キーコンフィグのfocus_nextアクションでボタンを選択していくときの順序を指定できます。false
  • サンプルコード
[showmenubutton]

[hidemenubutton] メニューボタンの非表示

  • システムデザイン変更

メニューボタンを非表示にします。

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
[hidemenubutton]

[body] ゲーム画面外の設定

  • システムデザイン変更

ゲーム画面サイズやゲーム画面外側の黒帯部分をカスタマイズできます。黒帯部分の色を変更したり、黒帯部分に画像を設定したり、ゲーム画面サイズをゲーム中に変更したりできます。

★注意
このタグで変更した内容はセーブデータのロード時に復元されません。

パラメータ必須解説初期値
bgimageゲーム画面外の背景に設定する画像を指定します。bgimageフォルダに配置してください。
bgrepeat背景に画像を指定した際の表示パターンを指定します。デフォルトは縦横に繰り返し表示されます。
repeat-x(水平方向のみ繰り返し)
repeat-y(垂直方向のみ繰り返し)
round(比率を崩して覆うように全画面繰り返し)
no-repeat(繰り返しなし)
bgcolor背景色を0xRRGGBB形式で指定します。bgimageが設定されている場合は無視されます。
bgcover背景画像を画面全体に引き伸ばすかどうか。trueまたはfalseで指定します。false
scWidthゲーム画面のオリジナルの横幅をゲーム中に変更できます。レスポンシブ対応を想定したタグです。Config.tjsscWidthに相当します。
※「オリジナルの」は「ウィンドウサイズにフィットさせるためにゲーム画面の拡縮を行う前の」という意味で用いられています。
scHeightゲーム画面のオリジナルの高さをゲーム中に変更できます。レスポンシブ対応を想定したタグです。Config.tjsscHeightに相当します。
  • サンプルコード
[body bgimage="back.png" bgcolor="black" ]

[title] タイトル指定

  • システムデザイン変更

ゲームタイトルを指定します。たとえば、章ごとにタイトルを変えるとプレイヤーがわかりやすくなります。

PCアプリではウィンドウタイトル、ブラウザゲームではタブタイトルが変わります。

このタグを通過するまでのタイトルは次のようになっています。
ゲーム起動直後 … Loading TyranoScript
読み込み後 … Config.tjsSystem.titleで設定されたテキスト

パラメータ必須解説初期値
name表示したいタイトルを指定します
  • サンプルコード
[title name="変更後のタイトル"]

[cursor] マウスカーソルに画像を設定

  • システムデザイン変更

マウスカーソルに画像を設定することができます。画像はdata/imageフォルダに配置してください。使用可能な画像形式はgifpngjpgです。

ゲーム中に何度でも変更することが可能です。[cursor]タグを通過する前の標準カーソルを指定したい場合はdata/system/Config.tjscursorDefaultを変更します。

システムの標準カーソルに戻す場合はdefaultを指定します。

★ヒント
マウスカーソル画像の推奨サイズは32x32ピクセル以下です。

ブラウザによって異なるケースがありますが、概ね、マウスカーソルに設定可能な最大の画像サイズは128x128ピクセルです。それより大きい画像をマウスカーソルに設定することはできません。

また、32x32ピクセルよりも大きな画像をマウスカーソルに設定した場合、画面端にマウスカーソルを移動させたときにカーソル画像がデフォルトに戻ってしまうことがあります。

★注意
開発者ツール(デベロッパーツール)を開いている場合などには、マウスカーソルの自動非表示が利かないことがあります。

パラメータ必須解説初期値
storageマウスカーソルに設定する画像ファイルを指定します。画像はdata/imageフォルダに配置します。defaultと指定するとデフォルトのカーソルに戻せます。
x指定した数値の分だけ、マウスカーソルに設定する画像を左側にずらすことができます。0
y指定した数値の分だけ、マウスカーソルに設定する画像を上側にずらすことができます。0
typeボタン類にマウスを載せたときのカーソルを変更したい場合、このパラメータにpointerを指定します。default
auto_hideプレイヤーが一定時間マウス操作をしなかった場合にマウスカーソルを自動で非表示にするための設定です。trueで自動非表示が有効、falseで自動非表示が無効(常にマウスカーソル表示)になります。また、2000のように数値を指定することで、マウスカーソルの自動非表示を有効にした上でマウスカーソルを非表示にするまでの時間をミリ秒単位で設定できます。
click_effectクリックエフェクトを有効にするかどうか。trueまたはfalseで指定します。
e_widthクリックエフェクトの横幅をpx単位で指定します。
e_opacityクリックエフェクトの最初の不透明度を0~255で指定します。
e_timeクリックエフェクトの表示時間をミリ秒単位で指定します。
e_colorクリックエフェクトの色を指定します。
e_blendクリックエフェクトの合成モードを指定します。[layermode]タグのmodeパラメータと同じキーワードが指定可能です。normaloverlayなど。
e_scaleクリックエフェクトの拡大率をパーセント単位で指定します。たとえば200と指定すると、エフェクトサイズが最終的に200%になるように拡大されていきます。
  • サンプルコード
;デフォルトのマウスカーソル画像を変更
[cursor storage="my_cursor_32x32.png"]

;ボタンの上にマウスカーソルを乗せたときの画像を変更
[cursor storage="my_cursor_pointer_32x32.png" type="pointer"]

;一定時間マウスの操作がなかった場合にマウスカーソルを非表示にする
[cursor auto_hide="true"]

;クリックエフェクトを有効にする
[cursor click_effect="true"]

;クリックエフェクトの設定変更
[cursor e_width="200" e_color="0xff0000" e_time="600" e_scale="200" e_blend="normal" e_opacity="100"]

;クリックエフェクトの設定変更(デフォルト設定)
[cursor e_width="100" e_color="0xffffff" e_time="300" e_scale="120" e_blend="overlay" e_opacity="204"]

[sysview] システム画面変更

  • システムデザイン変更

システム系機能で使用するHTMLファイルを変更できます。

パラメータ必須解説初期値
typesaveloadbacklogmenuが指定可能です。
storageHTMLファイルのパスを指定します。
  • サンプルコード
[sysview type="save" storage="./data/others/plugin/mytheme/html/save.html" ]
[sysview type="load" storage="./data/others/plugin/mytheme/html/load.html" ]
[sysview type="backlog" storage="./data/others/plugin/mytheme/html/backlog.html" ]
[sysview type="menu" storage="./data/others/plugin/mytheme/html/menu.html]

[save_img] セーブデータのサムネイル変更

  • システムデザイン変更

セーブデータのサムネイルに好きな画像を指定できます。

通常、セーブデータのサムネイルにはセーブした瞬間のゲーム画面のキャプチャが使用されます。しかし[save_img]タグを使用することで、特定の画像をサムネイルにすることができます。

画像ファイルはdata/bgimageフォルダに配置します。

storagedefaultを指定すると、通常のサムネイル(ゲーム画面のキャプチャ)に戻すことができます。

解説チュートリアル

パラメータ必須解説初期値
storageサムネイルに設定したい画像ファイルを設定します。bgimageフォルダに配置してください。defaultを指定すると画面キャプチャに戻ります。
folder画像をbgimageフォルダ以外から取得したい場合は、ここに指定します。たとえばothersfgimageimageなど。
  • サンプルコード
;サムネイル画像の変更
[save_img storage="my_capture.png" ]

[set_resizecall] レスポンシブデザイン対応

  • システムデザイン変更

プレイ端末の画面比率が入れ替わったタイミングでシナリオを呼び出すことができます。

たとえば、タテ持ち→ヨコ持ちになったタイミングで、ヨコ持ち用の座標へ変更するスクリプトを実行。

逆に、ヨコ持ち→タテ持ちになったタイミングで、タテ持ち用の座標へ変更するスクリプトを実行。

このように実装することで、様々なレイアウトに対応したゲームを作ることができます。

なお、呼び出した先では必ず[return]を実行する必要があります。

公式の実践テクニック解説もご覧ください。
https://tyrano.jp/usage/advance/responsive

解説チュートリアル

パラメータ必須解説初期値
storageジャンプ先のシナリオファイル名を指定します。省略すると、現在のシナリオファイルとみなされます。
targetジャンプ先のラベル名を指定します。省略すると、シナリオファイルの先頭にジャンプします。
  • サンプルコード
[call storage="resize.ks"]

;画面比率が変わったタイミングでresize.ksを呼び出す、という宣言
[set_resizecall storage="resize.ks" ]

[dialog_config] 確認ダイアログのデザイン変更

  • システムデザイン変更

タイトルに戻っていいかどうかを確認するときなどに表示される確認ダイアログのデザインを変更することができます。ダイアログのデザインを変更するタグには以下の4種類があります。

[dialog_config]
[dialog_config_ok]
[dialog_config_ng]
[dialog_config_filter]

★重要
このタグで変更した内容はセーブ・ロードによって復元されません。つまり、シナリオが始まったあと・ロードができる状態になったあとで演出の都合で一時的にこのタグでダイアログを変更する、といった使い方は危険です。ゲームを起動してからタイトルなどに移行するまでの間(first.ksなど)に記述するとよいでしょう。

パラメータ必須解説初期値
btntypeボタンのタイプをまとめて指定できます。指定できるキーワードは[glink]colorパラメータに準じます。
btnwidthボタンの横幅をpx単位でまとめて指定できます。
btnmarginボタンの外余白をpx単位でまとめて指定できます。カンマ区切りに対応。10,20のように指定すると、縦余白が10、横余白が20と指定したことになります。
btnpaddingボタンの内余白をpx単位でまとめて指定できます。カンマ区切りに対応。10,20のように指定すると、縦余白が10、横余白が20と指定したことになります。
fontsizeメッセージの文字サイズを指定します。
fontboldメッセージを太字にする場合はtrueを指定します。
fontfaceメッセージのフォントを指定します。
fontcolorメッセージの文字色を指定します。
btnfontsizeボタンの文字サイズを指定します。
btnfontboldボタンを文字を太字にする場合はtrueを指定します。
btnfontfaceボタンのフォントを指定します。
btnfontcolorボタンの文字色を指定します。
boxcolorメッセージボックスの背景色を指定できます。
boxopacityメッセージボックスの不透明度を0255で指定できます。255で完全に不透明です。
boxradiusメッセージボックスの角に丸みを付けたいときにその丸みの半径を数値で指定します。
boxwidthメッセージボックスの横幅をpx単位で指定できます。
boxheightメッセージボックスの高さpx単位で指定できます。
boxpaddingメッセージボックスの内余白をpx単位で指定できます。10,20,10のようなカンマ区切りの指定に対応します。
boximgメッセージボックスの背景画像を指定できます。ファイルの場所はimageが基準となります。
boximgposメッセージボックスの背景画像の表示位置を指定できます。たとえばcenterと指定すると画面中央、left topで左上、right topで右上、right bottomで右下、left bottomで左下となります。
boximgrepeatメッセージボックスの背景画像の繰り返しを指定できます。画像を繰り返して敷き詰める場合はrepeat、繰り返したくない場合はno-repeatを指定します。
boximgsizeメッセージボックスの背景画像のサイズをpx単位で指定できます。
bgcolorダイアログ外側の背景色を指定できます。
bgopacityダイアログ外側の不透明度を0255で指定できます。255で完全に不透明です。
bgimgダイアログ外側の背景画像を指定できます。ファイルの場所はimageが基準となります。
bgimgposダイアログ外側の背景画像の表示位置を指定できます。たとえばcenterと指定すると画面中央、left topで左上、right topで右上、right bottomで右下、left bottomで左下となります。
bgimgrepeatダイアログ外側の背景画像の繰り返しを指定できます。画像を繰り返して敷き詰める場合はrepeat、繰り返したくない場合はno-repeatを指定します。
bgimgsizeダイアログ外側の背景画像のサイズをpx単位で指定できます。
openeffectダイアログを開いたときのエフェクトを指定できます。指定できるキーワードは[mask]に準じます。
opentimeダイアログを開いたときのエフェクト時間をミリ秒単位で指定できます。
closeeffectダイアログを開いたときのエフェクトを指定できます。指定できるキーワードは[mask_off]に準じます。
closetimeダイアログを開いたときのエフェクト時間をミリ秒単位で指定できます。
gotitleタイトルに戻っていいかを確認するときのテキストを変更できます。
okpos「OK」ボタンの位置を左に変更したい場合はleft、右に変更したい場合はrightを指定します。
ingameディスプレイ全体ではなくゲーム画面の範囲内に確認ダイアログを収めたい場合にはtrueを指定します。falseでもとに戻ります。
  • サンプルコード
[dialog_config bgimg="pattern.jpg" bgimgrepeat="repeat" bgopacity="66"]
[dialog_config boxradius="20" boxcolor="#F0E3FD" boximg="../bgimage/title.jpg" boximgpos="right bottom" boximgsize="200" boxopacity="200"]
[dialog_config openeffect="rotateIn" opentime="800" closeeffect="rotateOut" closetime="800"]

[dialog_config_ok] 確認ダイアログのデザイン変更(OKボタン)

  • システムデザイン変更

タイトルに戻っていいかどうかを確認するときなどに表示される確認ダイアログのデザインを変更することができます。ダイアログのデザインを変更するタグには以下の4種類があります。

[dialog_config]
[dialog_config_ok]
[dialog_config_ng]
[dialog_config_filter]

このタグでは、OKボタンの設定を行うことができます。

★重要
このタグで変更した内容はセーブ・ロードによって復元されません。つまり、シナリオが始まったあと・ロードができる状態になったあとで演出の都合で一時的にこのタグでダイアログを変更する、といった使い方は危険です。ゲームを起動してからタイトルなどに移行するまでの間(first.ksなど)に記述するとよいでしょう。

★重要
imgパラメータが指定された[glink_config_ok]を通過するタイミングで、それまでのOKボタンの設定が破棄されます。つまり、画像をボタンに使う場合はタグを小分けして書かずにひとつの[glink_config_ok]で記述する必要があります。(文字ボタンの場合は関係ありません)

パラメータ必須解説初期値
textOKボタンのテキストを指定できます。
typeOKボタンのタイプを指定できます。指定できるキーワードは[glink]colorパラメータに準じます。
widthOKボタンの横幅をpx単位で指定できます。
marginOKボタンの外余白をpx単位で指定できます。カンマ区切りに対応。10,20のように指定すると、縦余白が10、横余白が20と指定したことになります。
paddingOKボタンの内余白をpx単位で指定できます。カンマ区切りに対応。10,20のように指定すると、縦余白が10、横余白が20と指定したことになります。
fontsizeOKボタンの文字サイズを指定します。
fontboldOKボタンを文字を太字にする場合はtrueを指定します。
fontfaceOKボタンのフォントを指定します。
fontcolorOKボタンの文字色を指定します。
imgOKボタンに画像を使うことができます。imageフォルダを基準とした画像ファイルの場所を指定します。
imgwidthOKボタンの画像の横幅をpx単位で指定できます。
enterimgマウスがOKボタンの上に乗ったときの画像ファイル。imageフォルダから探します。
activeimgマウスがOKボタンを押し込んでから放されるまでの画像ファイル。imageフォルダから探します。
clickimgマウスがOKボタンをクリックした後の画像ファイル。imageフォルダから探します。
enterseマウスがOKボタンの上に乗ったときに再生する音声ファイル。soundフォルダから探します。
leaveseマウスがOKボタンの上から離れたときに再生する音声ファイル。soundフォルダから探します。
clickseマウスがOKボタンを押し込んだときに再生する音声ファイル。soundフォルダから探します。
  • サンプルコード
[dialog_config_ok text="いいですよ"]
[dialog_config_ok width="200" margin="10,30" type="btn_04_green"]

;画像ボタンにする場合はひとつのタグで記述
[dialog_config_ok img="dialog/ok.png" width="100" margin="20" enterimg="dialog/ok_enter.png" activeimg="dialog/ok_active.png" clickimg="dialog/ok_click.png" enterse="lab1.mp3" leavese="lab2.mp3" clickse="lab3.mp3"]

[dialog_config_ng] 確認ダイアログのデザイン変更(キャンセルボタン)

  • システムデザイン変更

タイトルに戻っていいかどうかを確認するときなどに表示される確認ダイアログのデザインを変更することができます。ダイアログのデザインを変更するタグには以下の4種類があります。

[dialog_config]
[dialog_config_ok]
[dialog_config_ng]
[dialog_config_filter]

このタグでは、キャンセルボタンの設定を行うことができます。

★重要
このタグで変更した内容はセーブ・ロードによって復元されません。つまり、シナリオが始まったあと・ロードができる状態になったあとで演出の都合で一時的にこのタグでダイアログを変更する、といった使い方は危険です。ゲームを起動してからタイトルなどに移行するまでの間(first.ksなど)に記述するとよいでしょう。

★重要
imgパラメータが指定された[glink_config_ng]を通過するタイミングで、それまでのキャンセルボタンの設定が破棄されます。つまり、画像をボタンに使う場合はタグを小分けして書かずにひとつの[glink_config_ng]で記述する必要があります。(文字ボタンの場合は関係ありません)

パラメータ必須解説初期値
textキャンセルボタンのテキストを指定できます。
typeキャンセルボタンのタイプを指定できます。指定できるキーワードは[glink]colorパラメータに準じます。
widthキャンセルボタンの横幅をpx単位で指定できます。
marginキャンセルボタンの外余白をpx単位で指定できます。カンマ区切りに対応。10,20のように指定すると、縦余白が10、横余白が20と指定したことになります。
paddingキャンセルボタンの内余白をpx単位で指定できます。カンマ区切りに対応。10,20のように指定すると、縦余白が10、横余白が20と指定したことになります。
fontsizeキャンセルボタンの文字サイズを指定します。
fontboldキャンセルボタンを文字を太字にする場合はtrueを指定します。
fontfaceキャンセルボタンのフォントを指定します。
fontcolorキャンセルボタンの文字色を指定します。
imgキャンセルボタンに画像を使うことができます。imageフォルダを基準とした画像ファイルの場所を指定します。
imgwidthキャンセルボタンの画像の横幅をpx単位で指定できます。
enterimgマウスがキャンセルボタンの上に乗ったときの画像ファイル。imageフォルダから探します。
activeimgマウスがキャンセルボタンを押し込んでから放されるまでの画像ファイル。imageフォルダから探します。
clickimgマウスがキャンセルボタンをクリックした後の画像ファイル。imageフォルダから探します。
enterseマウスがキャンセルボタンの上に乗ったときに再生する音声ファイル。soundフォルダから探します。
leaveseマウスがキャンセルボタンの上から離れたときに再生する音声ファイル。soundフォルダから探します。
clickseマウスがキャンセルボタンを押し込んだときに再生する音声ファイル。soundフォルダから探します。
  • サンプルコード
[dialog_config_ng text="ダメです"]
[dialog_config_ng width="200" margin="10,30" type="btn_04_white"]

[dialog_config_filter] 確認ダイアログのデザイン変更(フィルター)

  • システムデザイン変更

タイトルに戻っていいかどうかを確認するときなどに表示される確認ダイアログのデザインを変更することができます。ダイアログのデザインを変更するタグには以下の4種類があります。

[dialog_config]
[dialog_config_ok]
[dialog_config_ng]
[dialog_config_filter]

このタグでは、ダイアログを表示したときに背景全体に適用するフィルターを指定できます。指定できるパラメータは[filter]と同じです。

★重要
このタグで変更した内容はセーブ・ロードによって復元されません。つまり、シナリオが始まったあと・ロードができる状態になったあとで演出の都合で一時的にこのタグでダイアログを変更する、といった使い方は危険です。ゲームを起動してからタイトルなどに移行するまでの間(first.ksなど)に記述するとよいでしょう。

パラメータ必須解説初期値
layerフィルタをかけるレイヤを指定します。省略すると、もしくはallと指定するとゲーム画面全てに効果がかかります。
name特定の要素にフィルタをかけたい場合に、その要素のnameを指定します。
grayscale0(デフォルト)~100を指定することで、画像の表示をグレースケールに変換できます。
sepia0(デフォルト)~100を指定することで、画像の表示をセピア調に変換できます。
saturate0100(デフォルト)を指定してあげることで、画像の表示の彩度(色の鮮やかさ)を変更できます。
hue0(デフォルト)~360を指定することで、画像の表示の色相を変更できます。
invert0(デフォルト)~100を指定することで、画像の表示の階調を反転させることができます。
opacity0100(デフォルト)を指定することで、画像の表示の透過度を変更できます。
brightness100(デフォルト)を基準とする数値を指定することで、画像の明度を変更できます。0で真っ暗に、100以上の数値でより明るくなります。
contrast0100(デフォルト)を指定することで、画像の表示のコントラストを変更できます。
blur0(デフォルト)~任意の値を指定することで、画像の表示をぼかすことができます。
  • サンプルコード
[dialog_config_filter blur="15"]

[mode_effect] モード変化エフェクト

  • システムデザイン変更

次のタイミングで画面中央にエフェクトを出すことができます。

①スキップモード開始時
②オートモード開始時
③スキップモードまたはオートモード停止時
④ホールドスキップモード開始時
⑤ホールドスキップモード停止時

※ホールドスキップとは「ボタンやキーを押している間だけスキップする機能」のことです。キーボードのCtrlキーに割り当てられていることが一般的です。

パラメータ必須解説初期値
skipスキップモード開始時に表示されるエフェクト。nonedefault、またはimageフォルダを基準とする画像ファイルの場所を指定します。noneだとエフェクトなし、defaultだとデフォルトのエフェクト、画像ファイルを指定するとその画像を出すことができます。
autoオートモード開始時に表示されるエフェクト。skipパラメータと同様に指定します。
stopスキップモードまたはオートモード停止時に表示されるエフェクト。skipパラメータと同様に指定します。
holdskipホールドスキップモード開始時に表示されるエフェクト。skipパラメータと同様に指定します。
holdstopホールドストップモード停止時に表示されるエフェクト。skipパラメータと同様に指定します。
all5種類のエフェクトをまとめて指定できます。skipパラメータと同様に指定します。
envallpcphoneのいずれかを指定します。pcを指定すると、プレイヤーがPCでゲームを遊んでいるとき限定のエフェクトを設定できます。phoneを指定すると、プレイヤーがスマホ・タブレットでゲームを遊んでいるとき限定のエフェクトを設定できます。all(デフォルト)の場合は2つの環境の設定をまとめて行います。all
widthエフェクトの横幅を指定したい場合、数値(px単位)を指定します。
heightエフェクトの高さを指定したい場合、数値(px単位)を指定します。
colorエフェクトにdefaultを使用する場合に、図形部分の色を指定できます。
bgcolorエフェクトにdefaultを使用する場合に、図形を囲む丸部分の色を指定できます。
  • サンプルコード
[mode_effect all="default" holdskip="none" holdstop="none"]

[loading_log] ローディングログ

  • システムデザイン変更

素材の読み込みを行っているときやセーブ処理が走っているときなど、ゲームが一時的に止まっているタイミングで画面端に「Loading...」のようなログを出すことができます。

パラメータ必須解説初期値
preload素材の読み込み中に表示するテキストを自由に設定できます。noneを指定するとログを無効にできます。defaultを指定するとデフォルトのログになります。notextを指定するとテキストなしでローディングアイコンだけを出すことができます。
saveセーブ処理中に表示するテキストを自由に設定できます。preload パラメータと同様に、nonedefaultnotextというキーワードが指定可能。
allpreload、save パラメータをまとめて指定できます。たとえば、all="default"とすればすべてのログにデフォルトのテキストを設定できます。
dottimeテキストの後ろに「...」というドットが増えていくアニメーションの所要時間をミリ秒で指定できます。0を指定するとドットアニメーションを無くすことができます。
iconローディングアイコンを表示するかどうかをtrueまたはfalseで指定します。ローディングアイコンを非表示にしてテキストのみにしたい場合にはfalseを指定してください。
  • サンプルコード
[loading_log all="default"]

[showsave] セーブ画面の表示

  • メニュー・HTML表示

セーブ画面を表示します。

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
[showsave]

[showload] ロード画面の表示

  • メニュー・HTML表示

ロード画面を表示します。

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
[showload]

[showmenu] メニュー画面の表示

  • メニュー・HTML表示

メニュー画面を表示します。

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
[showmenu]

[showlog] バックログの表示

  • メニュー・HTML表示

バックログを表示します。

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
[showlog]

[web] Webサイトを開く

  • メニュー・HTML表示

指定したWebサイトをブラウザで開くことができます。

★重要
ただし、このタグの直前にクリック待ちを配置する必要があります。
スマホブラウザを始めとする多くの環境において、ユーザーアクションなしに(たとえばテキスト表示中にいきなり勝手に)別ページに飛ぶような挙動が禁止されているためです。

解説チュートリアル

パラメータ必須解説初期値
url開きたいWebサイトのURLを指定します。ゲーム内の画像ファイルなどを開きたい場合、ファイルの場所をdataから初めて記述します。
  • サンプルコード
;クリック待ちを挟む
公式サイトを開きます[p]
[web url="http://tyrano.jp"]

;ローカルのファイルを開きたい場合
[web url="./data/bgimage/room.jpg"]

[html] HTMLをレイヤ追加

  • メニュー・HTML表示

[html][endhtml]の間に記述したHTMLを表示できます。このHTMLは最前面に表示されます。

この機能は非常に強力です。JavaScript、Canvas、YouTubeのプレイヤーなどを埋め込むことができ、次世代Web表現を全てサポートします。

HTMLの記述内にティラノスクリプトの変数を使うことができます。通常のテキスト通り[emb]タグを使用してください。

★注意
HTML表示中は画面をクリックしてもゲームが進みません。必ずグラフィックボタンなどを配置して、ジャンプでゲームを進める状態にしてください。

解説チュートリアル

パラメータ必須解説初期値
leftHTMLの左端位置を指定します。(ピクセル)
topHTMLの上端位置を指定します。(ピクセル)
nameHTML領域に名前を指定できます。この名前を使って、HTML領域に対してアニメーションを実行することができます。
  • サンプルコード
;youtubeのプレイヤーを指定した位置に挿入します
;yoububeから埋め込み用タグを取得してきています
[html top=100 left=300]

<object width="200" height="113">
<param name="movie" value="http://www.youtube.com/v/60TMm2sQTBU?version=3&amp;hl=ja_JP&amp;rel=0">
</param>
<param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param>
<embed src="http://www.youtube.com/v/60TMm2sQTBU?version=3&amp;hl=ja_JP&amp;rel=0" type="application/x-shockwave-flash" width="200" height="113" allowscriptaccess="always" allowfullscreen="true">
</embed></object>

[endhtml]

[endhtml] HTMLの終了

  • メニュー・HTML表示

HTMLの記述を終了します。

パラメータ必須解説初期値
指定できるパラメータはありません。

[clearstack] スタックの消去

  • マクロ・分岐・サブルーチン関連

システムが管理するスタックを消去します。帰るべきスタックがない場面(タイトルや章の始まりなど、きりの良い場面)でこのタグを配置しておくことをオススメします

スタックとは、ゲームを進める中で[call][if]、マクロを通過するときに呼び出し元に帰ってくるために記憶しておくメモリ領域です。(森を探検するときに目印として落としておくパンくずのようなものとお考えください)

通常であれば、スタックは[return][endif][endmacro]を踏んだときに回収されます。しかし[call]先で[return]することなく別のシナリオにジャンプしたり、[if]やマクロの中でジャンプしたりすることを繰り返した場合、回収されないスタックが溜まっていきます。

スタックが溜まりすぎると、ゲームの動作が重くなったりセーブデータが肥大化したりする恐れがあります。

パラメータ必須解説初期値
stackcallifmacroのいずれかを指定できます。特定のスタックのみ削除できます。省略すると、全てのスタックを削除します。
V515以降:animを指定できます。animを指定した場合、現在実行中のアニメーション数を強制的にゼロにして、[wa]で確実に次のタグに進むようにできます。なお、stackパラメータを省略した場合はこの操作は行われません。

[if] 条件分岐

  • マクロ・分岐・サブルーチン関連

条件分岐を行います。

expに指定されたJavaScriptの式を評価します。その結果がtrue(真)ならば、[elsif][else][endif]のいずれかまでにある文章やタグを実行します。false(偽)ならば、次の[elsif][else][endif]のいずれかに移動します。

JavaScriptの比較式の例を以下に示します。例中のABには、変数、数値、文字列、式などを当てはめることができます。

A === B AとBは等しい
A !== B AとBは等しくない
A > B AはBよりも大きい
A >= B AはB以上である
A < B AはBよりも小さい
A <= B AはB以下である

★高度
expには比較式以外も記述できます。truefalseなどのキーワードを直接指定したり、変数を指定したり、関数を実行したりできます。JavaScriptにはいくつか特殊なtrueとして扱われる値が存在しますので、注意が必要です。

解説チュートリアル

パラメータ必須解説初期値
exp評価するJavaScriptの式を指定します。
  • サンプルコード
;ゲーム変数 like に 50 という数値をセット
;自由に変えてみてください
[iscript]
f.like = 50
[endscript]

例1[p]

[if exp="f.like < 30"]
  好感度が低いです[p]
[endif]

例2[p]

[if exp="f.like < 3c0"]
  好感度が低いです[p]
[else]
  好感度が低くはないようです[p]
[endif]

例3[p]

[if exp="f.like >= 80"]
  最高の好感度です[p]
[elsif exp="f.like >= 40"]
  かなり高い好感度です[p]
[else]
  好感度は高くありません[p]
[endif]

[elsif] 条件分岐(複数の条件)

  • マクロ・分岐・サブルーチン関連

[if]タグと[endif]タグの間で使います。分岐の条件を増やして、複雑な分岐を行なうことができます。

このタグまでに記述された[if][elsif]タグの条件をまだ満たしていない場合にexpを評価します。その結果がtrue(真)ならば、次の[elsif][else][endif]のいずれかまでにある文章やタグを実行します。false(偽)ならば、次の[elsif][else][endif]のいずれかに移動します。

使い方の例については[if]タグの項目を参照してください。

解説チュートリアル

パラメータ必須解説初期値
exp評価する JS 式を指定します。

[else] 条件分岐(条件を満たさなかったとき)

  • マクロ・分岐・サブルーチン関連

[if]もしくは[elsif]タグと[endif]タグの間で用いられます。 このタグまでに記述された[if][elsif]タグの条件をまだ満たしていない場合に、このタグから[endif]までの記述が実行されます。

使い方の例については[if]タグの項目を参照してください。

解説チュートリアル

パラメータ必須解説初期値
指定できるパラメータはありません。

[endif] 条件分岐の終了

  • マクロ・分岐・サブルーチン関連

[if]文を終了します。[if]文の終わりに必ず記述する必要があります。

パラメータ必須解説初期値
指定できるパラメータはありません。

[call] サブルーチンの呼び出し

  • マクロ・分岐・サブルーチン関連

指定したシナリオファイル・ラベルにジャンプします。

ジャンプ先で[return]タグに到達すると、[call]タグの場所にまた戻ってきます。[return]タグで戻ってこれるという点が[jump]タグとの違いです。

[call]タグのジャンプ先のことをサブルーチンと呼びます。たとえば、何度も使うことになる同じ処理をサブルーチンとして記述して[call]で呼び出すようにする、という使い方があります。

[call]タグが実行されるとスタックがひとつ溜まります。スタックは[return]で回収されます。スタックについては[clearstack]の項目もご確認ください。

解説チュートリアル

パラメータ必須解説初期値
storage呼び出したいサブルーチンのあるのシナリオファイルを 指定します。省略すると、現在 のシナリオファイル内であるとみなされます。
target呼び出すサブルーチンのラベルを指定します。省略すると、ファイルの先頭から実行されます。
  • サンプルコード
頭をなでた。[p]
[call target=sub]
しっぽをなでた。[p]
[call target=sub]
おなかをなでた。[p]
[call target=sub]
おわり[s]

*sub
[font color=green]
好感度が上がったぞ!
[resetfont][p]
[return]

[return] サブルーチンから戻る

  • マクロ・分岐・サブルーチン関連

サブルーチンから呼び出し元に戻ります。詳細は[call]の項目を参照してください。

解説チュートリアル

パラメータ必須解説初期値
指定できるパラメータはありません。

[macro] マクロ定義の開始

  • マクロ・分岐・サブルーチン関連

マクロ記述を開始します。自分で新しいタグを定義することが出来ます

[macro]から[endmacro]タグまでにある文章やタグは、name属性で指定されたタグとして登録されます。登録されたあとは自由に使用できるようになります。

マクロの中に書かれたタグには、特殊なパラメータの指定の記述方法が存在します。

パラメータの値の先頭に%を付けると、マクロに渡されたパラメータの値を流用できます。このとき、|を使って属性の省略値を指定することもできます。サンプルコードを見れば理解しやすいでしょう。

またタグのなかに*を書くと、マクロに渡されたすべてのパラメータをそのタグに流用できます。

解説チュートリアル

パラメータ必須解説初期値
name

マクロの名前を指定します。以後、この名前をタグのように記述することで、マクロを呼び出せるようになります。

★重要
ティラノスクリプトにすでに使用されているタグ名は使わないでください。またtextlabelも使えません。

  • サンプルコード
;自分で[my_color_1]というタグを作れる!!
[macro name="my_color_1"]
  [font color="0xff0000"]
  新しいタグです[p]
  [resetfont]
[endmacro]

;さっそく使ってみる
[my_color_1]

;iroパラメータを指定できる、もし指定がなかったら0xff0000
[macro name="my_color_2"]
  [font color=%iro|0xff0000]
  iroパラメータを指定できるタグです[p]
  [resetfont]
[endmacro]

;さっそく使ってみる
[my_color_2 iro=0x00ff00]
[my_color_2]

;すべてのパラメータを流用するマクロ
[macro name="my_color_3"]
  [font *]
  すべてのパラメータを渡せるタグです[p]
  [resetfont]
[endmacro]

[my_color_3 color=0x0000ff bold=true size=80]

[endmacro] マクロ定義の終了

  • マクロ・分岐・サブルーチン関連

マクロの記述を終了します。

パラメータ必須解説初期値
指定できるパラメータはありません。

[erasemacro] マクロの削除

  • マクロ・分岐・サブルーチン関連

登録したマクロを削除します。

パラメータ必須解説初期値
name削除するマクロ名を指定します。

[ignore] 条件によりシナリオを無視

  • マクロ・分岐・サブルーチン関連

expに指定されたJavaScriptの式を評価します。その結果がtrue(真)ならば、[ignore][endignore]で囲まれた文章やタグが無視されます。

パラメータ必須解説初期値
exp評価するJavaScriptの式を指定します。

[endignore] [ignore]の終了

  • マクロ・分岐・サブルーチン関連

[ignore]の記述を終了します。

パラメータ必須解説初期値
指定できるパラメータはありません。

[sleepgame] ゲームの一時停止

  • マクロ・分岐・サブルーチン関連

このタグに到達した時点でゲームの状態を保存した上で、他のシナリオにジャンプできます。ジャンプ先で[awakegame]に到達するとゲームの状態が[sleepgame]時点に復帰します。

このタグはゲームから一時的に画面を遷移したい場合に非常に強力に機能します。たとえばゲームの途中でコンフィグの設定を行いたい場合には、[sleepgame]で進行状態を保持したうえでコンフィグ用のシナリオファイルに移動したあと、[awakegame]タグでゲームに復帰するような挙動が可能です。

[sleepgame]は複数実行することはできません。つまり、[sleepgame]で休止中の状態で[sleepgame]するようなことはできません。ジャンプ先には必ず[awakegame]を配置してください。

休止中に[breakgame]タグを踏むと戻ってくることなく休止中の状態を破棄します。

[sleepgame]の動作を[button]に登録することもできます。[button]タグにrole=sleepgameを指定することで[sleepgame]の挙動になります。

解説チュートリアル

パラメータ必須解説初期値
storageジャンプ先のシナリオファイル名を指定します。省略すると、現在のシナリオファイルとみなされます。
targetジャンプ先のラベル名を指定します。省略すると、シナリオファイルの先頭にジャンプします。
nexttrueまたはfalseを指定します。falseを指定すると[awakegame]で戻ってきたときに次のタグに進まなくなります。true
  • サンプルコード
[sleepgame storage="scene3.ks" target="*start" ]

;buttonに紐付ける方法
[button name="button" role="sleepgame" fix="true" graphic="button/skip.gif" x=450 y=400 storage="scene3.ks" ]

[awakegame] ゲームの一時停止からの復帰

  • マクロ・分岐・サブルーチン関連

[sleepgame]タグで保存されたゲームの状態に復帰します。

ジャンプ先でゲーム変数を操作した場合、その内容は復帰後に反映されます。

セーブデータをロードするときと同様に、ゲームの復帰時にはmake.ksを通過します。休止中の操作に対してなんらかの特別な処理を実行したい場合、make.ksでゲーム変数などを使って[awakegame]からの復帰かどうかの判定をいれるとよいでしょう。

解説チュートリアル

パラメータ必須解説初期値
variable_overtrueまたはfalseを指定します。trueを指定すると、[sleepgame]中のゲーム変数の変更を復帰後に引き継ぎます。true
bgm_overtrueまたはfalseを指定します。trueを指定すると、[sleepgame]中のBGMを復帰後に引き継ぎます。true

[breakgame] ゲームの停止データの削除

  • マクロ・分岐・サブルーチン関連

[sleepgame]タグで保存した休止状態を破棄します。

休止状態に復帰する必要がなくなった段階で[breakgame]を配置するとよいでしょう。

パラメータ必須解説初期値
指定できるパラメータはありません。

[loadjs] 外部JavaScriptファイル読み込み

  • 変数・JS操作・ファイル読込

外部JavaScriptファイルをロードします。無制限な機能拡張が可能です。
JavaScriptファイルはdata/othersフォルダに配置してください。

解説チュートリアル

パラメータ必須解説初期値
storageロードするJavaScriptファイルを指定します。
  • サンプルコード
;data/others/sample.jsを読み込み
[loadjs storage="sample.js"]

[eval] 式の評価

  • 変数・JS操作・ファイル読込

expに指定されたJavaScriptの文を実行します。主に変数に値をセットする際に活用できます。

expに指定する文は必ずダブルクォート(")で囲みましょう。意図しない動作を防ぐことができます。

expには任意のJavaScript文を指定できるので、関数の実行なども可能です。(高度)

解説チュートリアル

パラメータ必須解説初期値
exp実行するJavaScript文を指定します。
  • サンプルコード
[eval exp="f.akane_like=50"]
;↑ゲーム変数 akane_like に 50 という数値をセット
;あかねの好感度は50のようだ

[eval exp="f.akane_nickname=''"]
;↑ゲーム変数 akane_nickname に あーちゃん という文字列をセット
;あかねのあだ名はあーちゃんのようだ
;※文字列はシングルクォーテーション(')で囲みます

[eval exp="f.yamato_like = f.akane_like * 2"]
;↑ゲーム変数 yamato_like に ゲーム変数 akane_like の 2倍の数値をセット
;やまとの好感度はあかねの好感度の2倍のようだ

[clearvar] 変数の消去

  • 変数・JS操作・ファイル読込

変数を消去します。特定の変数だけを消去することもできます。

パラメータ必須解説初期値
exp消去する変数名を指定します。f.namesf.flagのように指定します。nameflagでは動作しません。
省略すると、すべての変数が消去されます。

[clearsysvar] システム変数の全消去

  • 変数・JS操作・ファイル読込

システム変数を全消去します。

パラメータ必須解説初期値
指定できるパラメータはありません。

[trace] コンソールへの値の出力

  • 変数・JS操作・ファイル読込

expパラメータで指定された式を評価し、結果をコンソールに出力します。

ブラウザ版の場合、コンソールを確認するにはデベロッパーツールを開いてください。

パラメータ必須解説初期値
exp評価するJS式を指定します。
  • サンプルコード
;ゲーム変数testに1を入れる
[eval exp="f.test=1"]

;ゲーム変数testの内容をコンソールに出力する
[trace exp="f.test"]

[iscript] JavaScriptの記述

  • 変数・JS操作・ファイル読込

[iscript][endscript]に囲まれた箇所にJavaScriptの文を記述できます。

解説チュートリアル

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
[iscript]

var test = 22;
f.name = test;
//JavaScriptの関数にアクセス可能
alert("JavaScript");
//jQueryも利用可能
$("body").html();

//JS方式の行コメントも書けますが
;ティラノスクリプトの行コメントも有効のままなので注意が必要です
;alert("!!")

[endscript]

[endscript] JavaScriptの終了

  • 変数・JS操作・ファイル読込

JavaScriptの記述を終了します。

パラメータ必須解説初期値
stop【高度】trueを指定すると、[endscript]に到達したときに次のタグに進まなくなります。JavaScriptの記述によってシナリオをジャンプさせたい場合にtrueを指定します。false

[emb] 式評価結果の埋め込み

  • 変数・JS操作・ファイル読込

expで指定されたJavaScriptの文を評価し、その結果をテキストとして表示します。

変数の中身をシナリオに埋め込みたい場合に使います。

パラメータ必須解説初期値
exp評価するJavaScriptの式を指定します。基本的には変数の名前を指定すればよいでしょう。f.namesf.textなど。
  • サンプルコード
;ゲーム変数 name に ポチ という文字列をセット
[eval exp="f.name='ポチ'"]
;↑長くなるためここでは扱いませんが
; [edit]タグでプレイヤーに入力させてみても面白いですね

;テキスト中に変数の中身を埋め込む
今日からこの子の名前は[emb exp="f.name"]だ。[l][r]

;キャラの名前のようなケースでは
;仮名でマクロ化しておくとシナリオファイルが読みやすくなるでしょう
[macro name="シロ"]
  [emb exp="f.name"]
[endmacro]

;仮名マクロで記述する
おーい、[シロ]。[シロ]!元気?[s]
;※サンプルでは f.name に ポチ が入っているのでポチと表示される

[preload] 素材ファイルの事前読み込み

  • 変数・JS操作・ファイル読込

[preload]タグを使用することで、素材ファイル(画像や音楽)を事前に読み込むことができます。
実際に素材を使用する際に表示がスムーズになります。

V515以降:プリロードした音声ファイルは一度再生した時点で破棄される仕様になりました(メモリを圧迫しないようにするため)。
システム効果音やBGMなど、繰り返し使うことが予想される音声ファイルをプリロードするときはsingle_use="false"を指定することを検討してください。

パラメータ必須解説初期値
storageプリロードするファイルをフルパスで指定します。JavaScriptの配列を指定することもできます。
waittrueを指定すると、すべての読み込みが完了するまでゲームを停止します。trueにする場合は画面に「Now Loading」などと表示しておき、素材のロード中であることをプレイヤーに知らせるべきでしょう。false
single_use音声ファイルを読み込む場合にのみ意味を持つパラメータです。true(デフォルト)を指定するとプリロードデータが使い捨てとなり、[playbgm]などでプリロードデータを一度使用した時点でプリロードデータが破棄されます(メモリを圧迫しないようにするため)。一度使ったあともプリロードデータを保持したい場合はfalseを指定してください。falseを指定した場合であっても[unload]タグを使うことでプリロードデータを明示的に破棄できます。true
name音声ファイルを読み込む場合にのみ意味を持つパラメータです。たとえば"bgm"、"se"、"section1"などのグループ名を付けておくことで、あとで[unload]タグでデータを破棄する際に対象をまとめて指定できます。カンマ区切りで複数指定可。
  • サンプルコード
;画像ファイルはフルパス(プロジェクトファイル以下)で指定します
[preload storage="data/fgimage/girl.jpg"]

;配列を渡すと、まとめてロードすることもできます。
[iscript]
f.preload_images = [
  'data/fgimage/girl.jpg',
  'data/fgimage/haruko.png',
  'data/fgimage/miku1.png',
  'data/fgimage/miku2.png'
];
[endscript]

[preload storage=&f.preload_images]

[unload] 音声プリロードデータの破棄

  • 変数・JS操作・ファイル読込

[preload]タグにsingle_use="false"を指定したうえで多数の音声ファイルをプリロードしていると、音声プリロードデータがメモリを圧迫して動作に悪影響を及ぼすことがあります。

[unload]タグを使うことで、音声プリロードデータを明示的に破棄できます。storagenameall_soundのいずれかのパラメータを指定してください。

パラメータ必須解説初期値
storage破棄する音声プリロードデータの場所。[preload]に指定していたものを指定します。
name[preload]に指定したnameを使って対象をまとめて指定できます。
all_soundtrueを指定すると、すべての音声プリロードデータを破棄します。false

[plugin] プラグイン読み込み

  • 変数・JS操作・ファイル読込

外部プラグインを読み込むことができます。
プラグインはdata/others/pluginフォルダに配置します。

[plugin]タグには自由にパラメータを指定することができます。たとえば、

[plugin name="my_plugin" my_color="black" my_name="シケモク"]

と指定すると、プラグインのinit.ksのなかで

mp.my_color
mp.my_name

のような形で引数を利用できます。

これを&mp.my_colorのように使うことで、カスタマイズ可能なプラグインが作れます。

ただし、マクロで使用可能だった%my_colorのような形での使用はできません。

解説チュートリアル

パラメータ必須解説初期値
name読み込むプラグインの名前を指定します。プラグインはdata/others/pluginフォルダに配置します。
storage最初に読み込むシナリオファイルを変更できます。init.ks
  • サンプルコード
;プラグイン my_plugin を読み込み
[plugin name="my_plugin" ]
;↑ data/others/plugin/my_plugin/init.ks にジャンプしているよ

;自由に引数を渡すことも可能
[plugin name="my_plugin" font_color="black" arg2="aaaaaa" ]

[loadcss] CSS反映

  • 変数・JS操作・ファイル読込

ゲームの途中でCSSを読み込むことができます。

解説チュートリアル

パラメータ必須解説初期値
file読み込むCSSファイルのパスを指定します。パスはdata/から記述します。
  • サンプルコード
;CSSファイルの読み込み
[loadcss file="./data/others/css/mystyle.css" ]

[playbgm] BGMの再生

  • オーディオ

BGMを再生します。再生する音声ファイルはdata/bgmフォルダに配置します。

mp3形式推奨oggm4awav形式にも対応します。

ただし、ogg形式は一部のブラウザにおいて動作しません(IE、Safari)。ogg形式を使う場合、IEとSafariにも対応させるためには、同じフォルダに同名のm4aファイルを用意してください。そうした場合、IEやSafariでは自動でm4a形式のファイルが選択されるようになります。(ブラウザゲームとして公開しない場合は不要)

パラメータ必須解説初期値
storage再生する音楽ファイルを指定します。
loopループするかどうか。trueまたはfalseで指定します。true
sprite_time再生する区間を指定できます。開始時刻と終了時刻をハイフン繋ぎでミリ秒単位で指定します。たとえば6000-10000と指定すると00:06~00:10の4秒間を再生します。loop属性がtrueの場合、この間をループ再生します。
V515以降:00:06-00:10のような分:秒区切りでも指定できるようになりました。必ず:を含めてください。
volume再生する音量を指定できます。0100の範囲で指定して下さい。
html5通常は指定しなくてOKです。HTML5 Audioを使う場合はtrue、Web Audio APIを使う場合はfalse(デフォルト)で指定します。false
restartこの[playbgm]で再生しようとしたBGMがすでに再生されていた場合の処理を設定できます。trueなら最初から再生し直し、falseなら無視となります。
  • サンプルコード
[playbgm storage=music.mp3]

[stopbgm] BGMの停止

  • オーディオ

再生しているBGMの再生を停止します。

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
[stopbgm]

[fadeinbgm] BGMをフェードイン再生

  • オーディオ

BGMを徐々に再生します。

一部環境(Firefox、Sarafi等)においては対応していません。その場合、[playbgm]の動作となります。

パラメータ必須解説初期値
storage再生する音楽ファイルを指定します。
loopループするかどうか。trueまたはfalseで指定します。true
sprite_time再生する区間を指定できます。開始時刻と終了時刻をハイフン繋ぎでミリ秒単位で指定します。たとえば6000-10000と指定すると00:06~00:10の4秒間を再生します。loop属性がtrueの場合、この間をループ再生します。
V515以降:00:06-00:10のような分:秒区切りでも指定できるようになりました。必ず:を含めてください。
timeフェードイン時間をミリ秒で指定します。2000
volume再生する音量を指定できます。0100の範囲で指定して下さい。
html5通常は指定しなくてOKです。HTML5 Audioを使う場合はtrue、Web Audio APIを使う場合はfalse(デフォルト)で指定します。false
  • サンプルコード
[fadeinbgm storage=sample.mp3 loop=false time=3000]

[fadeoutbgm] BGMをフェードアウト停止

  • オーディオ

再生中のBGMをフェードアウトしながら停止します。

一部環境(Firefox、Sarafi等)においては対応していません。その場合、[stopbgm]の動作となります。

パラメータ必須解説初期値
timeフェードアウト時間をミリ秒で指定します。2000
  • サンプルコード
[fadeoutbgm time=3000]

[xchgbgm] BGMのクロスフェード(入れ替え)

  • オーディオ

【非推奨】BGMを入れ替えます。音楽が交差して切り替わる演出に使用できます。

一部環境(Firefox、Safari等)において対応していません。その場合、[playbgm]の動作となります。

V515以降:非推奨の機能となっていましたが、使えるようになりました。

パラメータ必須解説初期値
storage次に再生するファイルを指定します。
loopループするかどうか。trueまたはfalseで指定します。true
timeクロスフェードを行なっている時間をミリ秒で指定します。2000
  • サンプルコード
[xchgbgm storage=new.mp3 loop=true time=3000]

[playse] 効果音の再生

  • オーディオ

BGMを再生します。再生する音声ファイルはdata/soundフォルダに配置します。

mp3形式推奨oggm4awav形式にも対応します。

ただし、ogg形式は一部のブラウザにおいて動作しません(IE、Safari)。ogg形式を使う場合、IEとSafariにも対応させるためには、同じフォルダに同名のm4aファイルを用意してください。そうした場合、IEやSafariでは自動でm4a形式のファイルが選択されるようになります。(ブラウザゲームとして公開しない場合は不要)

パラメータ必須解説初期値
storage再生する音楽ファイルを指定します。
buf効果音を再生するスロットを指定できます。すでに指定スロットで再生中の効果音がある場合、その効果音は停止されます。0
loopループするかどうか。trueまたはfalseで指定します。false
sprite_time再生する区間を指定できます。開始時刻と終了時刻をハイフン繋ぎでミリ秒単位で指定します。たとえば6000-10000と指定すると00:06~00:10の4秒間を再生します。loop属性がtrueの場合、この間をループ再生します。
V515以降:00:06-00:10のような分:秒区切りでも指定できるようになりました。必ず:を含めてください。
cleartrueまたはfalsetrueを指定すると、他のスロットで再生中の効果音がある場合、そちらもすべて停止します。音声などはtrueが便利でしょう。false
volume再生する音量を指定できます。0100の範囲で指定して下さい。
html5通常は指定しなくてOKです。HTML5 Audioを使う場合はtrue、Web Audio APIを使う場合はfalse(デフォルト)で指定します。false
  • サンプルコード
[playse storage=sound.mp3 loop=false ]

[stopse] 効果音の停止

  • オーディオ

効果音を再生を停止します。

パラメータ必須解説初期値
buf効果音を停止するスロットを指定できます。0
  • サンプルコード
[stopse]

[fadeinse] 効果音のフェードイン

  • オーディオ

効果音をフェードインしながら再生します。

パラメータ必須解説初期値
storage再生する音楽ファイルを指定します。
loopループするかどうか。trueまたはfalseで指定します。false
sprite_time再生する区間を指定できます。開始時刻と終了時刻をハイフン繋ぎでミリ秒単位で指定します。たとえば6000-10000と指定すると00:06~00:10の4秒間を再生します。loop属性がtrueの場合、この間をループ再生します。
V515以降:00:06-00:10のような分:秒区切りでも指定できるようになりました。必ず:を含めてください。
buf効果音を停止するスロットを指定できます。0
timeフェードイン時間をミリ秒で指定します。2000
html5通常は指定しなくてOKです。HTML5 Audioを使う場合はtrue、Web Audio APIを使う場合はfalse(デフォルト)で指定します。false
  • サンプルコード
[fadeinse storage=sound.mp3 loop=false time=2000]

[fadeoutse] 効果音のフェードアウト

  • オーディオ

効果音をフェードアウトします。

パラメータ必須解説初期値
timeフェードアウト時間をミリ秒で指定します。
buf効果音を停止するスロットを指定できます。0
  • サンプルコード
[fadeoutse time=2000]

[bgmopt] BGM設定

  • オーディオ

BGMの設定を変更できます。

プレイヤーがスマホブラウザから閲覧している場合は端末の制限により音量が変更できませんので注意してください。

bufパラメータが指定されていない[bgmopt]タグ」を通過した時点で、bufごとの音量設定が初期化される仕様です。[bgmopt]bufを指定するかしないかは、ゲームプロジェクトで統一するようにしましょう。

パラメータ必須解説初期値
volumeBGMのコンフィグ音量を0100で指定できます。
buf設定を変更するスロットを指定できます。省略すると、全スロット共通の音量が設定されます。
effectコンフィグ音量の変更を現在再生中のBGMに即反映するかどうか。trueまたはfalseで指定します。true
time音量の変更を即反映する場合のフェード時間をミリ秒単位で指定できます。
tag_volume0100を指定して、現在再生中のBGMのタグ音量を変更できます。タグ音量とは[playbgm]タグに指定されていた音量のことです。この機能はたとえば、もともと[playbgm volume="50"]で再生され始めたBGMの音量を、[playbgm volume="100"]で再生されていた場合の音量に修正したい、というケースで使用可能です。これを指定しただけではコンフィグ音量は変更されません。これを指定すると、effectが強制的にtrueになります。
samebgm_restart[playbgm]タグで再生しようとしたBGMがすでに再生中だった場合の処理を設定できます。trueなら最初から再生し直し、falseならスルー。
  • サンプルコード
[bgmopt volume=50 ]

[seopt] SE設定

  • オーディオ

SEの設定を変更できます。

プレイヤーがスマホブラウザから閲覧している場合は端末の制限により音量が変更できませんので注意してください。

bufパラメータが指定されていない[seopt]タグ」を通過した時点で、bufごとの音量設定が初期化される仕様です。[seopt]bufを指定するかしないかは、ゲームプロジェクトで統一するようにしましょう。

パラメータ必須解説初期値
volumeSEのコンフィグ音量を0100で指定できます。
buf設定を変更するスロットを指定できます。省略すると、全スロット共通の音量が設定されます。
effectコンフィグ音量の変更を現在再生中のSEに即反映するかどうか。trueまたはfalseで指定します。true
time音量の変更を即反映する場合のフェード時間をミリ秒単位で指定できます。
tag_volume0100を指定して、現在再生中のSEのタグ音量を変更できます。タグ音量とは[playse]タグに指定されていた音量のことです。この機能はたとえば、もともと[playse volume="50"]で再生され始めたSEの音量を、[playse volume="100"]で再生されていた場合の音量に修正したい、というケースで使用可能です。これを指定しただけではコンフィグ音量は変更されません。これを指定すると、effectが強制的にtrueになります。
  • サンプルコード
[seopt volume=50 ]

[changevol] 再生中のオーディオの音量変更

  • オーディオ

現在再生中のオーディオの音量を変更できます。

[playbgm][playse]などでオーディオを再生し始めるときと同様に、次の計算式で最終的な音量が決定されます。

[changevol]に指定した音量(%) × [bgmopt][seopt]で設定したコンフィグ音量(%)

プレイヤーがスマホブラウザから閲覧している場合は端末の制限により音量が変更できませんので注意してください。

パラメータ必須解説初期値
targetBGMの音量を変更する場合は"bgm"、SEの音量を変更する場合は"se"と指定します。bgm
volume音量を0100で指定します。
buf設定を変更するスロットを指定できます。省略すると、全スロットの音声に対して処理が実行されます。
timeフェード時間をミリ秒単位で指定できます。
  • サンプルコード
[bgmopt volume="30"]Config: 30[l][r]
[playbgm volume="40" storage="music.ogg"]Audio: 40[l][r]
[changevol volume="100"]Audio: 40→100[l][r]
[changevol volume="15" time="1000"]Audio: 100→15[l][r]
[bgmopt volume="100" effect="true"]Config: 30→100[l][r]
[changevol volume="100"]Audio: 15→100[l][r]

[pausebgm] 再生中のBGMの一時停止

  • オーディオ

現在再生中のBGMを一時停止できます。

パラメータ必須解説初期値
bufスロットを指定できます。省略すると、全スロットの音声に対して処理が実行されます。

[resumebgm] 一時停止中のオーディオの再開

  • オーディオ

一時停止中のオーディオを再開できます。

パラメータ必須解説初期値
bufスロットを指定できます。省略すると、全スロットの音声に対して処理が実行されます。

[pausese] 再生中のSEの一時停止

  • オーディオ

現在再生中のSEを一時停止できます。

パラメータ必須解説初期値
bufスロットを指定できます。省略すると、全スロットの音声に対して処理が実行されます。

[resumese] 一時停止中のSEの再開

  • オーディオ

一時停止中のSEを再開できます。

パラメータ必須解説初期値
bufスロットを指定できます。省略すると、全スロットの音声に対して処理が実行されます。

[wbgm] BGMの再生完了を待つ

  • オーディオ

BGMの再生完了を待ちます。

PCアプリ、ブラウザゲームで利用できます。
スマホアプリでは利用できませんので注意してください。

[playbgm]でループ再生している場合は永遠に止まります。こちらも要注意。

パラメータ必須解説初期値
指定できるパラメータはありません。

[wse] 効果音の再生完了を待つ

  • オーディオ

効果音の再生完了を待ちます。

PCアプリ、ブラウザゲームで利用できます。
スマホアプリでは利用できませんので注意してください。

パラメータ必須解説初期値
指定できるパラメータはありません。

[voconfig] ボイスの再生設定

  • ボイス・読み上げ

ボイスを効率的に再生するための設定ができます。

キャラクター名と音声ファイル名を関連させておくことで、キャラ名表示のタイミングで音声ファイルを順番に再生させることができます。

このタグで設定をした後、[vostart]タグで自動再生を開始しないと有効になりません。

解説チュートリアル

パラメータ必須解説初期値
sebufボイスで使用する[playse]bufを指定します。0
nameボイスを再生するキャラクター名を指定します。[chara_new]タグのname
vostorage音声ファイルとして使用するファイル名のテンプレートを指定します。{number}の部分には、再生されることに+1された数値が入っていきます。
numbervostorage{number}に当てはめる数値の初期値。
waittimeオートモードにおいて、ボイスを再生し終わってから次のメッセージに進むまでに何ミリ秒待つか。
  • サンプルコード
[voconfig sebuf=2 name="akane" vostorage="akane_{number}.ogg" number=1 ]
[voconfig sebuf=2 name="yamato" vostorage="yamato_{number}.ogg" number=1 ]

;音声自動再生を開始する。必ず必要です。
[vostart]

#akane
ここで音声再生(akane_1.ogg)[p]

#akane
次の音声再生(akane_2.ogg)[p]

#yamato
やまとの音声再生(yamato_1.ogg)[p]

#akane
あかねの音声再生(akane_3.ogg)[p]

[vostart] ボイス自動再生開始

  • ボイス・読み上げ

[voconfig]で指定したボイスの自動再生を開始します。
これ以降、#で名前を指定したときに紐付いたボイスが再生されていきます。

解説チュートリアル

パラメータ必須解説初期値
指定できるパラメータはありません。

[vostop] ボイス自動再生停止

  • ボイス・読み上げ

[voconfig]で指定したボイスの自動再生を停止します。
これ以降、#で名前を指定してもボイスは再生されません。

パラメータ必須解説初期値
指定できるパラメータはありません。

[speak_on] 読み上げ機能の有効化

  • ボイス・読み上げ

ストーリーのシナリオを音声で読み上げることができます。

★注意
ブラウザゲームのみ動作。PCアプリとして出力した場合には動作しません。

パラメータ必須解説初期値
volume音量を0100で指定します。100
pitch声の高さを100を基準とする比率で指定します。指定した数値が大きいほど声が高くなります。100
rate声の速度を100を基準とする比率で指定します。指定した数値が大きいほど早口になります。100
cancelテキスト読み上げ中に次のテキスト読み上げが差し込まれた場合の動作を指定できます。trueを指定すると読み上げを中断して新しいテキストを読み上げます。falseを指定すると中断は行わず、読み上げが完了次第次のテキストを読み上げるようになります。false
  • サンプルコード
[speak_on]

[speak_off] 読み上げ機能の無効化

  • ボイス・読み上げ

シナリオの読み上げをオフにします。

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
[speak_off]

[edit] テキストボックス

  • 入力フォーム

プレイヤーが入力可能なテキストボックスを表示します。

テキストボックス表示中はシナリオの進行が止まります。必ずグラフィックボタンなどを配置してジャンプできるようにしてください。

入力されたテキストは[commit]タグが実行されるタイミングで指定された変数に格納されます。[commit]タグが実行される時点でテキストボックスがまだ表示されている必要があります。[glink]と組み合わせる場合、[glink]タグにcm=falseを指定してください。

★高度
テキストボックスのデザインはtyrano/tyrano.cssを編集することで調整可能です。

解説チュートリアル

パラメータ必須解説初期値
nameプレイヤーの入力テキストを保存する変数名を指定してください。
initialテキストボックスの初期値を設定できます。
color文字の色を指定します。black
leftテキストボックスの横位置を指定します。0
topテキストボックスの縦位置を指定します。0
autocomplete入力の履歴を表示するかどうか。trueまたはfalseで指定します。false
size文字のサイズを指定します。20
widthテキストボックスの横幅を指定します。200
heightテキストボックスの高さを指定します。40
maxchars最大入力文字数を指定します。1000
  • サンプルコード
この子の名前を決めなければ…[l]

[edit name="f.dog_name" left=50 top=100]
[glink text="決定" target=next x=250 y=100 cm=false]
[s]

*next
[commit name="f.dog_name"]
[cm]
この子の名前は「[emb exp=f.dog_name]」だ![r]
やあ[emb exp=f.dog_name]!一緒に遊ぼう![s]

[commit] フォームの確定

  • 入力フォーム

[edit]で表示したテキストボックスの入力内容を確定し、name属性で指定した変数に値をセットします。

★注意
[commit]が実行されるタイミングで、まだテキストボックスが表示されている必要があります。

解説チュートリアル

パラメータ必須解説初期値
指定できるパラメータはありません。

[3d_init] 3D機能の初期化

  • 3D関連

3D関連の機能を使用するために必要な宣言です。
このタグを通過するとき、ゲーム内に3Dを表示するための初期化が行われます。
このタグを通過するまで[3d_...]で始まるタグは使えません。

3D機能を使用する直前に宣言し、3D機能の仕様が終わった段階で[3d_close]を行いましょう。

パラメータ必須解説初期値
layer3Dモデルを配置するレイヤを指定できます。0
cameraカメラのモードを指定できます。Perspective(遠近感あり)、Orthographic(遠近感なしの平行投影)Perspective
nearカメラに近いオブジェクトをどの距離まで描画するかを設定できます。1
farカメラから遠いオブジェクトを表示する距離を設定できます。大きすぎると不必要に遠くまで描画するため処理が重くなります。可能な限り小さい値に調整しましょう。5000
  • サンプルコード
[3d_init layer=0]

[3d_model_new] 3Dモデルの作成

  • 3D関連

外部ファイルの3Dモデルを読み込んで定義します。
このタグを実行しただけでは、3Dモデルはまだゲーム画面に表示されません。表示するには[3d_show]が必要です。
3Dモデルファイルはdata/others/3d/modelフォルダに配置します。

パラメータ必須解説初期値
name3Dオブジェクトの名前です。この名前をつかって表示・非表示などを制御します。
storage3Dモデルのファイルを指定します。対応している形式はgltfobjです。ファイルはdataothers/3d/modelフォルダに配置します。
pos3Dオブジェクトを配置する座標を指定します。xyz座標をそれぞれ半角カンマ区切りでまとめて指定します。0
rot3Dオブジェクトの回転を指定します。xyz軸の回転をそれぞれ半角カンマ区切りでまとめて指定します。0
scale3Dオブジェクトの拡大率を指定します。xyz軸の拡大率をそれぞれ半角カンマで区切ってまとめて指定します。100
tonemapトーンマッピングが有効な場合、このオブジェクトが影響を受けるかどうか。デフォルトはtrue。無効にする場合はfalseを指定します。true
motion3Dモデルにモーションが存在する場合、モーション名を指定できます。指定がない場合はひとつめのモーションファイルが自動的に適応されます。
folderファイルの配置フォルダを変更できます。たとえばfgimageと指定すると、data/fgimageフォルダにある3Dモデルファイルを探します。
  • サンプルコード
[3d_init layer=0]

[3d_model_new name="mymodel" storage="mymodel/scene.gltf" ]
[3d_show name="mymodel" pos="100,20,20" rot="1,1,1" scale=10 ]

[3d_sphere_new] 3Dモデル(球体)

  • 3D関連

球体の3Dモデルを定義します。

パラメータ必須解説初期値
name3Dオブジェクトの名前です。この名前をつかって表示・非表示などを制御します。
texture球体にテクスチャを貼ることができます。画像はdata/others/3d/texture以下に配置します。画像サイズは256x256512x512が推奨されます。
color球体の色を0xRRGGBB形式で指定します。0x00ff00
pos3Dオブジェクトを配置する座標を指定します。xyz座標をそれぞれ半角カンマ区切りでまとめて指定します。0
rot3Dオブジェクトの回転を指定します。xyz軸の回転をそれぞれ半角カンマ区切りでまとめて指定します。0
scale3Dオブジェクトの拡大率を指定します。xyz軸の拡大率をそれぞれ半角カンマで区切ってまとめて指定します。1
radius球体の半径を指定します。300
width球体の横幅を指定します。30
height球体の高さを指定します。30
tonemapトーンマッピングが有効な場合、このオブジェクトが影響を受けるかどうか。デフォルトはtrue。無効にする場合はfalseを指定します。
  • サンプルコード
[3d_sphere_new name="tama"]
[3d_show name=tama pos="365,145,0" rot="0.92,-4.3,0" scale="0.77,0.77,0.77" time=2000]

[3d_sprite_new] 3Dモデル(スプライト)

  • 3D関連

スプライトの3Dモデルを定義します。
イメージとの違いはスプライトの場合、オブジェクトが常にカメラの方を向きます。

パラメータ必須解説初期値
name3Dオブジェクトの名前です。この名前をつかって表示・非表示などの制御を行います。
storage表示する画像ファイルを指定します。ファイルは「others/3d/sprite」フォルダ以下に配置してください。
pos3Dオブジェクトを配置する座標を指定します。xyz座標をそれぞれ半角カンマ区切りでまとめて指定します。0
rot3Dオブジェクトの回転を指定します。xyz軸の回転をそれぞれ半角カンマ区切りでまとめて指定します。0
scale3Dオブジェクトの拡大率を指定します。xyz軸の拡大率をそれぞれ半角カンマで区切ってまとめて指定します。
tonemapトーンマッピングが有効な場合、このオブジェクトが影響を受けるかどうか。デフォルトはtrue。無効にする場合はfalseを指定します。false
folderファイルの配置フォルダを変更できます。たとえばfgimageと指定すると、data/fgimageフォルダにある3Dモデルファイルを探します。
  • サンプルコード
[3d_sprite_new name="yamato" storage="doki.png"]
[3d_show name="yamato"]

[3d_event] 3Dイベント定義

  • 3D関連

3Dオブジェクトがクリックされたときにイベントを発火(シナリオをジャンプ)させることができます。イベントは[s]タグに到達していないと発火しません。

一度イベントが発火すると、次に[3d_event_start]タグを通過するまでイベントが発火しなくなります。イベントを何度も発火させる必要がある場合、ジャンプ先に[3d_event_start]を配置してください。

パラメータ必須解説初期値
name3Dオブジェクトの名前です。イベントを発生させる3Dオブジェクトのnameを指定します。
storageジャンプ先のシナリオファイル名を指定します。省略すると、現在のシナリオファイルとみなされます。
targetジャンプ先のラベル名を指定します。省略すると、シナリオファイルの先頭にジャンプします。
  • サンプルコード
;3Dモデルの定義と表示
[3d_model_new name="miruku" storage="miruku/scene.gltf" scale=300 pos="0,-300,500" ]
[3d_event name="miruku" target="miruku"]

;ボックスの表示
[3d_box_new name="box" width=100 height=100 depth=100 scale=2 tone=false color="0xFFFFFF"]
[3d_show name="box" time=2000 ]

;イベントの定義
[3d_event name="miruku" target="miruku_click"]
[3d_event name="box" target="box_click"]

[s]

*miruku_click
3Dモデルがクリックされた[p]

@jump target="common"

*box_click
ボックスがクリックされた[p]

*common

イベントを再開する[p]
@3d_event_start

[3d_event_delete] 3Dイベントの削除

  • 3D関連

登録した3Dイベントを無効化します。

パラメータ必須解説初期値
name3Dオブジェクトの名前です。イベントを削除する3Dオブジェクトのnameを指定します。
  • サンプルコード
;ボックスの表示
[3d_box_new name="box" width=100 height=100 depth=100 scale=2 tone=false color="0xFFFFFF"]
[3d_show name="box" time=2000 ]

;イベントの定義の削除。これ移行はクリックしても反応しなくなります。
[3d_event_delete name="box" ]

[s]

[3d_event_start] 3Dイベントの開始

  • 3D関連

登録した3Dイベントを開始します。
イベントが一度実行された後は全イベントが無効化されるため、受付を再開したい場合はこのタグを配置する必要があります。

パラメータ必須解説初期値
指定できるパラメータはありません。

[3d_event_stop] 3Dイベントの停止

  • 3D関連

登録した3Dイベントを一時的に停止します。

登録したイベント自体は消えません。[3d_event_start]タグでいつでも再開できます。

パラメータ必須解説初期値
指定できるパラメータはありません。

[3d_box_new] 3Dモデル(ボックス)

  • 3D関連

立方体の3Dモデルを定義します。

パラメータ必須解説初期値
name3Dオブジェクトの名前です。この名前をつかって表示・非表示を制御します。
texture表示する画像ファイルを指定します。ファイルはdata/others/3d/textureフォルダ以下に配置してください。1つのテクスチャの場合はすべての面が同じ画像になりますが、半角カンマで区切って6つ指定するとすべての面に異なるテクスチャを適応することもできます
color色を指定できます。0xRRGGBB 形式で指定します。0x00ff00
width3Dオブジェクトの横幅を指定します。デフォルトは1です1
height3Dオブジェクトの高さを指定します。デフォルトは1です1
depth3Dオブジェクトの深さを指定します。デフォルトは1です1
pos3Dオブジェクトを配置する座標を指定します。xyz座標をそれぞれ半角カンマ区切りでまとめて指定します。0
rot3Dオブジェクトの回転を指定します。xyz軸の回転をそれぞれ半角カンマ区切りでまとめて指定します。0
scale3Dオブジェクトの拡大率を指定します。xyz軸の拡大率をそれぞれ半角カンマで区切ってまとめて指定します。1
tonemapトーンマッピングが有効な場合、このオブジェクトが影響を受けるかどうか。デフォルトはtrue。無効にする場合はfalseを指定します。
  • サンプルコード
;ボックスの定義と表示
[3d_box_new name="mybox1" ]
[3d_show name="mybox1" pos="365,145,0" rot="0.92,-4.3,0" scale="0.77,0.77,0.77" time=2000]

;テクスチャの6面に異なる画像を使う場合の例
[3d_box_new name="mybox2" width=100 height=100 depth=100 texture="dice/1.png,dice/2.png,dice/3.png,dice/4.png,dice/5.png,dice/6.png" ]
[3d_show name="mybox2" time=2000 ]

[3d_image_new] 3Dモデル(イメージ)

  • 3D関連

イメージの3Dモデルを定義します。
平面の板が3Dシーンに追加されるイメージです。

パラメータ必須解説初期値
name3Dオブジェクトの名前です。この名前をつかって表示・非表示などの制御を行います。
texture表示する画像ファイルを指定します。ファイルは「others/3d/texture」フォルダ以下に配置してください。
width3Dオブジェクトの横幅を指定します。デフォルトは1です
height3Dオブジェクトの高さを指定します。省略した場合は画像サイズの比率を保った形で表示できます。
pos3Dオブジェクトを配置する座標を指定します。xyz座標をそれぞれ半角カンマ区切りでまとめて指定します。0
rot3Dオブジェクトの回転を指定します。xyz軸の回転をそれぞれ半角カンマ区切りでまとめて指定します。0
scale3Dオブジェクトの拡大率を指定します。xyz軸の拡大率をそれぞれ半角カンマで区切ってまとめて指定します。1
tonemapトーンマッピングが有効な場合、このオブジェクトが影響を受けるかどうか。デフォルトはtrue。無効にする場合はfalseを指定します。false
doublesideテクスチャを両面に表示させるかを指定します。デフォルトはfalse。trueを指定すると裏面にもテクスチャが表示されます。false
  • サンプルコード
;3Dイメージ
[3d_image_new name="myimg" texture="room.jpg" width=200 doubleside=true ]
[3d_show name="myimg" ]

[3d_show] 3Dオブジェクト表示

  • 3D関連

定義した3Dオブジェクトを実際にゲーム画面に登場させます。

パラメータ必須解説初期値
name3Dオブジェクトの名前です。表示させたいオブジェクトのnameを指定します
time表示させるまでの時間をミリ秒で指定します。500
wait表示の完了を待つか否か。true
pos3Dオブジェクトを配置する座標を指定します。xyz座標をそれぞれ半角カンマ区切りでまとめて指定します。
rot3Dオブジェクトの回転を指定します。xyz軸の回転をそれぞれ半角カンマ区切りでまとめて指定します。
scale3Dオブジェクトの拡大率を指定します。xyz軸の拡大率をそれぞれ半角カンマで区切ってまとめて指定します。
  • サンプルコード
;3Dイメージ
[3d_image_new name="myimg" texture="room.jpg" width=200 doubleside=true ]
[3d_show name="myimg" ]

[3d_hide] 3Dオブジェクト非表示

  • 3D関連

3Dオブジェクトをゲーム画面から退場させます。
このタグを実行しても定義自体は削除されません。
もう一度表示させるには[3d_show]タグを使います。

パラメータ必須解説初期値
name退場させるオブジェクトのnameを指定します。
time退場させるまでの時間をミリ秒で指定します。500
wait退場の完了を待つかどうか。trueまたはfalseで指定します。true
  • サンプルコード
;3Dイメージ
[3d_image_new name="myimg" texture="room.jpg" width=200 doubleside=true]
[3d_show name="myimg"]

非表示にします。[p]
[3d_hide name="myimg"]

[3d_hide_all] 3Dオブジェクト全非表示

  • 3D関連

すべての3Dオブジェクトをゲーム画面から退場させます。
このタグを実行しても定義自体は削除されません。
もう一度表示する場合は[3d_show]タグを使ってください。

パラメータ必須解説初期値
time退場させるまでの時間をミリ秒で指定します。500
wait退場の完了を待つかどうか。trueまたはfalseで指定しますtrue

[3d_delete] 3Dオブジェクトの定義の削除

  • 3D関連

3Dオブジェクトの定義を削除します。
このタグは[3d_hide]とは異なり3Dモデルの定義自体を削除するので、モデルを再度使用するには[3d_model_new]タグを使う必要があります。
使用しなくなった3Dオブジェクトの定義をこまめに削除しておくことで軽量な動作が期待できます。

パラメータ必須解説初期値
name削除したい3Dオブジェクトのnameを指定します。
  • サンプルコード
;3Dイメージ
[3d_image_new name="myimg" texture="room.jpg" width=200 doubleside=true]
[3d_show name="myimg"]

非表示にします。[p]
[3d_hide name="myimg"]

定義からも削除[p]
[3d_delete name="myimg"]

[3d_delete_all] 3Dオブジェクト全削除

  • 3D関連

3Dオブジェクトをすべて削除します。
3Dシーンをリセットするときに利用します。

パラメータ必須解説初期値
指定できるパラメータはありません。

[3d_canvas_show] 3Dキャンバス表示

  • 3D関連

3Dキャンバスを表示状態にします。
対になる[3d_canvas_hide]タグと組み合わせて使います。
3Dシーンとノベルパートを頻繁に行き来する場合に活用できます。

パラメータ必須解説初期値
time表示にかける時間をミリ秒で指定できます。1000

[3d_canvas_hide] 3Dキャンバス非表示

  • 3D関連

3Dキャンバスを非表示にします。
3Dシーン自体は維持されます。
3Dシーンとノベルパートを頻繁に行き来する場合に活用できます。

パラメータ必須解説初期値
指定できるパラメータはありません。
  • サンプルコード
time=表示にかける時間をミリ秒で指定できます。デフォルトは1000です。

[3d_close] 3Dシーン削除

  • 3D関連

3Dシーンをすべて削除します。
このタグを使用すると3D系の機能は全て使えなくなります。
もう一度3D系の機能を使用するには[3d_init]タグを使用してください。

パラメータ必須解説初期値
指定できるパラメータはありません。

[3d_anim] 3Dアニメーション

  • 3D関連

シーン上の3Dオブジェクトをアニメーションさせます。

パラメータ必須解説初期値
nameアニメーション対象の3Dオブジェクトのnameを指定します。ただしcameraを指定した場合はカメラをアニメーションさせる動作となります。
posアニメーション後の座標を指定します。xyz座標をそれぞれ半角カンマ区切りでまとめて指定します。
rotアニメーション後の回転を指定します。xyz軸の回転をそれぞれ半角カンマ区切りでまとめて指定します。
scaleアニメーション後の拡大率を指定します。xyz軸の拡大率をそれぞれ半角カンマで区切ってまとめて指定します。
timeアニメーションにかける時間をミリ秒で指定します。1000
waitアニメーションの完了を待つかどうかをtrueまたはfalseで指定します。true
lookatnamecameraのときだけ有効。オブジェクトのnamepos座標を指定することで、カメラを特定の方向に向けられます。
effect変化のエフェクトを指定します。以下のキーワードが指定できます。
jswingdefeaseInQuadeaseOutQuadeaseInOutQuadeaseInCubiceaseOutCubiceaseInOutCubiceaseInQuarteaseOutQuarteaseInOutQuarteaseInQuinteaseOutQuinteaseInOutQuinteaseInSineeaseOutSineeaseInOutSineeaseInExpoeaseOutExpoeaseInOutExpoeaseInCirceaseOutCirceaseInOutCirceaseInElasticeaseOutElasticeaseInOutElasticeaseInBackeaseOutBackeaseInOutBackeaseInBounceeaseOutBounceeaseInOutBounce
linear
  • サンプルコード
[3d_model_new name="mymodel" storage="mymodel/scene.gltf" ]
[3d_anim name="miruku" pos="79,-458,727" scale="318.45,318.45,318.45" rot="0.13,-0.64,0" effect="easeInCubic" wait=true]

[3d_anim_stop] 3Dアニメ停止

  • 3D関連

3Dオブジェクトのアニメーションを停止できます。

パラメータ必須解説初期値
nameアニメーションを停止する3Dオブジェクトのnameを指定します。
finishtrueまたはfalseを指定します。trueを指定すると3Dオブジェクトが最終的にアニメーションする予定だった場所まで移動します。falseを指定するとその場で停止します。true

[3d_scene] 3Dシーン設定

  • 3D関連

3Dシーン全体に影響する設定を行うことができます。

パラメータ必須解説初期値
tonemapトーンマッピングをシーンに設定できます。以下のキーワードが指定できます。NoLinearReinhardUncharted2CineonACESFilmic
デフォルトはNo(トーンマッピングなし)
tonemap_valueトーンマッピングの強さを設定します。0.8
light_amb環境光の強さを指定します。デフォルトは10.5だと暗めに、2だとかなり明るくなります。
  • サンプルコード
[3d_scene light_amb="2" tonemap=""]

[3d_camera] 3Dカメラ

  • 3D関連

3Dシーンのカメラを設定できます。
カメラの座標を確認したい場合は[camera_debug]をつかって、座標や傾きをテストするのがおすすめです。

パラメータ必須解説初期値
posカメラの座標を指定します。xyz座標をそれぞれ半角カンマで区切って指定します。
rotカメラの回転を指定します。xyz軸の回転をそれぞれ半角カンマで区切って指定します。
lookatシーン上の3Dオブジェクトのnameを指定することで、そのオブジェクトの方にカメラを向けることができます。もしくはxyz座標を直接指定することで、その座標にカメラを向けることもできます。
  • サンプルコード
[3d_camera pos="10,20,30"]

[3d_gyro] 3Dジャイロ

  • 3D関連

ジャイロ(スマホの傾き)でカメラを制御できます。
PCゲームの場合はマウスの位置でジャイロを再現できます。

パラメータ必須解説初期値
max_xX軸方向の傾き上限を角度で指定します。30
max_yY軸方向の傾き上限を角度で指定します。30
modepositionまたはrotation。カメラの「座標」と「回転」のうちどちらをジャイロで制御するのかを指定できます。回転をジャイロで制御できるようするにはrotationを、座標をジャイロで制御できるようにするにはpositionを指定します。rotation
  • サンプルコード
[3d_gyro max_x="20" max_y="20" ]

[3d_gyro_stop] 3Dジャイロ停止

  • 3D関連

ジャイロの動きを停止します。
カメラの位置や回転をもとに戻したい場合、このタグの直後に[3d_camera]で指定する必要があります。
ジャイロを有効にするには再び[3d_gyro]タグを使用します。

パラメータ必須解説初期値
指定できるパラメータはありません。

[3d_debug_camera] 3Dカメラデバッグ

  • 3D関連

3Dシーンのカメラ座標をマウスでドラッグアンドドロップしながら調整できます。
デバッグを終了する場合は画面左上のボタンを押します。

★マウス操作
左クリック:カメラの回転rot
右クリック:カメラの位置pos
中央クリック:ポジションのz

パラメータ必須解説初期値
button_textデバッグ終了ボタンのテキストを自由に設定できます。カメラインスペクタを閉じる
menuデバッグのメニューを表示するかどうか。falseを指定すると終了ボタンのみになります。true
  • サンプルコード
[3d_debug_camera]

[3d_motion] モーション変更

  • 3D関連

3Dモデルのモーションを変更できます。

パラメータ必須解説初期値
name3Dオブジェクトのnameを指定します。
motionモーション名を指定します。
  • サンプルコード
;モデルの定義。最初はRunningというモーションで表示。
[3d_model_new name="Robot" storage="Robot.glb" pos="0,0,0" scale="2" motion="Running" ]
[3d_show name="Robot" rot="0.28,0.67,0" pos="-129,-24,910" scale="9.68" ]

モーションを変更します。[p]

[3d_motion name="Robot" motion="Punch"]

[3d_debug] 3Dデバッグ

  • 3D関連

3Dシーンのオブジェクトをマウスでドラッグアンドドロップしながら、調整できます。
デバッグを終了する場合は画面左上のボタンを押します。

★マウス操作
左クリック:カメラの回転rot
右クリック:カメラの位置pos
中央クリック:ポジションのz
スクロール:拡大縮小scale

パラメータ必須解説初期値
nameデバッグする3Dオブジェクトのnameを指定します。
button_textデバッグ終了ボタンのテキストを自由に設定できます。3Dインスペクタを閉じる
menuデバッグのメニューを表示するかどうか。falseを指定すると終了ボタンのみになります。true
overlaptrueまたはfalsetrueを指定すると、モデルが最前面に表示されます。モデルがメニューに隠れてしまう場合はここをtrueにしてください。false
resettrueまたはfalsetrueを指定すると、デバッグ終了後にモデルの状態がデバッグ前に戻ります。false
  • サンプルコード
[3d_model_new name="Robot" storage="Robot.glb" ]
[3d_show name="Robot" rot="0.28,0.67,0" pos="-129,-24,910" scale="9.68" ]

モーションを変更します。[p]

[3d_debug name="Robot" ]

[bgcamera] ストリームカメラ背景

  • AR関連

プレイヤーの使用デバイスのカメラをゲームから起動させて、カメラで撮影している映像をゲーム画面の背景として映すことができます。現実の風景や自分にキャラクターを重ねて記念撮影できるアプリが簡単につくれます。

ブラウザゲームとして公開する場合、httpではなくhttpsでアクセスできる場所にゲームを配置しなければなりません。

詳しい説明については次の公式実践テクニックページをご覧ください。
実戦テクニック - 拡張現実(AR)機能

★QRコードの動作補足

このタグによって、プレイヤーにQRコードをカメラで読み取ってもらい、そのQRに仕込まれた場所にシナリオをジャンプさせることもできます。この場合、[s]タグに到達しておく必要があります。それ以外の場合は反応しません。

QRコードは以下のように作ります。

① ジャンプ先のシナリオファイルとラベルを示す、tyrano:から始まる次のようなテキストを作成してください。たとえば、scene1.ksstartにジャンプさせたい場合はこのようになります。

tyrano://storage=scene1.ks&target=start

あるいは、タグのテキストそのままでもOKです。

[jump storage="scene1.ks" target="test2"]

② 上で作成したテキストをQRコードに変換します。(好きなテキストをQRコードに変換できるWebサイトが存在しますので、そちらをご利用ください)

③ QRコードを印刷します。

注意点として、QRコードに一度反応したあとは、次に[qr_config]タグが実行されるまでQRコードの読取機能が無効化されます。QRコードの読取によるジャンプを何度も行う必要がある場合、ジャンプ先に[qr_config qrcode="all"]を記述してください。

パラメータ必須解説初期値
name[anim]タグなどからこの名前でアニメーションさせられます。カンマで区切ることで複数指定できます。(高度な知識:name属性で指定した値はHTMLのクラス属性になります)
waittrueを指定するとカメラ入力の表示を待ちます。true
timeカメラ入力領域が表示されるフェードイン時間をミリ秒で指定します。1000
fit比率を崩しても全画面に配置するならtrue。比率を保持して配置するならfalse。カメラの解像度によっては黒塗りの部分ができる可能性があります。true
leftカメラを配置する位置を指定できます。(ピクセル)
topカメラを配置する位置を指定できます。(ピクセル)
widthカメラを配置するエリアの幅を指定します。(ピクセル)
heightカメラを配置するエリアの高さを指定します。(ピクセル)
modefront(前面カメラ)、back(背面カメラ)を指定します。何も指定しないと標準のカメラが選択されます。
qrcodeQRコードを読み込んだときの動作を設定できます。
jump(ゲーム内移動のQRのみ反応)
web(他サイトへのリンクだけ反応)
define([qr_define]で定義したものだけに反応)
all(すべてに反応)
off(QRコードに反応しない)
off
debugQRコードが読み込まれたときにURLを表示するか否かを指定できます。デフォルトはfalsetrueでURLをアラート表示できます。false
audio音声入力も反映するか否か。trueを指定すると音声もゲームに反映されます。false
  • サンプルコード
;背景にカメラの入力を表示
[bgcamera time=2000]

;背景を通常に戻す
[stop_bgcamera]

;座標を指定してカメラの入力を表示
[bgcamera width=300 height=200 left=100 top=100]

;QRコードに反応させる場合。背面カメラを指定
[bgcamera mode="back" fit=true qrcode="all"]

[qr_config] QRコードの動作設定

  • AR関連

QRコードの各種動作設定が可能です。

パラメータ必須解説初期値
qrcodeQRコードを読み込んだときの動作を設定できます。
jump(ゲーム内移動のQRのみ反応)
web(他サイトへのリンクだけ反応)
define([qr_define]で定義したものだけに反応)
all(すべてに反応)
off(QRコードに反応しない)
  • サンプルコード
;QRコードでティラノのジャップのみ有効にする
[qr_config qrcode="jump"]

[stop_bgcamera] カメラストリームの停止

  • AR関連

[bgcamera]を非表示にします。

パラメータ必須解説初期値
timeミリ秒で指定。動画をフェードアウトして削除することが可能です。1000
wait動画のフェードアウトを待つかどうかtrueまたはfalseを指定します。true
  • サンプルコード
[stop_bgcamera time=1000]

[qr_define] QRコードの置き換え

  • AR関連

QRコードの特定のURLを[jump]に置き換えることができます。
例えば、モニュメントや商品についているQRコードをゲーム内のイベントに置き換える事ができます。

パラメータ必須解説初期値
urlカメラを写したときに反応させるURLを定義します。
storageURLが読み込まれたときに発動するジャンプ先のシナリオファイルを指定します。
targetジャンプ先のラベルを指定します。
cleartrueを指定すると定義を削除できます。false
  • サンプルコード
[qr_define url="https://tyrano.jp" storage="scene1.ks" target="test" ]