TyranoScriptは、HTML5 を利用してマルチプラットフォームをサポートする AVG エンジンです。Google や Baidu でチュートリアルが見つからない場合、私はいくつかの基本的な使用法とカスタマイズ方法をまとめることにしました。
開発ツール#
ランチャー#
tyranoriderは完全に無料で、最も一般的に使用されるプロジェクトジェネレーター + ランチャーです。このチュートリアルでは、このツールを主に使用します。
tyranobuilderには無料版がありますが、完全な機能には有料が必要で、Steam にも登録されています。このツールは、プログラミング経験のない人に適したビジュアルエディターです。
エディター#
ビジュアルエディターを使用しない場合やプログラムのカスタマイズが必要な場合は、コードエディターが必要です。おすすめは VSCode または Sublime です(Sublime は使っていないのでわかりませんが、VSCode には.ks ファイルのシンタックスハイライトプラグインがあり、見やすくなります)。
プロジェクトの初期化#
初期化方法は 3 つあります。前述の tyranorider と tyranobuilder の両方で初期プロジェクトを生成できますが、公式の GitHub リポジトリをクローン(またはダウンロード)して初期プロジェクトを取得することもできます。私はこの方法をお勧めします。学習意義が最もあります。
なぜなら、GitHub リポジトリには CG ページと設定ページの例が含まれているのに対し、ジェネレータで生成されたものには含まれていないからです... ありません... ありません...
ファイル構造#
最初に生成された初期プロジェクトには、どのようなファイルが含まれているかを理解する必要があります。
まずは data フォルダに注目しましょう。tyrano フォルダについては、後のカスタマイズチュートリアルで説明します。
- bgimage:背景画像を配置します。
- bgm:BGM を配置します。
- fgimage:立ち絵(fg は figure の略です)を配置します。
- image:その他のボタンや素材画像を配置します。
- others:汎用素材を配置します(フォルダが見つからない場合はここに入れます)。
- scenario:重要なオブジェクトで、シナリオファイルを配置します。(奇妙なことに、一部のページも「シナリオ」として書かれています)
- sound:効果音ファイルを配置します。
- system:システム設定ファイルを配置します。
- video:ビデオファイルを配置します。
シナリオの構成#
シナリオは .ks
ファイルを指します。この種のファイルは、さまざまなタグで構成されます。
すべてのタグはこちら(英語版)またはこちら(日本語版)を参照してください。
.ks
ファイルは、プログラミングに詳しくないユーザーにとっては、基本的にはシナリオ入力に使用されます。以下はその例です:
*start
[wait time=200]
吾輩わがはいは猫である。名前はまだ無い。[l][r]
どこで生れたかとんと見当けんとうがつかぬ。[l][cm]
何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。[l]
吾輩はここで始めて人間というものを見た。[l][r]
ただし、タイトルページ、CG ページ、設定ページは公式の例では .ks
ファイルで書かれていますが、HTML ファイルではなく... そのため、このようなプログラミングの方法にはあまり慣れていません(もちろん、カスタマイズ後はこれらのページを HTML で書くこともできますが、混乱する可能性があります... 実験がいくつか混在しているため、どこに何を書いたかを忘れることがあります 😂)。以下は cg.ks の一部のコードです:
;=========================================
; CG モード 画面作成
;=========================================
@layopt layer=message0 visible=false
@clearfix
[hidemenubutton]
[cm]
[bg storage="../../tyrano/images/system/bg_base.png" time=100]
[layopt layer=1 visible=true]
[image layer=1 left=0 top=0 storage="config/label_cg.png" folder="image" ]
[iscript]
tf.page = 0;
tf.selected_cg_image = ""; //選択されたCGを一時的に保管
[endscript]
*cgpage
[layopt layer=1 visible=true]
[cm]
[button graphic="config/menu_button_close.png" enterimg="config/menu_button_close2.png" target="*backtitle" x=820 y=20 ]
[iscript]
tf.tmp_index = 0;
tf.cg_index = 12 * tf.page;
tf.top = 100;
tf.left = 60;
[endscript]
[iscript]
tf.target_page = "page_"+tf.page;
[endscript]
*cgview
@jump target=&tf.target_page
この方法は、タグと JavaScript の機能を交互に使用し、ボタンと*
タグを使用してジャンプを実現しています。
次回予告#
まずはレイヤーに関連する基本を書くことを考えています。これにより、いくつかのタグの説明がより簡単になります〜