Hatena::ブログ(Diary)

しんさんの出張所 はてな編 このページをアンテナに追加 RSSフィード

カレンダー
2007 | 12 |
2008 | 01 | 02 | 03 | 04 | 05 | 06 | 07 | 08 | 09 | 10 | 11 | 12 |
2009 | 01 | 02 | 03 | 04 | 05 | 06 | 07 | 08 | 09 | 10 | 11 | 12 |
2010 | 01 | 02 | 03 | 04 | 05 | 06 | 07 | 08 | 09 | 10 | 11 | 12 |
2011 | 01 | 02 | 03 | 04 | 05 | 06 | 07 | 08 | 09 | 10 | 11 | 12 |
2012 | 01 | 02 | 03 | 04 | 05 | 06 | 07 | 08 | 09 | 10 | 11 | 12 |
2013 | 01 | 02 | 03 | 04 | 05 | 06 | 07 | 08 | 09 | 11 | 12 |
2014 | 01 | 02 | 03 | 04 | 05 | 06 | 08 | 09 | 10 | 11 | 12 |
2015 | 02 | 03 | 04 | 05 | 06 | 07 | 09 | 10 | 11 |
2016 | 05 | 08 | 10 | 11 | 12 |
2017 | 01 | 02 | 06 | 08 | 11 |
2018 | 02 | 08 | 09 |

2018-09-12

[][]Unityメモ #4 画像を表示するコンポーネントの追加

今回はコードの説明は入りません。まずはUnityエディタ上でゲームオブジェクトに静的にコンポーネントを追加するところまでやります。

動作がわかりやすい画像を表示するコンポーネントを追加します。

画像を用意

まず画像を用意しておきます。

ここでは3種類用意しました。

Assetsフォルダ以下に配置してください。

f:id:shin:20180912221524p:image

これで準備は整いました。

コンポーネントの追加

まず前回同様何もないゲームオブジェクトを作成します。

f:id:shin:20180912221522p:image


ヒエラルキーウインドウで作成したゲームオブジェクト選択します。

f:id:shin:20180912221520p:image


インスペクタウインドウのAdd Componentボタンをクリックします。

f:id:shin:20180912221518p:image


その中からRenderingを選択し、

f:id:shin:20180912221515p:image


Sprite Rendererを選びます。

f:id:shin:20180912221514p:image

そうするとインスペクタウインドウにSpriteRendererコンポーネントが追加されました。


f:id:shin:20180912221512p:image

ただしまだ画像は設定していないため何も表示されません。

SpriteRendererコンポーネントのSpriteをみるとNoneとあるのがわかるかと思います。


画像の設定


SpriteのNoneとかかれた枠のさらに右側に丸いアイコンがあります。これをクリックすると以下のウインドウが表示されます。

f:id:shin:20180912221634p:image

ここで画像を選択してください。


シーンウインドウを見ると画像が描画されているのがわかります。

f:id:shin:20180912221632p:image


画像を移動

ついでに残り2つの画像も作りましょう。

ヒエラルキーウインドウに何も選択されていない状態なのを確認してから、それぞれ右クリックメニューでCreateEmptyをえらびましょう。

f:id:shin:20180912221630p:image

重なっていますね。


シーンウインドウドラッグして移動可能です。

重ならないようにそれぞれ動かしてみましょう。

f:id:shin:20180912221627p:image

移動しているとtransformコンポーネントのXとY座標(position)が変わっているのがわかるかと思います。

これがまず親子関係がない状態です。


保存

ここで作業が失われないようにいったんシーンの保存しましょう。

f:id:shin:20180912221625p:image


親子関係

ヒエラルキーウインドウドラッグすると既存のコンポーネントの親子関係が作れます。

f:id:shin:20180912221622p:image

移動後。

f:id:shin:20180912221620p:image


この状態で親のコンポーネント選択ドラッグで移動してみましょう。子のコンポーネントも一緒に移動しているのがわかりますね。

f:id:shin:20180912221617p:image

子のコンポーネントは親のコンポーネントからの相対的な座標を持つことになります。


ためしに、このコンポーネントのtransformでXY座標(position)ともに0を入れてみてください(数字を直接入力でも移動できます)。

f:id:shin:20180912221615p:image

親の中心座標と重なるように子が移動されます。

もちろん、親をドラッグすると子もついてきます。


ショートカット

画像を表示するのに毎回ゲームオブジェクトを作ってコンポーネントを追加するのだるいですね。

ショートカットがあります。

実はCreateEmpty以外はいわばすべてショートカットです。何らかのコンポーネントを追加したゲームオブジェクトを作るという動作になっています。

2D ObjectのSpriteというのがSpriteRendererコンポーネントを張り付けた状態のゲームオブジェクトを作成するというショートカットです。

f:id:shin:20180912221612p:image

先にショートカットの方を触ってしまうと、このコンポーネントとゲームオブジェクトの関係がかなり覚えにくいので、あえて遠回りさせました。

入門書をへたに見てしまうと独学だとこの辺の理解が遅れるかと思います。他の環境でプログラムはできるけど、Unity自体は初めてという人は今回の手順でゲームオブジェクトコンポーネントを理解したほうが良いかと思います。

プログラムそのものが初めての場合は、手っ取り早い入門書のほうが、ちゃんとした理解は置いといて、さくっと絵が出るのでおすすめでしょう。つまりこのblogの対象者ではないということです。

次回コンポーネントをコードから追加してみる予定です。

スパム対策のためのダミーです。もし見えても何も入力しないでください
ゲスト


画像認証

トラックバック - http://d.hatena.ne.jp/shin/20180912/p1