*

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

公開日: : 最終更新日:2014/11/30 Unity

前回に続いて、今回はUI Buttonの説明。
公式はこちら

まずはHierarchyにUIのButtonを追加しましょう。
Unity_

UIのボタンはImage(Script)Button(Script)があります。

ボタンを追加すると、Textっていう子が出来ますが、削除することでテキストなしのボタンになります。
Unity_Unity_

ButtonのInspectorを見てみましょう。
Button(Script)のInteractableはボタンの有効化のプロパティです。
チェックを外すとボタンが利用出来なくなります。
Unity_

Transitionはいくつかの種類があります。

Noneはマウスオーバーなどで動きは付きません。

ColorTintはその逆で色を変更などが出来ます。
Normal Color:普段の色
Highlighted Color:マウスオーバー時の色
Pressed Color:ボタンを押したときの色
Disabled Color:Interactableがfalseのときの色
Unity_

SpriteSwapはマウスオーバー時のスプライトを変更したりなどが出来ます。
画像を差し替えたり出来ますね。
Unity_

Animationはその名の通り、アニメーションをそれぞれの状態で定義出来ます。
Unity_
アニメーションのやり方は、まずはButton(Script)でAuto Generate Animationをクリック。
Unity_

Buttonを選択した状態でCtrl+6でアニメーションを開きます。
Unity_

左上の部分でそれぞれの動きを決めることが出来ます。
ためしにクリックしたときに横幅を大きくしてみましょう。
Pressedを選択して、
Unity_
録音ボタンを押す。
Unity_
それからButtonのInspectorのWidthをクリックしながら左右に動かして、大きさを変更しましょう。
Unity_
クリックしたときのボタンの大きさを決めたら、再度録音ボタンを押して、録音解除。

ゲームを実行して実際にボタンをクリックすると、クリックしたときに大きくなります
Unity_

同じ動きをするボタンを追加するときは、ボタンをCanvasに追加して、名前を変更して、
Unity_

そのボタンのButton(Script)のTransitionAnimationに変更。
Unity_

AddComponentからAnimatorを追加。
Unity_

最後にAnimatorのControllerの丸印をクリックして、ButtonをControllerに設定。
Unity_
実行してクリックすると追加したボタンも大きくなります。

クリックしたときの処理はButton(Script)にあるOn Click(Button)でオブジェクトを選択して、その関数やコンポーネントを記述します。
例えばButtonがクリックしたときにButtonのテキストを「Click!!」に変更してみます。
HierarchyのButtonを選択して、On Click()+マークから追加。
Unity_

変更したいTextをドラッグ&ドロップ。
Unity_

No Functionになっているところをクリックしてドロップダウンから、Text→string textを選択。
Unity_

出てきたテキストボックスに「Click!!」と入力。
Unity_

実行してクリックをするとテキストが「Click」に変更しました。
(同じような要領で関数をアタッチすれば、スクリプトを流せますね)
Unity_

こんなところですね。お疲れ様でした。
次回更新しました→[Unity]Unity4.6 UIチュートリアル Lesson4.UI Image 日本語要約

ad

関連記事

logo

[Unity]Unity2Dでパズドラのようにタイルを動かす ソース解説

◆全文 using UnityEngine; using System.Collection

記事を読む

Wannabenote

[Unity]Unity2Dチュートリアル パズルをランダム生成して配置する。(PrefabとInstantiate)

Unity関連記事まとめページはこちら 前回の続き。 パズルを消すことが出来たのでランダ

記事を読む

Unity_

[Unity]Unity 2Dチュートリアル スプライトをドラッグ(タップ)して移動する

前回はスプライトの簡単な操作を覚えました。 今回はスプライトを移動させてみましょう。 ドラッグして

記事を読む

unity toggle button label

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

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

記事を読む

logo

[Unity]GameObject.Findは遅い

遅いらしいです。 なので、マネージャークラスを作りましょう、というのが風潮らしいです。 マネージ

記事を読む

unity ご祝儀

[Unity?]割り切れない関係のためのご祝儀計算シミュレータ

今日、親友が結婚します。 なので、ご祝儀を用意するんですが、相場は3万円ですね。 じゃあ、な

記事を読む

Unity_

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

◆全文 public class GameSystem : MonoBehaviour {

記事を読む

wannabenote_unity

[Unity]コードリファレンス ゲーム時間を表示する。

ゲーム内の時間を表示します。 Timeクラス 時間のためのクラスです。 ゲームが起動してか

記事を読む

Unity_

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

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

記事を読む

unity socket

[Unity]Socket通信でP2Pすっぞ 接続待ち受け

P2Pしましょ。 まずはサーバーとして待ちうけまで作ります。 UnityだとNAT越えどうす

記事を読む

ad

Comment

  1. […] ネットに回答あり [Unity]Unity4.6 UIチュートリアル Lesson3.UI Button 日本語要約 […]

  2. Johne861 より:

    Very good blog post.Really thank you! Fantastic. kcdckkekkkdc

  3. わな び より:

    I hope you find my blog posts informative!

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 ↑