Android
Unity
アプリ内課金
ゲーム制作

Unity でブロック崩しを作る際に使用する標準コンポーネント

この記事では、Unity でブロック崩しを作る際に使用する標準コンポーネントについて紹介します。

itemstore BLOG で連載している
【いますぐ始めるアプリ内課金】第4回:Unityで開発を進める
の補足になりますので、併せてお読みください。

上記のブログ記事にて、教材となるプロジェクトファイルのダウンロードURLを案内していますので、興味のある方はダウンロードしてみてください。

Unity でブロック崩しを作る際に使用する独自コンポーネントについては、以下の記事にて紹介しています。

Unity でブロック崩しを作る際に使用する独自コンポーネント

ブロック崩しで使用する標準コンポーネントの紹介

画像の表示、衝突などの物理挙動の演算、ボタンなど良く使われる機能は Unity 標準のコンポーネントで簡単に実現することができます。
今回は、教材で使用している Unity 標準のコンポーネントを紹介します。

Sprite Renderer コンポーネント

ボールやブロックの画像を表示するコンポーネントです。
画像は png などで用意しておき、それを Project タブの Assets フォルダ以下に配置しておきます。
あとは、 Sprite Renderer の Sprite にその画像を割り当てるだけでそのゲームオブジェクトの位置に画像が表示されます。

01-1-ボールの SpriteRenderer の設定

Sprite Renderer コンポーネントは inspector の「Add Component」ボタンを押した後、Sprite Renderer を選択することでゲームオブジェクトに追加できます。

全てのコンポーネントは同じ方法で追加することができますが、 Sprite Renderer で画像を表示するゲームオブジェクトを作る場合は、project タブの画像を Scene タブにドラッグアンドドロップしたほうが簡単です。

これについては、Unityを使ったAndroid向け課金ゲームアプリの画面作成に関する初歩的な情報 - Qiitaで図説しているので参考にしてください。

Rigidbody2D コンポーネント

物理挙動のコンポーネントです。
ボールが壁などに衝突して跳ね返る動作はこのコンポーネントの働きです。
衝突の物理挙動を得るためにはこのコンポーネントのほかに、後述の Collider2D コンポーネントにより衝突を検知する必要があります。

ボールのように衝突した際の物理挙動を再現したい場合は、Body Type に Dynamic を選択します。
壁のようにボールが衝突してもまったく動かないようにするには、Body Type に Kinematic や Static を選択します。

02-1-Rigidbody2Dのbody type

また、Constraints の Freeze Position や Freeze Rotation で X, Y, Z 軸ごとに固定させることもできます。
例えば Z 軸にチェックをいれると、衝突したときにゲームオブジェクトは回転しないで移動します。

Collider2D コンポーネント

衝突を検知するためのコンポーネントです。
円形、四角形、多角形とさまざまな形に対応した Collider2D があります。
キャラクターの形にあったものを選びましょう。

教材では、ボールには円形の CircleCollider2D を、バーやブロックには四角形の BoxCollider2D を付加しています。

03-1-形に応じたCollider2D

これにより物体同士が衝突したり、OnCollisionEnter2D などの衝突イベント関数が呼ばれるようになります。

[Is Trigger] にチェックをいれると、物理的な衝突ではなく、ただ接触を感知するだけになります。
このときは OnCollisionEnter2D ではなく OnTriggerEnter2D という異なるイベント関数が呼ばれます。

教材では、ボールが画面下に落ちたことを感知するためのゲームオーバー領域で [Is Trigger] にチェックをいれています。

04-1-ゲームオーバー領域はIsTriggerをチェック

Button コンポーネント

ボタンを表示する uGUI のコンポーネントです。
uGUI は Unity のユーザーインターフェースのシステムです。
ユーザインターフェースにはボタン(Button)のほかに、後述するテキスト(Text)やイメージ(Image)があります。

ボタンはメニュー[GameObject]->[UI]->[Button] で作成できます。
ボタンを作成するとイメージやテキストも付加され、ボタンの見た目をイメージやテキストの設定で変えることができます。

05-1-ボタンの構成とコンポーネント

ボタンには「On Click」というイベントが設定できます。
ここで選択したゲームオブジェクトの持つコンポーネントの関数は、ボタンが押されたときに呼び出されます。

上の図では実行時にシーンに配置されている TitleScene というゲームオブジェクトの持つコンポーネントの OnButtonShop という関数が呼び出されるように設定されています。
関数に引数がある場合は、引数を指定することもできます。

Text コンポーネント

文字列を表示する uGUI のコンポーネントです。
さきほどのボタンでは、ボタンに表記する文字列を設定するために配置されていました。
Text コンポーネントは単独で、説明文などをいれる場合にも利用できます。

メニュー [GameObject]->[UI]->[Text] から作成できます。

06-1-テキストコンポーネント

文章を設定するだけではなく、フォントや色や大きさ、右寄せ・中央寄せなどのレイアウトも設定することができます。

Image コンポーネント

画像を表示する UI のコンポーネントです。
SpriteRenderer も画像を表示しますが、こちらは uGUI というボタンなどと同じ系統のコンポーネントです。

メニュー [GameObject]->[UI]->[Image] から作成できます。

07-1-タイトル画像を表示するImageコンポーネント

Project に追加した画像ファイルを選択すると、その画像が表示されます。

Panel

Panel というコンポーネントは存在しませんが、 メニュー[GameObject]->[UI]->[Panel] から作成することができます。
実態は Image コンポーネントですが、作成した直後に画面全体に半透明の単色の画像として配置されるので、パネルとして使いたい場合は Image ではなくPanel を選択すると良いでしょう。

ステージ開始直後の「TOUCH TO START」を表示しているパネルでは、タッチしたイベントを受け取るために Event Trigger コンポーネントを付加しています。
Event Trigger コンポーネントではさまざまなイベントをそのゲームオブジェクトが受け取れるようになります。

08-1-パネルに PointerDown イベントを設定

今回の例では、タッチしたことを知るために「Pointer Down」というイベントを設定しました。
タッチされるとこのイベントが反応し、 StageCommonScene.cs のプレイ開始の関数が呼び出されます。

参考リンク