NDI™で送信するRTAイベントタイマーをUnityで作る #06 マウス入力編

日本語フォントのインストール

Unity にはデフォルトで日本語のフォントがないため、マウス入力を作る前に日本語フォントをインストールします

かわいい場面におすすめの「コーポレート・ロゴ（ラウンド）ver3」フォント無料DL

Corporate-Logo-Rounded-Bold-ver3.otf を Assets > Fonts にドラッグ＆ドロップしてインポート

メニューから [ウィンドウ]→[TextMeshPro]→[フォントアセットクリエーター]を開きます

上のテキストではない

TMP Impoter で Import TMPEssentials を実行する

下はいらない

Souce Font File に 先ほどインポートしたフォントを設定。Atlas Resolution を 8192 x 8192 に。Character Set を Custom Characters に設定する

Custom Character List に入れる内容を以下からダウンロード

Custom Character List に内容を張り付けて、Generate Font Atlas を実行

結構時間がかかるのでのんびり待とう

Save を押すのを忘れずに

Assets > Fonts に Corporate-Logo-Rounded-Bold-ver3 SDF.asset ができればOK

ボタンを配置

MouseInput Background Image を用意。ボタンとラベルを配置していく

テキストを2行にする場合は、Text（UI）の Spacing Options (em) の Line を -30 にするといい感じ
とりあえずフォントサイズは 24 で。右端の時間調整のところは、フォントの Margins の Top を -2 に調整
ラベルも配置しておく
一番左端のボタン以外の Button の Interactable のチェックをすべて外しておく

デフォルトだとグレーになってこんな感じ

CountUpToggleButton.cs

クリック時に他のボタンをつかえるようにするだけなら、ソースの記述は要らなさそうだけどトグルにしたいので

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class CountUpToggleButton : MonoBehaviour
{
   [SerializeField] List<Button> buttons;

    // Start is called before the first frame update
    void Start()
    {
        
    }

    // Update is called once per frame
    void Update()
    {
        
    }

    // このボタンがクリックされた時の処理。public にしておかないとインスペクターから見えない
    public void Onclick()
    {
        foreach (var button in buttons)
        {
            button.interactable = !button.interactable; ;
        }
    }
}

リストの中身を追加

インスペクター、CoutUp Toggle Button の クリック時（）（OnClick() が翻訳されてる）

＋を押したらこんな感じ。CoutUp Toggle Button 自身をオブジェクトに指定する

OnClick() 時に OnClick() がちゃんと呼ばれるように

カウントダウン側も作っておく。動作を確認して、トグルを押したときのみマウス用のボタンが使えればOK

CountUpMain.cs に Function を追加

    // マウスから入力を渡せるように Function を追加
    public void setInputStatus(string input_string)
    {
       if (!string.IsNullOrEmpty(input_string))
        {
            switch (input_string)
            {
                case "ready":
                    input_status = InputStatus.ready;
                    break;
                case "start":
                    input_status = InputStatus.start;
                    break;
                case "stop":
                    input_status = InputStatus.stop;
                    break;
                case "pause":
                    input_status = InputStatus.pause;
                    break;
                case "resume":
                    input_status = InputStatus.resume;
                    break;
                case "reset":
                    input_status = InputStatus.reset;
                    break;
                case "up 1sec":
                    input_status = InputStatus.up_1sec;
                    break;
                case "up 1min":
                    input_status = InputStatus.up_1min;
                    break;
                case "up 1hour":
                    input_status = InputStatus.up_1hour;
                    break;
                case "down 1sec":
                    input_status = InputStatus.down_1sec;
                    break;
                case "down 1min":
                    input_status = InputStatus.down_1min;
                    break;
                case "down 1hour":
                    input_status = InputStatus.down_1hour;
                    break;
            }
        }
    }

各ボタンにクリック時の処理を追加

マウスで動作することを確認。カウントダウン側も作っておく

バッチリ！

おつかれさまでした

次はマウス操作について改良を思いついたので、それを作成していきましょう