LoginSignup
15
15

More than 5 years have passed since last update.

[Unity] 現在時刻をUI機能のTextで表示させる

Last updated at Posted at 2018-04-15

備忘録です。

目的

時計アプリを作る際に必要不可欠な、リアルタイム更新されるテキスト系の時計を用意する。

テキストを用意する

Hierarchyビュー上で右クリック -> UI -> Text で
Canvas内にTextが生成される。
ゲームビューを確認しつつテキストの位置やサイズ等を設定する。(詳細は割愛する)

コードを書く

Projectビュー上のAssetsで右クリック -> Create -> C# Script で
C#スクリプトを生成してコードを書く。

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

public class TimeNowScript : MonoBehaviour {

    private Text ClockText;

    // Use this for initialization
    void Start () {
        ClockText = GetComponentInChildren<Text>();
    }

    // Update is called once per frame
    void Update () {
        ClockText.text = DateTime.Now.ToLongTimeString();
    }
}

コードの補足

参照の追加

using System;
using UnityEngine.UI;

参照にこの2つを追加した
DateTime関連の参照にSystem、UnityのUI関連にUnityEngine.UIが使われる

タイマーを表示するテキスト

    private Text ClockText;

classの代わりにTextと記述する

Textコンポーネントを取得

    void Start () {
        ClockText = GetComponentInChildren<Text>();
    }

親子関係にある子オブジェクトからTextコンポーネントを取得する
記述し忘れるとNullReferenceException: Object reference not set to an instance of an objectになる

現在時刻を取得

    void Update () {
        ClockText.text = DateTime.Now.ToLongTimeString();
    }

デバイスから現在取得し、テキストにリアルタイム反映させる
ToShortTimeString()の部分は以下に直すことで別の形式で反映させることができる

// 時、分を取得する(hh:mm (AM/PM))
        ClockText.text = DateTime.Now.ToShortTimeString();
// 時、分、秒を取得する(hh:mm:ss (AM/PM))
        ClockText.text = DateTime.Now.ToLongTimeString();
// 日付を取得する(MM/dd/yyyy)
        ClockText.text = DateTime.Now.ToShortTimeString();
// 日付を取得する(曜日,日付,yyyy)
        ClockText.text = DateTime.Now.ToLongTimeString();

アタッチする

書いたスクリプトを、生成したテキストにアタッチして、Playして動作を確認する。

録画_2018_04_16_01_07_09_482.gif

おまけ

上の画像のようにテキストに影をつける場合、
テキストのInspectorビューの下部のAdd Component -> 検索欄にShadowと入力 -> Shadow で
くっきりとした影をつけることができる(位置調整、色、透明度の設定も可能)。

15
15
3

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
15
15