ハルシオンシステムの気ままBlog

【Unity】Unity&Orthelloによる２Ｄゲーム作成④

こんにちわ。
坂内です。月曜休みということで火曜になっちゃいました。

ええと、Unityにおける「ボタン」についてちょっと私見を。

ボタンを画面に置きたい場合、GUI.Buttonを使うといいようなことが、色々なホームページでみることがあります。
で、使ってみたんですが、以下の問題が発生！

まずGUIを使うと画面に表示されなくて、分かりずらい！
実行しないと確認ができない！という感じに。

これ、OnGUIを使うクラスの上に、[ExecuteInEditMode]をつけると実行しなくても見えるようになりますね。


using UnityEngine;
using System.Collections;

[ExecuteInEditMode]
public class Test : MonoBehaviour {
	void OnGUI(){
		GUI.Button(new Rect(100,100,100,100),"test");
	}
}

この問題は収束。

次の問題、画面解像度によって位置の変更や、サイズの変更。
そして文字サイズの変更が必要になる！

これ、ちょーめんどいです。
これ対応しないと、GalayxS3のような画面解像度が高い携帯だととんでもなくボタンも文字も小さくなってしまいます！

で、GUIやめました。

では、どのようにボタンを表現しているかといいますと、Orthelloの場合はSpriteを置いて、Rayを使用しています。

RayとRaycast。これ何かといいますと。
「空間内の指定した原点から特定の方向に伸びる線のことを光線と呼びます。光線は、その名前の通りのイメージです。空間上の任意の開始点から、特定の方向に無限に伸びる線を値として表現できます。」
どこかの引用。

ということで、タップした座標から奥に向けてビームを打ちます。
これにオブジェクトが当たったら「ボタン押した」とか「ボタン離した」の判定をします。

ボタン押した時と離した時の処理を書くことで、ボタンの動きを表現できます。
以下、ボタンの例です。


using UnityEngine;
using System.Collections;

public class ButtonTest : MonoBehaviour {
	const int BTN_A = 0;
	const int BTN_A_PUSH = 1;
	bool btnAPushFlg = false; 
	Ray ray;
	RaycastHit hit;
	
	void Update () {
		if(Input.GetMouseButtonDown(0)){
			ray = Camera.main.ScreenPointToRay(Input.mousePosition);
			if(Physics.Raycast(ray , out hit)){
				// testボタン押下.
				if(hit.transform.name == "btnTest"){
					btnAPushFlg = true;
					OT.Sprite("btnTest").frameIndex = BTN_A_PUSH;
				}
			}
		}
		if(Input.GetMouseButton(0)){
			ray = Camera.main.ScreenPointToRay(Input.mousePosition);
			if(Physics.Raycast(ray , out hit)){
				// testボタンおしっぱ.
				if(hit.transform.name == "btnTest" && btnAPushFlg){
					btnAPushFlg = true;
					OT.Sprite("btnTest").frameIndex = BTN_A_PUSH;
					return;
				}
			}
			btnAPushFlg = false;
			OT.Sprite("btnTest").frameIndex = BTN_A;
		}
		if(Input.GetMouseButtonUp(0)){
			ray = Camera.main.ScreenPointToRay(Input.mousePosition);
			if(Physics.Raycast(ray , out hit)){
				// testボタン離す.
				if(hit.transform.name == "btnTest" && btnAPushFlg){
					btnAPushFlg = false;
					OT.Sprite("btnTest").frameIndex = BTN_A;
					// ここにボタン押した時の処理を書く.
				}
			}
		}
	}
}

こんな感じでやってます。

説明をば。

初めの、
const int BTN_A = 0;
const int BTN_A_PUSH = 1;
ですが、これはテクスチャアトラスの番号です。
ボタン系の絵はすべてアトラスで管理しています。
0は押されていない時のボタンの絵。1は押されている時のボタンの絵になっていることを想定しています。
アトラスを使わず、別々のテクスチャとして用意した場合は以下のように書き換えて下さい。


using UnityEngine;
using System.Collections;

public class ButtonTest : MonoBehaviour {
	public Texture2D BTN_TEST;
	public Texture2D BTN_TEST_PUSH;
	bool btnAPushFlg = false; 
	Ray ray;
	RaycastHit hit;
	
	void Start(){
		OT.Sprite("btnTest").texture = BTN_TEST;
	}
	
	void Update () {
		if(Input.GetMouseButtonDown(0)){
			ray = Camera.main.ScreenPointToRay(Input.mousePosition);
			if(Physics.Raycast(ray , out hit)){
				// testボタン押下.
				if(hit.transform.name == "btnTest"){
					btnAPushFlg = true;
					OT.Sprite("btnTest").texture = BTN_TEST_PUSH;
				}
			}
		}
		if(Input.GetMouseButton(0)){
			ray = Camera.main.ScreenPointToRay(Input.mousePosition);
			if(Physics.Raycast(ray , out hit)){
				// testボタンおしっぱ.
				if(hit.transform.name == "btnTest" && btnAPushFlg){
					btnAPushFlg = true;
					OT.Sprite("btnTest").texture = BTN_TEST_PUSH;
					return;
				}
			}
			btnAPushFlg = false;
			OT.Sprite("btnTest").texture = BTN_TEST;
		}
		if(Input.GetMouseButtonUp(0)){
			ray = Camera.main.ScreenPointToRay(Input.mousePosition);
			if(Physics.Raycast(ray , out hit)){
				// testボタン離す.
				if(hit.transform.name == "btnTest" && btnAPushFlg){
					btnAPushFlg = false;
					OT.Sprite("btnTest").texture = BTN_TEST;
					// ここにボタン押した時の処理を書く.
				}
			}
		}
	}
}

変わった場所わかりにくいですかね。
OT.Sprite("btnTest").frameIndex ⇒　OT.Sprite("btnTest").texture
に変わりました。
それと、はじめのアトラスのインデックスがTexture2Dになりました。
これ、ボタンの絵をそれぞれアサインしといてください。

①ダウン時
　ボタンのSpriteが押された時の処理として、フラグをたて、絵を変えます。
②おしっぱ時（そのボタンが押されているフラグが立っている時）
　ボタンのSpriteがおしっぱの時は絵を押されたものとして表示しておきますが、
　タップされたままボタン以外のところに指が行ってしまった場合は、フラグを落とし、絵も押されていない状態に戻します。
③離した時（そのボタンが押されているフラグが立っている時）
　ここで実際の押された時の処理を書きます。
　
どうでしょう？ボタン押された時っぽい動きになりますよ！

ということで、ボタンこれでやってます。
他にいい案ありましたらご教授くださいませ！

以上！今日のブログでした！

Category: 開発日記（Unity）

Thread: 日記

Janre: 日記