こんにちは。なおキーヌです。

ブログ毎日更新は365日目になります。

1年間毎日更新達成ですね！

今回はイベント処理に使うメッセージイベントを作っていきます。

メッセージイベントを作るには

Unityではデフォルトでテキストを表示する仕組みが用意されていますので、それを有効活用しましょう。

フォントも変更できるのですが一旦は内蔵フォントで我慢しましょう。

良い感じのフォントがあればそれを使ってください。

まずはメッセージを乗せるためのメッセージウィンドウが必要になります。

uGUI等の機能を使っても良いですが、見た目を変えないと
ドット絵にミスマッチなので私はメッセージウィンドウを簡単に作ります。

メッセージウィンドウとなるスプライトを作る

メッセージを乗せていくウィンドウを表示する土台としてスプライトを実装します。

ウィンドウの背景はお好みの画像を入れるかベタぬりをしてください。

私はボロボロな紙風のウィンドウにしてみました。

背景を薄い黄土色っぽい色にしてフリーの質感のあるテクスチャを載せて
アウトラインを削ったりすると良い感じに古紙ぽい画像になります。

最後にドロップシャドウを付けたら良い感じになりました。

ここはお好みで。

フォントを乗せてみる

ファミコン風フォントを使おうとしたのですが、可読性があまりよくなかったので
スーファミ寄りのフォントを使うことにしました。

今回使ったフォントは「PixelMplus12」を使用させていただきました。

SFC風のレトロゲーにマッチしててよいですね。

ありがたく使わさせていただきましょう。

Unityでフォントを使う場合はAssetsディレクトリにFontディレクトリを作成して
そこに格納していきます。

分かりやすくしているだけで、ディレクトリはお好きな場所でOKだと思います。

しかしそのまま使うとぼやけてしまうのでクッキリドットが見えるように設定してあげます。

フォントそのものの設定はこんな感じ。

そのフォントを適用したテキストオブジェクトはこんな感じ。

しかしこのままだとまだ滲んだままなのでフィルターモードをかえてやらないといないのですが、
Unityエディタにはそのような項目がフォント関連には存在していません。

なんでデフォルトで用意してくれてないのだろうか……

と言っても仕方がないのでスクリプト側で強制で変えてやれば実装出来ます。

下記のスクリプトを作ってください。

using UnityEngine;
using UnityEngine.UI;

public class TextFilterMode : MonoBehaviour
{
    // Start is called before the first frame update
    void Start()
    {
        Text text = GetComponent<Text>();
        Texture tex = text.font.material.mainTexture;
        tex.filterMode = FilterMode.Point;
    }
}

このスクリプトをフォントオブジェクトに貼り付けます。

自信のテキストコンポーネントを取得してフィルタモードを変更してやるわけですね。

この状態でゲームスタートを押すと文字がクッキリなるのが分かると思います。

フォントを見やすく縁取り（アウトライン描写）する

色々調べていたのですが、Unityではデフォルトできれいに縁取る感じのやり方がないようです。

TextMeshProを使ったり、スクリプトで無理矢理文字をコピーしてずらして表示したり
なんともゴリ押し間が半端ない方法しか見つかりませんでした。

実際問題フォトショップとかでも裏で同じことをしてアウトラインを取ってたりするので
あまり気にしなくても大丈夫な時代ではありますが一応ゲームとしては軽いに越したことはありません。

しかしTextMeshProは日本語フォント全てをやると結構面倒くさいようなので、
というか実際に触ってみたらものすごく面倒で意味不明なので萎えました。

アルファベット～ひらがなカタカナのみだと便利かもしれません。

結局取った方法はスクリプトによるアウトライン描写

結局は文字をコピーして文字の後ろに色を変えて描写するという方法以外見つからず、
それならスクリプトで楽にできないかと調べていた所見つけました。

きれいなアウトラインをつける
https://freelyapps.net/beautiful-font-outline/

上記のブログで便利なスクリプトを公開してくれています。

文字のアウトラインの仕組みなんかも解説してくれてるので、意味が分からない人は見てみるとよいでしょう。

上記のブログにある「CircleOutline.cs」というスクリプトを作成して、
フォントオブジェクトにアタッチします。

設定は以下の通りにしました。

こうすることで以下のようになりました。

Scene側では綺麗になっていますが、Game側では漢字の部分のアウトラインがちょっとおかしくなっています。

しかし突き詰めるとものすごく時間がかかってしまうので、一旦これで妥協して進めます。

この手法が嫌な場合はドラクエのように背景を黒にして白文字にすれば可読性は上がると思います。

お好みでどうぞ。

テキストをスプライトにしてしまう

フォントの対処法としてはスプライトにしてしまうという手もあります。

実際にスーパーファミコンのフォントはスプライトにして必要な文字だけを
ゲームに画像として埋め込んでいることが多いです。

というかそうしないと6Mしかないカートリッジの容量が足りません（笑）

恐らくフォントデータをそのまま添付するよりはか軽くなるはずですが、
表示するフォントを厳選してスプライトとして収録するのは結構骨の折れる行為です。

ひらがなとカタカナのみだと軽いし楽ですが、漢字を含めるとなると
どこまで含めるのかが難しくなります。

文章を打つときは絶対にどこかのテキストに1つにまとめておいて
後から使用した文字を抽出できるようにしておきましょう。

レトロゲームぽくカタカナオンリーにするのは読みづらいので
出来ればひらがなも使えるようにしておいた方がいいでしょう。

毎日更新は今年いっぱいで終了

1年続けた感想など書きたい所ではありますが、ブログの趣旨からズレてしまうので
このままゲーム作りの参考書として変わりなく続けていきます。

ですが今後このブログについては毎日更新を停止します。

と言いつつ時間があれば随時投稿していく感じです。

これからもゲーム作りの参考書を宜しくお願いいたします。

それでは良いお年を！