fc2ブログ
    08 «1.2.3.4.5.6.7.8.9.10.11.12.13.14.15.16.17.18.19.20.21.22.23.24.25.26.27.28.29.30.» 10

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

    株式会社ハルシオンシステムのメンバーが送る、UnityやらJavaやらの技術的話題から、自社開発のアプリの宣伝とかとかのブログです。ほんと気ままにいきたいと思います。更新日は毎週 月 木でっす!

     

    【Unity】Orthello2DとNGUIの組み合わせ 

    Orthello2Dを使用しながらのNGUIの使用。
    この構成で開発を行ってる方がいるかわかりませんが!
    これちょっと以下の問題あるんですよね。(そのままだと

    OrthelloのViewの設定、「Pixel Perfect Resolution」のXが480、Yが854にしています。
     Custom Sizeは428です。(縦画面の場合)
     これ、どこかで見た設定方法でうちでもこれでやってます。(おかしいと思った方は教えてください!)
    NGUIを使用すると・・・・・



    Gameには出てるのに、Sceneには見当たらない!!
    ってことですっごいズームするとあるんですよねー



    この紫の線が画面全体を意味してるわけで・・・
    Orthelloだと480x854のサイズになっているために、画面のサイズが合わないんですよねー

    で、同じ大きさにNGUIを設定してみました。

    NGUIのカメラを以下の設定に、
    「Size」を428に、「Viewport Rect」のWを480に、Hを480(!?)に。
    なんでこうなるんだろう?Wの480はなんとなくわかるんですが、Hが480!?
    まぁこれで一応Orthelloの画面サイズと合います。
    んで、UI Root (2D)の下にある「Anchor」のサイズXを480、Yを480に・・・・


    えぇ よくわかってないですw

    一応これでGameとSceneの大きさが同じになりました・・・
    正しいやり方教えてください!!

    Category: 開発日記(Unity)

    Tag: Unity  Orthello  NGUI 
    tb 0 : cm 0   

    【Unity】Unity&Orthelloによる2Dゲーム作成⑤ 

    はいはーい 月曜の坂内っす。

    ちょっとしたOrthelloを使用した時のコツを。

    普通のオブジェクトの場合、iTweenを使用することで簡単に透明度を変更できます。
    透明度を1⇒0⇒1と繰り返すことで、オブジェクトの点滅を実装することができます。

    cubeというオブジェクトを作成し、マテリアルを張ります。
    透過が可能なShaderを指定します。
    そして、以下のコード書くことでcubeオブジェクトの点滅が可能になります。
    void Start(){
    GameObject cube = GameObject.Find("cube");
    iTween.ColorTo(cube,iTween.Hash("a",0,"looptype","pingpong","time",2f));
    }

    上記コードの説明をしますと、「cubeオブジェクトの色要素 a (アルファは透過度)を2秒かけて0にする。
    0になったら今度は2秒かけて1にする(pingpongによって動作を繰り返す)」となります。

    これで簡単に点滅が可能です。

    しかし!BUT!!!
    OrthelloSpriteは上記と同じことを行うとエラーがでてしまいます。
    Material doesn't have a color property '_Color'
    UnityEngine.Material:GetColor(String)
    iTween:GenerateColorToTargets() (at Assets/iTween/Plugins/iTween.cs:3338)
    iTween:GenerateTargets() (at Assets/iTween/Plugins/iTween.cs:3144)
    iTween:TweenStart() (at Assets/iTween/Plugins/iTween.cs:4603)
    c__Iterator7:MoveNext() (at Assets/iTween/Plugins/iTween.cs:6567)

    ナゼカ?

    エラーをみると、Colorプロパティが無いといわれます。
    そう、OrthelloSpriteではShaderが「mobile/Particles/Alpha Blended」になるため、Colorプロパティが存在しないからです。

    しかし、よく見るとOTSpriteの中に「Alpha」というプロパティが存在します。


    これを0⇒1⇒0とすることで、点滅を実装することが可能です。

    では、どのようにこれをいじるのか?

    iTweenのメソッドには「ValueTo」というものが用意されています。
    これは、値をaからbにするというもので、使い方は以下のように使います(たぶん)。
    void Start(){
    GameObject cube = GameObject.Find("cube");
    iTween.ValueTo(gameObject,iTween.Hash("from",0,"to",1,
             "time",2f,"onupdate","ValueChange"));
    }

    void ValueChange(float value){
    print (value);
    }
    0から1まで2秒かけて変わる。


    となります。
    これを踏まえて、以下のようにコードを書けば・・・・
    using UnityEngine;
    using System.Collections;

    [ExecuteInEditMode]
    public class Test : MonoBehaviour {

    OTSprite cubeSprite;

    void Start(){
    cubeSprite = GameObject.Find("cube").GetComponent();
    iTween.ValueTo(gameObject,iTween.Hash("from",0,"to",1,"time",2f,
    "looptype","pingpong","onupdate","ValueChange"));
    }

    void ValueChange(float value){
    cubeSprite.alpha = value;
    }
    }

    こんな感じで、OrthelloのSpriteを点滅することができます。

    以上!なにかのお役に立てたらこれ幸い。

    Category: 開発日記(Unity)

    Thread: 日記

    Janre: 日記

    Tag: Android  Unity  Orthello  ゲーム  Sprite  iTween 
    tb 0 : cm 0   

    【Unity】Unity&Orthelloによる2Dゲーム作成④ 

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

    ええと、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: 日記

    Tag: Orthello  Android  Unity  Sprite  texture  アトラス  textureAtlas  ボタン 
    tb 0 : cm 0   

    【Unity】Unity&Orthelloによる2Dゲーム作成③ 

    はい、こんにちわ。坂内です。
    本日の題は「Unity&Orthelloによる2Dゲーム作成其の3」です。

    アニメーションについて、ちょちょっと書いてみます。

    Orthelloには、AnimatingSpriteというものがあります。
    これ、アニメーション用のSpriteっぽいっす。
    オブジェクトとしては、コレ使います。

    では順番に説明をば。(間違えていたら指摘プリーズ!

    ①「Orthello」⇒「Sprite」⇒「Animation」をHierarchyに追加します。
      このAnimationはSpriteのアニメーション自体を管理するもののようです!


    ②今回はこんな感じの適当な絵を用意しました!

     立ち絵・パンチ・キックの3種類のアニメーションです。(適当でスイマセン
     これをまずは前々回の通りSpriteAtlasに読み込みます。
     SpriteAtlasについては前々回の「Unity&Orthelloによる2Dゲーム作成①」を参照。

    ③次に、①で追加したAnimationのInspectorのFramesetsをアニメーションの数設定します。
     今回は「立ち」「パンチ」「キック」の3種類のため、FramesetsにSizeに「3」を設定。
     Sizeに3をセットすることにより、その下にElementsが3個追加されます。
     それぞれのElementsのNameにアニメーション名を設定します。今回は「stand」「punch」「kick」に
     してみます。


    ④各種アニメーションに、どの絵を使うかを指定します。
     ③で作成したElementsのContainerに②で指定したAtlasを指定します。
     それと、スタートフレーム、エンドフレーム(アニメーションのフレームを指定)
     立ちポーズはSpriteAtlasでは、8,9,10,11,12の絵になるので、Start Frameに「8」を、
     End Frameに「12」を指定します。

    ⑤で、アニメーションの指定はスクリプトで「OT.AnimatingSprite("オブジェクト名").Play("アニメーション名");」とすることで動かすことができます。
    using UnityEngine;
    using System.Collections;

    public class PlayerScript : MonoBehaviour {

    void Start () {
    OT.AnimatingSprite("Player").PlayLoop("stand");
    }

    void Update () {

    }
    }


    ⑥では、スペースボタンを押すとキックをするようにしてみましょう。

    void Update () {
    if(Input.GetButtonUp("Jump")){
    OT.AnimatingSprite("Player").PlayOnce("kick");
    }
    }


    なんかそれっぽくなりましたね!

    これ、キックのアニメのあと、止まってしまうけど、もとのStandアニメーションにするのはどうするんだろうか!
    キックのアニメーションが終わったタイミングでうまくスタンドのアニメーションに戻す方法なにかいい方法をお持ちの方教えて下さい!
    ってことで、本日のブログは終了です!

    Category: 開発日記(Unity)

    Thread: 日記

    Janre: 日記

    Tag: Orthello  Android  ゲーム  2Dゲーム  Unity  Sprite 
    tb 0 : cm 0   

    【Unity】Unity&Orthelloによる2Dゲーム作成② 

    月曜担当の坂内です。暑い日が続いています。
    倒れないように水分はこまm(ry

    ええと、Orthelloによる2Dゲーム作成第2弾ということで、
    Spriteの移動について簡単に書いていきたいと思います。

    Unityにおける、オブジェクトの基本的な移動は以下になります。

    ◆オブジェクトに必ずついている、Transformコンポーネントのposition
     の値を変更する。
     
     ●gameObject.transform.Translate(new Vector3(1,1,0));
      Translateという命令で引数のVector3方面への移動。
      上記の例だと、x方向に1、y方向に1進めという意味。
     ●gameObject.transform.position = new Vector3(100,0,10);
      transformpositionにVector3の位置を代入。
      gameObjectの場所をVector3の位置に移動。
     などの方法で移動させます。
     
    ◆オブジェクトについている、Rigidbodyコンポーネントに力を加える。
     ●gameObject.rigidbody.AddForce(new Vector3(10,5,1));
      rigidbodyにVector3の力を加える。
     他
     
    となります。

    次に、iTweenを使った、移動方法をば。

    iTweenの基本的な使い方は以下になります。

    iTween.MoveTo(オブジェクト,iTween.Hash(ほにゃらら));
    iTween.MoveFrom(オブジェクト,iTween.Hash(ほにゃらら));
    ◆iTween.MoveAdd(オブジェクト,iTween.Hash(ほにゃらら));
    など。

    ほにゃららのところには直接iTween.Hash()を書く方法と、
    HashTableを作成して書く方法があります。

    (testという名のオブジェクトを移動する場合)

    void Update () {
    // スペースキーをおしたよ.
    if(Input.GetButtonUp("Jump")){
    Hashtable hash = new Hashtable ();
    hash.Add("x",50f);           //①
    hash.Add("time",1f);          //②
    hash.Add("easetype",iTween.EaseType.easeInOutBack); //③
    iTween.MoveAdd(GameObject.Find("test"),hash); //④
    }
    }




    void Update () {
    // スペースキーをおしたよ.
    if(Input.GetButtonUp("Jump")){
    iTween.MoveAdd(GameObject.Find("test")
          ,iTween.Hash("x",50f,"time",1f,"easetype"
          ,iTween.EaseType.easeInOutBack));
    }
    }



    ①移動する座標をx座標50として指定。
    ②移動する時間を1秒として指定。
    ③移動する際の動き方をeaseInOutBackとして指定。
     他にもいろいろな動き方があります。
    ④MoveAddにて、上記の動きを追加。
     MoveAdd Hashの動きを追加。
     MoveTo Hashの場所へ移動。
     MoveFrom Hashの場所から今の場所へ移動。(?)
    という感じで使用できます。

    この際、注意として、Orthelloを使用していると、transformpositionとは別に、
    OTSpriteのpositionが存在しています。
    移動した際には、iTweenまたはtransformでの移動後に、以下のコードを追加しないと
    うまく動かない場合があります!(動く時とうまく動かない時の違いがわからない・・・)

    OT.Sprite("オブジェクト名").position = オブジェクト.transform.position;

    以上でUnityにおけるオブジェクトの動き方メモ終了!!

    さぁ、これでゲーム作成に1歩近づきましたね!

    (使い方間違えている等の指摘ありましたらお願いします!)

    Category: 開発日記(Unity)

    Thread: 日記

    Janre: 日記

    Tag: iTween  Orthello  Android  ゲーム  2Dゲーム  Unity  transform  position  Rigidbody 
    tb 0 : cm 0