【Unity NGUI】ボタンの作成・テクスチャアトラスの作成

Unityを再度チャレンジすることにしました。(何回目か分からないが) 時間は短いですが、毎日空いた時間にちょっとづつしていきたいと思います。

目標は2つ。

  • 3Dは考えずに、まずは、2Dでゲームを作成すること
  • 「あぷまがないと」で「ハコスコ」を頂いたので、これを利用するモノを作る

第一回目は、[NGUI]の勉強です。 今年の1月頃にちょっと勉強していたのですが、完全に忘れているのでもう一度やってみます。

Buttonの配置

UI ROOT

まずは、NGUIの土台になる[UI ROOT]を作成します。 [Create]->[2D UI]を選択します。

2014-8-27-das

これで[UI ROOT]が完成しました。

2014-8-27-dsaa

Buttonの作成

先ほど作成した[UI ROOT]にButtonを作成していきます。 [Open]->[Widget Wizard]を選択します。

2014-8-27-dsssa

Buttonを作成する場合、[Template]を[Button]に合わせます。

2014-8-27-dsaa

[Background]は、ボタンで利用する画像のことです。 好きな画像を選択します。

2014-8-27-dsaas

これでボタンの作成が完了しました。

2014-8-27-dasas.png

Buttonの設定

ボタンの簡単な設定です。

ボタンの色・画像の変更

ボタンを押した時などに画像を変更する場合は以下の項目をいじります。

2014-8-27-dasa.png

ボタンを押した時の反応

ボタンを押した時には何かしらのアクションが必要になります。 その際は、以下の箇所に「アクションをさせるオブジェクト」を指定します。

2014-8-27-dllasa.png

後は、指定したオブジェクトにある「スクリプト」から呼び出すメソッドを選択するだけです。

テクスチャアトラスの作成

先ほどのボタンなどの作成で利用をした[Background]の画像は、一枚のテクスチャから選択しています。 これを「テクスチャアトラス」と呼びます。 このテクスチャを作成は以下のように行います。

[Open]->[Atlas Maker]を選択します。

2014-8-27-dasdas.png [Atlas Maker]の画面上にある[New]を選択します。
2014-8-27-dsaa

テクスチャアトラスに必要な画像データを選択します。 事前にUnityのProjectに画像を追加して下さい。

2014-8-27-dsasa

そうすると、[Atlas Maker]の画面上に選択された画像ファイルが追加されます。

2014-8-27-dsaa

後は、[Create]を押して、テクスチャアトラスの名前を決めて上げれば完了です。

既存のテクスチャアトラスに画像を追加する

途中で、新しい画像を追加する場合は以下のように行います。

[Open]->[Atlas Maker]を選択します。 画像を追加するテクスチャアトラスを選択します。

2014-8-27-dasasadvv

[Project]から、追加をする画像データを選択します。

2014-8-27-dsasa

そうすると、[Atlas Maker]の画面上に選択された画像ファイルが追加されます。 [Add/Update]を押せば、完了です。

2014-8-27-dsaa.png

最後に

まだ、書く内容はあるのですが長くなりそうなので止めておきます。 まずは、cocos2dxでも勉強した[チュートリアル | studycocos2dx]の内容がUnityではどうすればいいのか?を勉強していきたいと考えています。

Unityゲーム開発 オンライン3Dアクションゲームの作り方Unityゲーム開発 オンライン3Dアクションゲームの作り方
竹内 大五郎,石黒 赳彦,高橋 誠史,香川 寛和,河本 健太郎

SBクリエイティブ
売り上げランキング : 670

Amazonで詳しく見る