トップページへ戻る


タイトル画面の文字配置
 
「今日は、今まで覚えた知識を元にして、ゲームのタイトル画面を作ってみよう」

「タイトル画面ってゆーと、タイトル画像がどーんと出て、『はじめる』『データをロードする』『おわる』みたいなメニューが出てくるやつかな?」

「まさにそれだ」

「そーすんと、選択肢の知識が必要になるねー」

「待て待て。まずは前回までの復習で、タイトルロゴがフェードインするスクリプトを書いてみよう」

「タイトルロゴは title.jpg で準備したし、オープニングBGMも入れたいから title.mid を作ったもん」

「よし。それじゃ早速書いてごらん」

「んー」

[title name="タイトル"]\
[wc time=20]\
*start|スタート
[playbgm storage="title"]\
[image storage="title" page=back layer=base]\
[trans time=2000 method=universal rule="trans1" vague=100]\

「method=universal は省略できるってば」

「あ、そーだったっけ」

[title name="タイトル"]\
[wc time=20]\
*start|スタート
[playbgm storage="title"]\
[image storage="title" page=back layer=base]\
[trans time=2000 rule="trans1" vague=100]\

「実行ー。あれれー? 音楽はちゃんと鳴ってるし、トランジションもできたけど、なんか暗いじゃんよもー」

「文字レイヤーの黒い四角がタイトル画像の上に表示されているからだよ」

「んぢゃ、画像が表示される前に文字レイヤーを見えなくしちゃうもんねー」

[title name="タイトル"]\
[wc time=20]\
*start|スタート
[playbgm storage="title"]\
[layopt layer=message0 page=fore visible=false]\
[image storage="title" page=back layer=base]\
[trans time=2000 rule="trans1" vague=100]\

「それじゃだめだ。いくら [layopt] タグで文字レイヤーのフォアグラウンドを不可視にしても、その後の [trans] タグで文字レイヤーのバックグラウンドから可視の属性がコピーされちゃうから」

「んぢゃ、こないだ覚えた [backlay] を入れてみんもん。これで、見えないぞくせーを文字レイヤーのバックにもコピーすんもん」

[title name="タイトル"]\
[wc time=20]\
*start|スタート
[playbgm storage="title"]\
[layopt layer=message0 page=fore visible=false]\
[image storage="title" page=back layer=base]\
[backlay]\
[trans time=2000 rule="trans1" vague=100]\

「これでどーかなー?」

「それでもだめだ。そうすると文字レイヤーはいいけど、今度は背景レイヤーの何もないフォアグラウンドがそのままバックグラウンドにコピーされちゃうぞ。トランジションをしても真っ黒なままになっちゃうぞ」

「あ、そーか……」

「そういう場合はこうやって書くといい」

[title name="タイトル"]\
[wc time=20]\
*start|スタート
[playbgm storage="title"]\
[layopt layer=message0 page=fore visible=false]\
[image storage="title" page=back layer=base]\
[backlay layer=message0]\
[trans time=2000 rule="trans1" vague=100]\

[backlay] タグには属性が一つだけある。layer=*** がそれだ。これを指定することで、フォアグラウンドからバックグラウンドに内容をコピーしたいレイヤーを、一つだけ指定することができる」

「んぢゃー、今までは layer=*** を省略していたから、全部のレイヤーの中身が表から裏にコピーされていたってこと?」

「そういうこと」

「実行してみよーかなー」

「できたー!」

「それじゃ、画面の下の方にメニューを表示しよう。『ゲームをはじめる』と『セーブデータをロードする』と『オプション』と『ゲームを終了する』の四つを」

「んーと……」

「文字レイヤーを見えるようにするのを忘れるなよ」

「わかってるわよもー!」

「トランジションの次に別のタグを書く前に、[wt] を忘れるなよ」

「わかってるってゆってんでしょもー!」

[title name="タイトル"]\
[wc time=20]\
*start|スタート
[playbgm storage="title"]\
[layopt layer=message0 page=fore visible=false]\
[image storage="title" page=back layer=base]\
[backlay layer=message0]\
[trans time=2000 rule="trans1" vague=100]\
[wt]\
[ct]\
[backlay]\
[layopt layer=message0 page=back visible=true]\
[trans time=2000 rule="trans1" vague=100]\
[wt]\
ゲームをはじめる
セーブデータをロードする
オプション
ゲームを終了する

「かんぺきだもんねー。それぢゃー実行ー! んきゃーーーーーーーー!」

「やると思った」

「なんであんな場所に出ちゃうのよもー!」

「仕方ないだろ。位置合わせを全然していないんだから」

「どーやって位置を合わせんのよもー!」

「この場合は [locate] タグを使う。書式は [locate x=*** y=***] で、文字が表示される開始位置を指定するんだ。ちなみに *** にはピクセル数が入る」

「よーし」

[title name="タイトル"]\
[wc time=20]\
*start|スタート
[playbgm storage="title"]\
[layopt layer=message0 page=fore visible=false]\
[image storage="title" page=back layer=base]\
[backlay layer=message0]\
[trans time=2000 rule="trans1" vague=100]\
[wt]\
[ct]\
[backlay]\
[layopt layer=message0 page=back visible=true]\
[trans time=2000 rule="trans1" vague=100]\
[wt]\
[locate x=80 y=320]\
ゲームをはじめる
セーブデータをロードする
オプション
ゲームを終了する

「いけー! 実行ー!」

「……」

「んきゃーーーーーーーーーーー!」

「あらら〜。ムチャクチャ悲惨なことになったな。文頭は揃ってないし、メニューのくせに次のページへはみ出しているし……」

「どーすんのよもー!」

