2014年11月06日

ゲームのアップグレード (13) | UI CANVAS 導入してUIボタンをグレードアップ!解説編

前回時間なくって全然説明出来なかったんで、ちょっとだけ解説!

ストア画面を UI Canvas に移行
ストア画面も OnGUI の標準GUIで表示してた部分を、全部 UI Canvas にして、アニメーションを付けてみました。
これは、前にやったスタートボタンとほぼ同じ。
特に説明する事もないかな?
あっ、しいて言うならば、スプライトが乗っかってる事くらいかな?普通に子供で付けてます。
Screen Shot 2014-11-05 at 1.12.09 PM.png
Button の子供の obj が Sprite Render コンポーネントを持ってるだけ

あっっ!もう一つ。
ボタンが増えていろいろ面倒だったんで、Click 時の処理に引数を渡す様になりました!
OnClick2.png

赤丸の所に渡す引数を指定!
受け取り側のメソッドはこんな感じです。
Screen Shot 2014-11-05 at 1.17.58 PM.png

引数は一個だけの決まりで、渡せる型は、int, float, string, bool(もだったと思う), GameObject。
GameObject が指定出来るんで、ま、大概の事はできるんでないかな?


パワーアップ装備画面を追加
さて、今まで購入したパワーアップは強制的に使用する形だったんですが、一応プレイヤーも操作出来る様に、装備画面をゲームスタート前に追加しました。
で、出来上がりはこんな画面なんですが...
Screen Shot 2014-11-05 at 1.26.09 PM.png
こっちのボタンは、いままでも Button コンポーネントじゃなくて、Toggle コンポーネントを付けてます。
ま、パワーアップを装備する、しないの、ON/OFF を管理しないと駄目だったんで、Toggle に変えざるをえなかったんですけどねw
これが、Toggle コンポーネントの中身ね。
Screen Shot 2014-11-05 at 1.31.30 PM.png
Button とだいたい一緒なんだけど、こっちの方が、ステート管理に便利なプロパティがちょろちょろと実装されてますね!
Interactable が有効無効の管理。無効の時に、Disabled Color が使われます。
Is On が、自分自身が ON か OFF かのプロパティ。
残念だけど、このステートで色を変えてくれる訳じゃないみたいなんで、このステートをみて、Normal Color の色を他の管理クラスから変える様にしちゃいました。なんか他にちゃんとした動かし方があるのかもしれないけどね。

ゲームとしての処理は、アイテムの在庫がなかったら、Interactable を false にして無効化。
在庫があったらデフォルトは Is On が true で、なるべくアイテムを使ってもらう様に。
ミサイル数のパワーアップは、数が一番多いのを有効にして、3つのアイテムのうち1つしか選べない様にする。
つまり、Missilex8 が有効だった時に Missilex4 が選ばれたら Missilex8 を無効にする感じ。

さ、じゃ、アイテム管理のスクリプト側ね。
まず、UI Canvas 回りのコンポーネントを使うには、頭に1行追加が必要!
Screen Shot 2014-11-05 at 1.42.33 PM.png
この、2行目を呼んどかないと Text も Toggle も ColorBlock  も、全部エラーになっちゃうから忘れずに!

Button も Text も、いつもの SerializeField を使って Unity 側でセット。
で、その Button 配列に対して、ON/OFF をチェックして、こんな感じで色を変更。
Screen Shot 2014-11-05 at 1.44.32 PM.png

Color 型で Normal Color だけ変えたかったんだけど、ColorBlock 型じゃないと無理。

ま、そんな感じで Toggle 表示を管理してます。
一応動作してる動画ね。前回と同じだけど。


ちょっとだけ問題点も?
さて、まだ Beta だし入ったばっかりだし、自分も使い方間違ってそうなんだけど、UI Canvas でちょっと苦労した所を。
"LIFTOFF" って書いてあるスタートボタンなんだけど、ここの Image は "Sliced" イメージをつかってるんですよね。
"Sliced" は 9 sliced Sprite の事で、スケールかけたくない枠部分を奇麗に表示してくれるはずなんだけど、どうも上手くいかない。
Sprite Editor で、Borader の設定とかしても外周の部分もスケールされちゃう。
あげくの果てに変なボーダー値で、ようやくまともに表示されたり。こういう正方形じゃないスプライト表示に最適なはずなんですけどね。

さてもう一点。
さっきの問題を解決しようとして、元々横長のスプライトを作って実装してみたりもしたんだけど、この場合、コリジョンが上手く取れなくなる見たいんなんですよね。
基本、正方形のスプライトに対してのスケールでコリジョン判定になってんのかな?
別に、コリジョンサイズの設定、できないんですよね。
なんで、使うテクスチャは、正方形じゃないと、最終的に問題が出るはず。

でも、全体的にはホントに便利。4.6 にして、なんにも問題でなかったし!
4.6 おすすめです YO。

        にほんブログ村 ゲームブログ×PlayNCBlogへ
 初めてみました。よかったらクリックお願いね ♪


ニワトリがかわいくてオススメ!
posted by やまけん at 12:16| Comment(0) | Unity | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント: