システム面をカスタマイズ-使い方＆チュートリアル- ティラノスクリプト

システム周りをカスタマイズしよう

ティラノスクリプトは標準でセーブ画面やロード画面といったシステム周りの機能が標準で付属してきます。

かなりの自由度でシステム周りの画面をカスタマイズすることができます。

また、ゲーム全体の設定はsystem/Config.tjs　に集中しています。
このファイルの中には詳しい解説も書かれているので、確認してみましょう。

重要度の高いConfit.tjsの項目

ティラノスクリプトのゲーム全体に影響する設定は

[プロジェクトフォルダ]/data/system/Config.tjs

を編集して設定します。

このファイル自体に詳しい解説が書いてありますので、参考にしながら作成してください。

特に重要な項目としては以下の様な設定がConfig.tjsで行えます

・タイトルの設定（ブラウザやアプリのウィンドウに表示される）
・projectID （同一ホストから複数ゲームを配信する場合、ここを一意にする必要があります）
・ScreenRatio ゲーム画面を画面サイズに合わせて拡大するか、比率を保つかといった、画面調整に関する設定をおこないます
・scWidth scHeight （画面サイズを設定します）
・メニュー機能の表示や位置指定
・バックログの最大ログ保持行数
・通過記録の設定
・デバック機能の有効化。リリース時は必ずオフにする設定を行わなければなりません。
・禁則処理の設定
などなど

メニュー画面表示ボタンのカスタマイズ

ティラノスクリプトではセーブ・ロード機能などを備えたボタンが画面の右下に表示されるようになっています。

セーブ・ロード機能など、ノベルゲームに必要な機能が備わっているのでかなり役に立つでしょう。

ティラノスクリプトでは、メニューボタンの表示位置や画像の変更から、独自のボタンからセーブ・ロード機能を呼び出すところまで変更することが可能です。

■メニューボタン表示の画像を変更する

メニュー画面を呼び出すための画像は、自由に変更することができます


プロジェクトフォルダ/tyrano/images/system/button_menu.png

この画像を好きな画像ファイルに置き換えてください

■メニューボタンを非表示にする
メニューボタンは非表示にすることができます。
プロジェクトフォルダの /system/Config.tjs　ファイルを開いてください


// ◆ コンフィグ（メニュー）機能表示

// セーブ・ロードやタイトルに戻るといった一連の機能を表示するかを指定します

;configVisible = true;  //コンフィグアイコンを表示

;configLeft    = -1     //コンフィグアイコンの左位置を指定できます。-1の場合は画面右下

;configTop     = -1     //コンフィグアイコンの上位置を指定できます。-1の場合は画面右下

;configVisible = true の部分を　falseに設定することでメニューボタンが非表示になります
また、configLeft と　configTopの両方を指定した場合、好きな位置へメニューボタンを表示することができます。

■独自のボタンでメニュー画面やセーブ、ロードを呼び出す
[showload] [showsave] [showmenu] タグが用意されています。
ボタンクリック後、上記のタグを記述しておくことでそれぞれの画面を表示することが可能です

メニュー画面・セーブ・ロード画面のカスタマイズ

次に各種画面のカスタマイズ方法を見ていきましょう。メニュー画面では、以下の画像を自分の好きな画像ファイルに置き換えることで、簡単にカスタマイズすることができます。

プロジェクトフォルダのtyrano/images/system　の中にある以下のファイルを変更しましょう

・button_menu.png (メニュー呼び出しボタン)
・menu_bg.png(メニュー画面背景)
・menu_load_bg.jpg(ロード画面背景)
・menu_save_bg.jpg(セーブ画面背景)
・menu_button_close.png(メニュー画面の閉じるボタン)
・menu_button_load.png（ロードボタン）
・menu_button_save.png (セーブボタン)
・menu_button_skip.png（スキップボタン）
・menu_button_title.png（タイトルへ戻るボタン）
・menu_message_close.png(ウィンドウを消すボタン)

☆画面サイズによっては、セーブデータが見きれてしまうことがあるかもしれません。その際は tyrano/tyrano.cssをひらいて、以下の部分を調整してください


/*セーブ・ロードのテキスト部分の文字のスタイルを指定できます*/
.save_menu_date_font {
    font-size:10px;
}

