Section 10.1 メッセージ履歴画面をカスタマイズする

今回から第10章!
遂に章の数も2ケタになったね〜。
そだね〜。ここまででも色んなことやってきたよね。
えっと、それで今回はメッセージ履歴関係をやるんだったよね?
ん、10章はメッセージ履歴のカスタマイズをやるつもりだよ。
前回も言ったと思うけど、メッセージ履歴ってあんまりカスタマイズとかできなさそーな気がするんだけど?
まぁ確かに KAG でメッセージ履歴の設定っていうと Config.tjs で設定できるフォント関係の設定とか、 どれだけメッセージ履歴のデータを保存するかとかだからね。
あとは history タグでメッセージ履歴にメッセージを出力するかどうかとか、 メッセージ履歴を表示可能にするかどうかを設定できるくらい、かな?
そんな感じだね。
この章でやるカスタマイズってゆーのもそういう設定をカスタマイズするってことなの?
ううん、この章でやるのは、メッセージ履歴画面の見た目を変えるためのカスタマイズだよ。
メッセージ履歴画面の見た目を変えるって?
普通メッセージ履歴画面ってこんな感じだよね。

<普通の(デフォルトの)メッセージ履歴画面の例>

そーだね。こんな感じだよね。
この章でやるメッセージ履歴画面のカスタマイズってのは、 例えばメッセージ履歴画面の見た目をこんなふうにしてみようってことなんだ。

<カスタマイズ後のメッセージ履歴画面の例>

うわ、なんか見た目が全然違う!
ちなみに、カスタマイズするために追加した機能はこの4つだよ。

<メッセージ履歴画面のカスタマイズのための追加機能>

  1. メッセージ履歴画面の背景画像設定機能
  2. スクロールバーによるメッセージ履歴のスクロール機能
  3. メッセージ履歴アクションボタン機能
  4. メッセージ履歴画面を閉じるボタンの画像設定機能

ん〜、これだけだとどんなふうにカスタマイズされてるのかちょっとよくわかんないかな…
じゃとりあえず順番にもうちょっと詳しく見てくね。
うん。
まず最初は「メッセージ履歴画面の背景画像設定機能」ね。
これは見ての通りメッセージ履歴画面に背景画像を表示できるようにする機能ってことだよ。
メッセージ履歴画面の背景ってフツーは暗くて半透明な画像になってるよね。
それの代わりに好きな画像が表示できるってこと?
ん、そういうこと。
それじゃ次は「スクロールバーによるメッセージ履歴のスクロール機能」ね。
メッセージ履歴画面に全部のメッセージが表示しきれない時って、 普通はこういうボタンでページを切り替えて、見たいメッセージを表示するでしょ。

<メッセージ表示ページ切り替えボタン>

うん、そーだね。
このページ切り替えボタンの代わりに、 ブラウザとかテキストエディタとかでよく見かけるこういうスクロールバーを使って、 メッセージをスクロールできるようにするってことね。

<スクロールバー>

…これって便利なの?
ん〜、それは使う人によると思うけど、 スクロールバーって色んなアプリケーションで使われてるから、 大抵の人は使ったことあると思うし、使い方もすぐにわかるでしょ?
まー確かにね。
じゃ次は「メッセージ履歴アクションボタン機能」ね。
これが一番よくわかんなかった機能なんだけど?
まずメッセージ履歴アクションは知ってる?
えっと…hact タグで指定するののことだっけ?
そうそう。
hact タグと endhact タグで囲まれたメッセージがメッセージ履歴画面上でクリックできるようになる機能のことね。
メッセージ履歴画面に表示されてるセリフに対応する声を再生したりするのに使われるよね。
んー、あんまり…ってゆーかほとんど使ったコトないけどねぇ。
確かに声の再生以外にはあんまり使われてなさそうだから、そんなに使う機会がないかもね。
まぁでも声を入れる場合は、一回流れた声がいつでも再生できるようになるわけだから、 便利な機能なんじゃないかな。
まーね。
で、普通は hact タグと endhact タグで囲まれたメッセージの部分がこんなふうにリンクになってクリックできるようになるわけだけど…

<メッセージ履歴アクションのリンクの例>

リンクを表示する代わりに、こういうボタンを押したら hact タグと endhact タグで囲まれたメッセージの部分に設定されてるアクションが実行される(例えば声が再生される)ようにするの。

<メッセージ履歴アクションボタンの例>

(注)表示できるボタンは1行につき1個だけなので、1行に2組以上の hact, endhact を入れることはできません。
  (1行に2組以上入れた場合は2組目以降は無視されます)

なるほどねぇ。
んっと、これも便利…なのかな?
まぁこれも便利かどうかって言われると、やっぱり人によるかなぁ。
ただ、ボタンはいつでも表示されてるから、 少なくとも「ここにメッセージ履歴アクションが設定されてるよ」ってのは見た目にわかりやすくなるんじゃないかな。
あ、そっか。
リンクだとマウスカーソルを近づけないとアクションが設定されてるかどうかわかんないもんね。
でしょ。
じゃ最後は「メッセージ履歴画面を閉じるボタンの画像設定機能」ね。
まぁこれは見ての通りで、メッセージ履歴画面を閉じるボタンに button タグのボタンみたいに自由に画像を表示できるようにしようって機能だね。
えっと、それってつまり、ふつうのメッセージ履歴画面だと、 メッセージ履歴画面を閉じるボタンはこんな感じだけど…

<デフォルトのメッセージ履歴画面を閉じるボタン>

こんなふうに画像を使ってボタンの見た目を変えようってことだよね?

<カスタマイズ後のメッセージ履歴画面を閉じるボタン>

ん、そういうこと。
これは便利にするためっていうよりは見た目を変えるための機能だね。
じゃあボタンを押したらメッセージ履歴画面が閉じるってのはふつうの閉じるボタンとおんなじなんだ?
うん。まぁそこはさすがに変えようがないからね。
まーそーだよね。
ちなみに、スクロールバーが表示されるっていう設定だけは変えられないんだけど、 背景とかメッセージ履歴アクションは、 カスタマイズしたくなかったら普通の(デフォルトの)表示にすることもできるよ。
そーなんだ。
あ、閉じるボタンは普通の表示にできるの?
んー、普通の表示にできるようにしたかったんだけど、 閉じるボタンってデフォルトの横書きのメッセージ履歴画面だと「次ページ ≫」ボタンの右隣にあるでしょ?
そーだね。
そのボタンをスクロールバーに変えちゃったから、閉じるボタンもある程度カスタマイズしなきゃいけなくなっちゃったんだよね。
じゃあ画像が必要ってコト?
ううん、画像は無くても大丈夫だよ。
画像を設定しない時は普通の閉じるボタン( 普通の閉じるボタン )と似たような感じのボタン( カスタマイズ後のデフォルトの閉じるボタン )が表示されるようにしてるから。
そっか。
それじゃカスタマイズしてる部分は一通りチェックしたから、今回はこれくらいにして、 次回はカスタマイズするためのスクリプトの方を見てこっか。
カスタマイズするためのスクリプトって?
メッセージ履歴画面のフォントとか文字の大きさとかの設定は Config.tjs でやるでしょ。
そだね。
メッセージ履歴画面をカスタマイズするためにも Config.tjs みたいな設定のためのスクリプトがあるんだ。
あ、そーなんだ。
ってワケで、それを次回見ていくことにするね。
それじゃ、また次回ね。


前へ | TOP | 次へ