11
11

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Live2Dのサンプルに時計を追加する

Last updated at Posted at 2015-04-23

2015-04-09_00h21_581.png

##概要
Live2D SDKについているシンプルに時計の機能を追加します.
iPhone向けにGUIを設定してみます.

##開発環境

  • Live2D_SDK_Unity_2.0.07_1
  • Unity 4.6.4f1

##作り方

####プロジェクトの作成とLive2Dを描画
Unityで新しくプロジェクトを作成,
Setup defaults は 2Dに設定

http://sites.cybernoids.jp/cubism2/sdk_tutorial/platform-setting/unity/csharp/sampleapp1
を確認しながらモデルデータを描画してみます.

上記URLで行う作業の要約

Projectに「Editor」「Live2D」「Resources」「Scripts」フォルダ作る
以下,SDKに同梱されているsampleフォルダ/SampleApp1/Assets以下のフォルダ内のファイルをコピー
「Live2D」フォルダに Live2D SDK の 「Live2D」
「Scripts」フォルダに Live2D SDK の「Scripts」
「Editor」フォルダに、Live2D SDK の「Editor」フォルダ内にある「CreateCanvas.cs」
「Resoures」フォルダにLive2D SDK の「Resources/live2d」フォルダ内にある>haruフォルダをコピー

メニューバーの「Live2D」→「Create Live2D Canvas」で平面を作成
名前を「Live2D_Canvas_haru」に変更

LAppModelの設定
「Live2D_Canvas_haru」にアタッチされたLAppModelProxyの「Path」の項目に、Resourcesフォルダからモデル設定用JSONファイルまでのパス(上記の場合、"haru/haru.model.json")を入力
要約ここまで

あとは実行させながらお好みの大きさにしていきましょう
Live2D_Canvas_haruの例だと
Position Y -0.88
Scale XとZを0.47くらいにすると良さそうです

時計を追加してみる

GameObject>UI>Canvasでキャンバスを追加
UIの設定をします

InspectorからCanvas Scalerを編集
Ui Scale Mode Scale With Screen Size
Reference Resolution 640*1136
Screen Match Mode Expand
Reference Pixels Per Unit 100
に設定
2015-04-08_23h39_511.png

GameObject>UI>Textで時計を表示するためのTextを追加
InspectorからRect Transformを編集
PosX 0,PosY -118,PosZ 0
Width 500,Height 150
Anchorsをtop,centerに設定

InspectorからTextを編集
CharacterのFont Size 120
ParagraphのAlignment Center Align
Color white
2015-04-08_23h39_281.png

GameViewの設定でiPhone5として設定を追加します
2015-04-23_14h35_00.png

新しくスクリプトを作って,以下のように書きます

clock.cs
using UnityEngine;
using System.Collections;
using System; //DateTime
using UnityEngine.UI; //uGUI

public class clock : MonoBehaviour {
	public Text UiText;

	// Use this for initialization
	void Start () {
	}
	
	// Update is called once per frame
	void Update () {
	}

	void OnGUI()
	{
		UiText.text = DateTime.Now.ToString("HH:mm:ss");
	}
}

日付を取ってきて,さっきのUIにセットします
これをLive2D_Canvas_haruにアタッチして,inspectorでUiTextにCanvasの中にあるtextを設定

実行して動作を確認します.

11
11
0

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
11
11

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?