/*セーブ・ロード画面のテキスト部分のスタイルを指定できます。*/
.save_menu_text_font{
    font-size:14px;
}

/*セーブ・ロードデータの行間などが調整できます*/
.save_display_area{
    margin-top:20px;
}

各種画面の配置を調整する

画像だけでなく、各要素の配置方法を変えることもできます。
ただし、簡単なHTMLとCSSの知識が必要になりますので、ご注意ください。

セーブ画面やメニュー画面などは、HTMLとCSSで表現されています
以下のフォルダにHTMLファイルが配置されており、編集することですべて作り替えることが可能です。

【プロジェクトフォルダ】/tyrano/html/

・backlog.html　（バックログの画面）
・load.html （ロード画面）
・menu.html （メニュー画面）
・save.html （セーブ画面）

これらのファイルを編集することで、自由に画面を作り変えることができます。
ファイルには特定の機能をもつHTML要素にはクラス名が付与されています。このクラス名を付与することによって、該当するHTMLに各機能がわりあてられます。

menu_close ：閉じるボタン
log_body：このクラスで指定された領域の中にログが表示されていきます
menu_save：セーブボタンへ移動
menu_load：ロードボタンへ移動
等など、実際にファイルを見ていただくと、クラスが持っている役割がわかると思います。

画面上に常に機能ボタンを表示する

ゲームの画面上にスキップボタンやセーブボタンなどを設置したいケースもあるかと思います。
ティラノスクリプトでは、以下のような画面のシステムも簡単に作ることができます。

まず、標準で表示されるシステムボタンは不要なので、config.tjs の　;configVisibleをfalseにしておきます。

つぎに、ボタンをゲーム開始時の共通部分（first.ks）などに記載します。


[button name="role_button" role="skip" graphic="button/skip.gif" x=350 y=400]
[button name="role_button" role="save" graphic="button/save.gif" x=430 y=400]
[button name="role_button" role="load" graphic="button/load.gif" x=510 y=400]
[button name="role_button" role="backlog" graphic="button/log.gif" x=590 y=400]
[button name="role_button" role="window" graphic="button/close.gif" x=670 y=400]
[button name="role_button" role="menu" graphic="button/menu.gif" x=750 y=400]

上記のように、button タグに roleパラメータを指定することで、特別な機能を持ったボタンを配置することができます。

【各ロールボタンの役割】
・skip：スキップを開始します
・save：セーブ画面を表示します
・load：ロード画面を表示します
・backlog：バックログを表示します
・window：メッセージウィンドウを非表示にします
・menu：メニュー画面を表示します。

簡単ですね。

かならず、ゲームをセーブして、ロードしたときにボタンが表示されているかを確認してみましょう。

メッセージ速度、BGM・効果音の有無をユーザに選択させる

ゲームをプレイするユーザさんが、自由にメッセージ速度や音楽再生を選択できると便利ですよね。以下のようにすることで、制御することができます。



[iscript]
/*文字速度の変更 少なくすることで、表示が早くなる*/
TG.stat.ch_speed=30;

/*BGMを再生しない*/
TG.stat.play_bgm = false;

/*効果音を再生しない*/

TG.stat.play_se = false;

[endscript]

バックログ機能の設定

ゲームをプレイしていて、少し戻ってストーリーを読み直したい時が有りますよね？その場合はバックログ機能を実装しておくと、親切なゲームになります。

ティラノスクリプトでバックログを有効にするには、system/config.tjs を開いて maxBackLogNumに保存する最大テキスト行数を設定してください。


// ◆ バックログ機能

// バックログ機能用にテキストの最大保持数を保存できます。

// 保存されたデータはtf.system.backlog に配列として格納されます。

// 0の場合、保存を行いません。

;maxBackLogNum = 200;

上記が設定された上で、ゲームを読み込むと tf.system.backlog 変数に配列としてテキストが格納されるようになります。
その値を取得して自由にバックログを実装してください。

また、さらに簡単にバックログを実装する方法として

・[showlog]タグを使う
・button タグのrole 機能を使う
方法が用意されています。これらを使用すると、ティラノスクリプト標準のバックログがすぐに利用できます。

チュートリアル

実践テクニック

アドバンス

スタジオ