*

[Unity]Unity4.6 UIチュートリアル Lesson1.UI Canvas 日本語要約

公開日: : 最終更新日:2014/12/17 Unity

昨日、適当なリリースのTOPページの要約しただけで、ここにたどり着くワードがUnity4.6だらけに。
初めてのコメント(スパム)がつくぐらいの盛況具合。
OK、わかりました。皆が求めているのはUnity4.6だな。しかもそれの翻訳要約だな。

30分以上も動画みるのは面倒ですしね。しかも英語。

というわけでUnity4.6のチュートリアルをやって、内容を適当に翻訳、要約します。
意味合いが異なることがありますのでご了承ください。

早速インストール。

まずは本家のダウンロードページでダウンロード。
本家はこちら→http://unity3d.com/unity/download
Unity_

そんでダウンロード(1.2GB!)しながら、↓のURLにアクセスして、lesson 1.UI Canvasをクリック。
http://unity3d.com/learn/tutorials/modules/beginner/ui
Unity_

ダウンロードしながらのんびり動画を視聴します。

第一回はCanvasについての説明のようだ。

基本は全てキャンバスで、全てのUIはキャンバスの子になります。
キャンバスは一つのシーンに二つ以上置くことが出来ます。
キャンバスがないときに以下のようにボタンを作ろうとすると、Canvasが自動で作られて、子にボタンが作られます。
Unity_
Unity_

キャンバスはいくつかのRender Modeがあります。
Unity_

Screen Space – Overlayは基本的なRender modeで、画面がリサイズされても大きさが変わりません。
先ほど追加したボタンが左下にありますが、今は固定位置ですので、Buttonをクリックして、Rect TransformのAnchorsをクリックして、左下にアンカーしてみましょう。

Unity_
Unity_

そしてGameタブのFree Aspectを5:4にすると、ちゃんとボタンがくっついてきます。
Unity_

Screen Space – CameraはUI用のカメラを利用した立体的なRender modeです。
ためしにカメラを追加します。
Game ObjectからCameraを追加。
Unity_

次にCameraの名前を「UI Camera」に変更して、Clear FlagsDepth onlyCullingMaskUIにしておきます。
Unity_

そしてCanvasRenderCameraドラッグ&ドロップ
Unity_

適当にUI CameraとMain Cameraに色をつけてわかりやすくして、
Unity_

Main CameraUI Cameraを遠くに離してみます。
すると、ボタンはMain Cameraに写っていないのに、ゲーム画面には見えています
Unity_

World Spaceはシンボルのように使うのに適しています。これのみtransformが可能です。
Hierarchyを右クリックして、3D ObjectのSphereを追加。
Scaleはわかりやすい大きさにしてMain cameraの前にがんばって持ってきてください。
Unity_

Sphereを右クリックして、Canbas→CanvasにPanel→PanelにTextと子をつけていきます。

画面が大変なことになりますが、慌てずにTextのText(なんだこの日本語)にHiと入力。
Unity_

CanvasとPanelとTextのWidthを100、Heightを30に変更(値はなんでもいいです。同じ値にします。)
Unity_

CanvasのRender ModeWorld SpaceにしてPosX,PosY,PosZを全て0に。
Unity_

Sphereを動かすと動きに合わせてUIが動きます。ネトゲのチャット欄とかによさそうですね。
Unity_

そして最後はPanelの重なり順について。

さっきのPanelにボタンを二つ子として付けましょう。
で、位置を少しずらして重なりながら両方見えるように
Unity_

そしてボタンの順序を入れ替えると、
Unity_Unity_

Lesson 1はこんなところでした。
平日に急ぎで作ったので、細かいプロパティなどがおざなりでごめんなさい。
いつか綺麗に直します。

次回はLesson 2ですね。

更新しました→[Unity]Unity4.6 UIチュートリアル Lesson2.UI Rect Transform 日本語要約

ad

関連記事

Unity_

[Unity]Unity4.6 UIチュートリアル Lesson2.UI Rect Transform 日本語要約

今回はUIのRect Transformの使い方。 公式はここ→http://unity3d.co

記事を読む

Unity_

[Unity]Unity2Dチュートリアル 同じ色のパズルを消去する

前回の続き。 さて、そろそろパズドラみたいにパズルを消すロジックを考えていきましょう。 パズ

記事を読む

socket p2p unity

[Unity]Socket通信でP2Pすっぞ ホストへ接続

前回はホストが待ちうけするところまで作りました。 今回はクライアントがホストへ接続できるように

記事を読む

Unity_

[Unity]Unity2Dチュートリアル 画面上のGameObjectを左下から取得する

前回、画面上のオブジェクトを一括で手に入れる方法はわかりました。 しかし、これではどのオブジェクト

記事を読む

unity pazzle

[Unity]Unity2D 番外編 消してちょっと待つ(コルーチン利用)

>タイルを再生成するときに消えたというのがわかるように、時間をおいて生成させることは可能ですか?

記事を読む

unity

[Unity]コードリファレンス GameObjectを親子関係にする。

親子関係にして、親が動いたら子も動くような動きをさせます。 transform.parentプ

記事を読む

unity rotate worldpoint

[Unity]コードリファレンス GameObjectを回転する。

くるくる回します。 rotationプロパティ Objectの向きをワールド座標で指定します

記事を読む

cropped-wannabenote_logo.png

[Unity]Unity4.6 UIチュートリアル Lesson11.UI Mask 日本語要約

Unity関連まとめページはこちら→Unity Unity4.6 UIチュートリアル Less

記事を読む

Wannabenote

[Unity]Unity2Dチュートリアル パズルを落下させる。

前回の続き。 とりあえず、パズルが消えたので、パズルを落としましょう。 以下のようにソースを

記事を読む

unity toggle button label

[Unity]コードリファレンス テキストを表示する。

テキストを表示します。 OnGUI() Unityでテキストを表示する場合は、OnGUI()

記事を読む

ad

Message

メールアドレスが公開されることはありません。

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">

ad

  •  Auther;わなび

     「オープン系得意だよね? 俺のPCの調子悪いんだけど」という無茶振りから解き放たれゲームエンジニアに。
    C#とかUnityを扱います。
    Twitterフォロー大歓迎です。
    githubアカウント→wannabenote
  • follow us in feedly
PAGE TOP ↑