ビルダーでバックログの文字色や大きさを変更する方法の備忘録。

今回はティラノビルダーでバックログの文字色や大きさを変更する方法の備忘録です。

下準備

まず、初期状態ではゲーム画面上にバックログ画面を開くボタン自体が無いので、とりあえずバックログボタンを追加します。(手動の場合)
プロジェクト>UIデザインツール>一覧から「過去ログ表示」を選択>「パーツの追加」を押し、出て来たボタンを良さげな場所に移動させて「適応する」を押す。



で、ゲーム画面上に出て来たログボタンを押すと……。


バックログの文字はデフォルトが#999(薄い灰色)になっています。
そしてゲームの雰囲気に合わせようとティラノビルダーの機能の
ゲーム設定>メニュー>バックログ画面を編集
にてバックログ画面を触った場合……。
ビルダーの機能では「背景」「タイトル(BACKLOGロゴ)」「戻る(ボタン画像)」のみ変更出来ます。
さっそく背景を変更してみましょう。


そしてバックログ画面を見てみると……。

文字色の変更が出来ないため、背景画像によっては、バックログの文字がめちゃくちゃ見づらくなるのだ!(突然変わる口調)

文字色を変える

文字色を変えるために、今回はhtmlを触ってみます。

※自分は「Visual Studio Code」という無料のソースコードエディタを使いました。

エディタDLページ↓
https://code.visualstudio.com/Download

ビルダーにて
myproject>作品名>tyrano>html>backlog.html
を探して、backlog.htmlをエディタで開きます。

"log_body"の段にある、 color:#999;が現在の文字色です。

文字色はカラーコードで書かれていますが、「Visual Studio Code」で開くと、現在の色が□の中に実際に見える上、オンカーソルで色を選択出来るウィンドウが出るので、カラーコードを覚える必要はありません。(その場合はrbg表記になります)
もちろんカラーコードで指定しても構いません。(今回の場合color:#3200FF;に変更します)

好みの色を検索したり、色の名前から探したい場合はサイト等を利用するとよいかも。
カラーサイト.com↓
https://www.color-site.com/

文字色の指定を以下に変えてみましょう。
color:rgb(50, 0, 255);

そしてバックログ画面を見ると……。

文字色が青に変わりました。

ちなみに同じ行にあるborderは文字が表示される部分を囲っている枠の太さと色の設定のようです。
border:1px solid #555;

試しに枠の太さを10pxにしてみました。
border:10px solid #555;

10pxにするとこんな感じに。戻しておきます。

文字の大きさを変える

文字が少し小さい気がしたので、文字色の指定の後ろに、文字の大きさの指定を入れてみます。(デフォルトは28px)
font-size: 35px;


35pxは少し大きすぎたでしょうか。

フォント自体はデフォルトなので、設定>フォントスタイルで変更すると印象が変わるかも知れません。(ファンタジーに変更)


余談

"log_body"の段にline-height(ラインハイト)を入れることで、バックログ画面の文字の行の高さを指定出来ます。(デフォルトは現在1.6のようです。)
line-height:3;



文字の行の高さが変わりました。

わかりやすいよう、かなり大きさを変えましたが、これで少しは見やすいバックログ画面になれば幸いです。

フォロワー以上限定無料

ほんの一言。

無料

この記事が良かったらチップを贈って支援しましょう!

チップを贈るにはユーザー登録が必要です。チップについてはこちら

月別アーカイブ

限定特典から探す

記事を検索