nagano

2014.01.08

Unity 4.3触ってみた

こんにちは。システム部の長野です。
ブログのデザインがリニューアルして初めて書きます。

リニューアルに伴ってメンバー紹介ページができました。
そこではJavaScriptを中心に、、と書いたのですが、
最近Unityを触ってみたので今回はそのことについて書きます。

なぜUnityか

Unityは元々マルチプラットフォーム向けにゲーム開発ができるツールであったことに加えて、
2013年5月に個人・小規模開発者向けのモバイル向け機能が完全無償化され、
2013年11月にリリースされたバージョン4.3では2D向けの開発ツールが含まれたり、
さらにスクリプト言語もUnityScriptというJavaScriptにかなり似ている言語になっています。
(他にもC#やBooと言った言語も使えます)

つまり、Unityを勉強すれば~~個人的にiPhoneやandroidでバリバリ2D/3Dなゲームを作って売れる！~~次の社内向け新事業ハッカソンでUX&UIの高いネイティブアプリが作れる！
という思いからです。

とりあえず動くものを作ろう

これが無いとブログのネタにできないので、簡単なスクリプトのサンプルを作ってみました。
今回は
・4.3から実装された2D開発ツール
・元々ビルトインされている物理エンジン
を使って、2Dの玉を飛ばして建物を破壊する某人気ゲームのようなサンプルを作ってみました。

サンプル

※閲覧するにはUnity Web Playerのインストールが必要です。

左にある緑の玉をマウスでドラッグして離すとドラッグの反対方向に飛びます。
玉は何度でも飛ばすことができます。

スクリプト解説

今回書いたスクリプト全文です。

基本的にオブジェクトの初期配置やphysicalな属性を持たせる等はすべてGUIで行い、
スクリプトに記載したのは「玉をマウスでドラッグアンドドロップして飛ばす」という処理のみになります。
このオブジェクトの配置とロジックを分けることができる辺りはFlashに似ていると思いました。

このスクリプトにinit.jsという名前をつけて、Hierarchy内に作成した空のGameObjectに関連づけています。(詳しくは以下の画像を参照ください)

init.js

#pragma strict

var onMouseDownFlg:int;
var direction:Vector2;
var mouseDownPoint:Vector2;
var ballObj:GameObject;

function Start () {
  Application.targetFrameRate = 120;
  onMouseDownFlg = 0;
  ballObj = GameObject.Find("tama");
}

function Update() {
  //マウスが押されたとき
  if(Input.GetMouseButtonDown(0)) {
    var mouseInput : Vector2 = Input.mousePosition;
    var tapPoint : Vector2 = Camera.main.ScreenToWorldPoint(mouseInput);
    var collition2d : Collider2D = Physics2D.OverlapPoint(tapPoint);
    var hitObject : RaycastHit2D = Physics2D.Raycast(tapPoint, -Vector2.up);

    if (hitObject.collider.gameObject == ballObj) {
      onMouseDownFlg = 1;
      mouseDownPoint = mouseInput;
    }
  //マウスが離されたとき
  }
  if(Input.GetMouseButtonUp(0)){
    if(onMouseDownFlg){
      onMouseDownFlg = 0;
      ballObj.rigidbody2D.AddForce(direction);
    }
  }

  //マウスが押されっぱなしのとき
  if(onMouseDownFlg){
    var xforce:float;
    var yforce:float;
    xforce = mouseDownPoint.x - Input.mousePosition.x;
    yforce = mouseDownPoint.y - Input.mousePosition.y;

    if(xforce &gt; 1000) xforce = 1000;
    if(xforce &lt; -1000) xforce = -1000;     if(yforce &gt; 1000) yforce = 1000;
    if(yforce &lt; -1000) yforce = -1000;

    direction = Vector2(xforce, yforce);

    debug.setText("mouseDownPoint = x:" + mouseDownPoint.x
     + "\n"+"mouseDownPoint = y:" + mouseDownPoint.y
     + "\n"+"mousePoint = x:" + Input.mousePosition.x
     + "\n"+"mousePoint = y:" + Input.mousePosition.y
    );
  }

}

#pragma strict

var onMouseDownFlg:int;

var direction:Vector2;

var mouseDownPoint:Vector2;

var ballObj:GameObject;

function Start () {

Application.targetFrameRate = 120;

onMouseDownFlg = 0;

ballObj = GameObject.Find("tama");

}

function Update() {

//マウスが押されたとき

if(Input.GetMouseButtonDown(0)) {

var mouseInput : Vector2 = Input.mousePosition;

var tapPoint : Vector2 = Camera.main.ScreenToWorldPoint(mouseInput);

var collition2d : Collider2D = Physics2D.OverlapPoint(tapPoint);

var hitObject : RaycastHit2D = Physics2D.Raycast(tapPoint, -Vector2.up);

if (hitObject.collider.gameObject == ballObj) {

onMouseDownFlg = 1;

mouseDownPoint = mouseInput;

}

//マウスが離されたとき

}

if(Input.GetMouseButtonUp(0)){

if(onMouseDownFlg){

onMouseDownFlg = 0;

ballObj.rigidbody2D.AddForce(direction);

}

//マウスが押されっぱなしのとき

if(onMouseDownFlg){

var xforce:float;

var yforce:float;

xforce = mouseDownPoint.x - Input.mousePosition.x;

yforce = mouseDownPoint.y - Input.mousePosition.y;

if(xforce > 1000) xforce = 1000;

if(xforce < -1000) xforce = -1000; if(yforce > 1000) yforce = 1000;

if(yforce < -1000) yforce = -1000;

direction = Vector2(xforce, yforce);

debug.setText("mouseDownPoint = x:" + mouseDownPoint.x

+ "\n"+"mouseDownPoint = y:" + mouseDownPoint.y

+ "\n"+"mousePoint = x:" + Input.mousePosition.x

+ "\n"+"mousePoint = y:" + Input.mousePosition.y

);

}

初期処理

  function Start () {
    Application.targetFrameRate = 120;
    onMouseDownFlg = 0;
    ballObj = GameObject.Find("tama");
  }

function Start () {

Application.targetFrameRate = 120;

onMouseDownFlg = 0;

ballObj = GameObject.Find("tama");

}

このStartという関数が初めに呼ばれます。
ここでは画面内の緑のボールオブジェクトをballObjグローバル変数にセットします。
インスペクタで関連付けることもできますが、
今回インスペクタの解説はしないためあえてここに書きました。

マウスクリック時の処理

  if(Input.GetMouseButtonDown(0)) {
    var mouseInput : Vector2 = Input.mousePosition;
    var tapPoint : Vector2 = Camera.main.ScreenToWorldPoint(mouseInput);
    var collition2d : Collider2D = Physics2D.OverlapPoint(tapPoint);
    var hitObject : RaycastHit2D = Physics2D.Raycast(tapPoint, -Vector2.up);

    if (hitObject.collider.gameObject == ballObj) {
      onMouseDownFlg = 1;
      mouseDownPoint = mouseInput;
    }
  }

if(Input.GetMouseButtonDown(0)) {

var mouseInput : Vector2 = Input.mousePosition;

var tapPoint : Vector2 = Camera.main.ScreenToWorldPoint(mouseInput);

var collition2d : Collider2D = Physics2D.OverlapPoint(tapPoint);

var hitObject : RaycastHit2D = Physics2D.Raycast(tapPoint, -Vector2.up);

if (hitObject.collider.gameObject == ballObj) {

onMouseDownFlg = 1;

mouseDownPoint = mouseInput;

}

Updateという関数はフレーム毎に呼ばれ、
クリックイベントの捕捉はこの関数内で行います。
まず、マウスがクリックされたときに

Input.GetMouseButtonDown(0)

1	Input.GetMouseButtonDown(0)

の判定がtrueになり、中の処理に入ります。
続いて、

var mouseInput : Vector2 = Input.mousePosition;
var tapPoint : Vector2 = Camera.main.ScreenToWorldPoint(mouseInput);
var collition2d : Collider2D = Physics2D.OverlapPoint(tapPoint);
var hitObject : RaycastHit2D = Physics2D.Raycast(tapPoint, -Vector2.up);

var mouseInput : Vector2 = Input.mousePosition;

var tapPoint : Vector2 = Camera.main.ScreenToWorldPoint(mouseInput);

var collition2d : Collider2D = Physics2D.OverlapPoint(tapPoint);

var hitObject : RaycastHit2D = Physics2D.Raycast(tapPoint, -Vector2.up);

でクリックしたオブジェクトを取得します。
クリックしたオブジェクトがボールオブジェクトなら

if (hitObject.collider.gameObject == ballObj) {
  onMouseDownFlg = 1;
  mouseDownPoint = mouseInput;
}

if (hitObject.collider.gameObject == ballObj) {

onMouseDownFlg = 1;

mouseDownPoint = mouseInput;

}

の処理に入りonMouseDownFlgフラグを立ててポイントした座標を記録します。

マウスドラッグ時の処理

  if(onMouseDownFlg){
    var xforce:float;
    var yforce:float;
    xforce = mouseDownPoint.x - Input.mousePosition.x;
    yforce = mouseDownPoint.y - Input.mousePosition.y;

    if(xforce &gt; 1000) xforce = 1000;
    if(xforce &lt; -1000) xforce = -1000;     if(yforce &gt; 1000) yforce = 1000;
    if(yforce &lt; -1000) yforce = -1000;

    direction = Vector2(xforce, yforce);
  }

if(onMouseDownFlg){

var xforce:float;

var yforce:float;

xforce = mouseDownPoint.x - Input.mousePosition.x;

yforce = mouseDownPoint.y - Input.mousePosition.y;

if(xforce > 1000) xforce = 1000;

if(xforce < -1000) xforce = -1000; if(yforce > 1000) yforce = 1000;

if(yforce < -1000) yforce = -1000;

direction = Vector2(xforce, yforce);

}

  if(onMouseDownFlg){

1	if(onMouseDownFlg){

onMouseDownFlgのフラグでマウスがドラッグ中か判定します。

    var xforce:float;
    var yforce:float;
    xforce = mouseDownPoint.x - Input.mousePosition.x;
    yforce = mouseDownPoint.y - Input.mousePosition.y;

var xforce:float;

var yforce:float;

xforce = mouseDownPoint.x - Input.mousePosition.x;

yforce = mouseDownPoint.y - Input.mousePosition.y;

でクリック時に保存した座標から現在のマウス位置までの座標の差を取得します。
この距離が球を飛ばす力になるので、

    if(xforce &gt; 1000) xforce = 1000;
    if(xforce &lt; -1000) xforce = -1000;     if(yforce &gt; 1000) yforce = 1000;
    if(yforce &lt; -1000) yforce = -1000;

if(xforce > 1000) xforce = 1000;

if(xforce < -1000) xforce = -1000; if(yforce > 1000) yforce = 1000;

if(yforce < -1000) yforce = -1000;

でリミットをかけて想定以上の力で飛ばないようにします。

direction = Vector2(xforce, yforce);

1	direction = Vector2(xforce, yforce);

距離をvector2型に変換し、グローバル変数に格納します。

マウスアップ時の処理

  if(Input.GetMouseButtonUp(0)){
    if(onMouseDownFlg){
      onMouseDownFlg = 0;
      obj.rigidbody2D.AddForce(direction);
    }
  }

if(Input.GetMouseButtonUp(0)){

if(onMouseDownFlg){

onMouseDownFlg = 0;

obj.rigidbody2D.AddForce(direction);

}

マウスが放されたときに

  obj.rigidbody2D.AddForce(direction);

1	obj.rigidbody2D.AddForce(direction);

という関数を使ってdirectionの方向に力を加えます。
これでボールがその方向に向かって飛ぶようになっています。
また、ドラッグ中であることをやめるためにonMouseDownFlgのフラグも落とします。

最後に

解説は以上になります。
実際にゲームを作るとなると、オブジェクトの消滅やスコア、画面遷移やステージごとに初期配置を変える等
まだまだやらなくては行けないことがたくさんありますが、
上記のスクリプトだけでゲームのメインとなる「球を飛ばして建物を破壊する」ができてしまうのはすごいですね。

公式サイトでも(ほぼ英語ですが)リファレンスがそろっているので取っ付きやすく、
機会があれば弊社のサービスでも使ってみたいです。

nagano

サービス開発や社内インフラ等を担当しています。このブログではJavaScript周りのネタを中心に書いていきたいです。

RELATION ENTRY

naganoの記事一覧へ

▶︎

Unity 4.3触ってみた

なぜUnityか

とりあえず動くものを作ろう

スクリプト解説

init.js

初期処理

マウスクリック時の処理

マウスドラッグ時の処理

マウスアップ時の処理

最後に

RELATION ENTRY

HOT ENTRY

RECENT