「目算で決めないで、適当なグラフィックソフトでそれぞれの行の位置をピクセル単位で取得してからタグに書かなくちゃだめだよ。それと、二行目からはY軸(縦)方向の指定はいらないけど、X軸(横)方向はちゃんと指定してあげないと」

「よーし!」

[title name="タイトル"]\
[wc time=20]\
*start|スタート
[playbgm storage="title"]\
[layopt layer=message0 page=fore visible=false]\
[image storage="title" page=back layer=base]\
[backlay layer=message0]\
[trans time=2000 rule="trans1" vague=100]\
[wt]\
[ct]\
[backlay]\
[layopt layer=message0 page=back visible=true]\
[trans time=2000 rule="trans1" vague=100]\
[wt]\
[locate x=80 y=280]\ゲームをはじめる
[locate x=80]\セーブデータをロードする
[locate x=80]\オプション
[locate x=80]\ゲームを終了する

「また勘でやってる……」

「それいけー! 実行ー!」

「……」

「んっっっっっっきゃーーーーーーーーーーー!」

「あはは。¥マークを取るのを忘れたか」

「もーやだー! 全っ然うまくいかないぢゃよもーんきゃー!」

「落ち着けってば」

「三度目のしょーぢきだもん!」

[title name="タイトル"]\
[wc time=20]\
*start|スタート
[playbgm storage="title"]\
[layopt layer=message0 page=fore visible=false]\
[image storage="title" page=back layer=base]\
[backlay layer=message0]\
[trans time=2000 rule="trans1" vague=100]\
[wt]\
[ct]\
[backlay]\
[layopt layer=message0 page=back visible=true]\
[trans time=2000 rule="trans1" vague=100]\
[wt]\
[locate x=200 y=300]ゲームをはじめる
[locate x=200]セーブデータをロードする
[locate x=200]オプション
[locate x=200]ゲームを終了する

「お願いだもん! かっこよく決まってー!」

「……計画性のない……」

「こんなもんかなー」

「まあ、よしとしようか」

「だめだもん! よしぢゃないもん!」

「何がだめだ?」

「あれ……えーと、あれすんだもん! あれだもん! あれ!」

「あれじゃわからん」

「レンダリング!」

「できねーっつーの」

「マンドリング!」

「は?」

「モンダミング!」

「……ひょっとして、センタリングのことか?」

「そーなのそーなのそーすなの!」

「うまい焼きそばソースなの……って、もうそれはいいってば」

「センタリングだもん!」

「それならそうと、もっと早く言ってくれよ。センタリングをするためには、[style] タグを使う。このタグはいろいろと使い道があるけど、ここでは属性は一つだけ覚えておけばいい」

「センタリングセンタリング!」

「うるさいな。センタリングするには [style align=center] でOKだ」

「さっそく書いちゃうもん」

[locate] タグの縦位置(Y座標)だけは残しておかないとだめだぞ」

「わかってんもん」

「センタリングを行った後は、align=default で行儀よく元に戻しておく癖をつけよう」

「だから、わかってんもん!」

[title name="タイトル"]\
[wc time=20]\
*start|スタート
[playbgm storage="title"]\
[layopt layer=message0 page=fore visible=false]\
[image storage="title" page=back layer=base]\
[backlay layer=message0]\
[trans time=2000 rule="trans1" vague=100]\
[wt]\
[ct]\
[backlay]\
[layopt layer=message0 page=back visible=true]\
[trans time=2000 rule="trans1" vague=100]\
[wt]\
[locate y=300]\
[style align=center]\
ゲームをはじめる
セーブデータをロードする
オプション
ゲームを終了する
[style align=default]\

「実行してみんもん!」

「んー、なんか文字の縦列が揃ってないなー」

「これはKAGのコンフィギュレーションファイルの文字レイヤーのデフォルトフォントが『MS P明朝』だからだよ。Windowsのプロポーショナルフォントを使うと、勝手に字詰めを行ったりしてレイアウトがガタガタになるから、これを等幅フォントに変えてやればいい」

「どーやって?」

「systemフォルダの中の config.tjs ファイルを開いて、以下の行にあるフォント名からPを削ればいいんだ」

// 文字の書体
// デフォルトのフォント名を指定します
// この設定はシステム変数に記録されて、次回起動時に
// 引き継がれるので、defaultFace の設定を変更し、適用したい場合は
// システム変数ファイルの system_defaultFontFace= の行を
// 削除してください。
defaultFace="MS P明朝";

「こう?」

// 文字の書体
// デフォルトのフォント名を指定します
// この設定はシステム変数に記録されて、次回起動時に
// 引き継がれるので、defaultFace の設定を変更し、適用したい場合は
// システム変数ファイルの system_defaultFontFace= の行を
// 削除してください。
defaultFace="MS 明朝";

「それから、一度指定して実行したフォントはシステム変数に残ってしまうので、ゲームの開発中に、config.tjs 内でデフォルトフォントの変更を行った場合は、システム変数内の一行を消す作業が必要になる」

「めんどーくさいなー」

「まあそう言うな。消す変数は、krkr.eXe と同じ場所にある ****g.dat というファイルの中にある。これを開いてみると、その中にフォントを指定している一行が必ずあるはずだから、これをざっくりと削ればいい」

system_chSpeed="default";
system_chAntialiased=-1;
system_defaultFontFace="MS 明朝";

「毎回こんなことやんのわめんどーくさいもん」

「でもさ、ゲームを作る上で、デフォルトのフォントは最初に決めておくはずだろ? 途中で『どうしても明朝じゃなくてゴシックにしたい』みたいに気が変わった場合だけ、上の例のようにシステム変数を削除すればいいんだから、大した手間じゃないよ」

「そういえば、そーだけど」

「じゃあ、もう一度実行してみようか」

「どうだい?」

「なかなかきれーだもん」

練習日記 3日目 次へ


トップページへ戻る