!!![NGUI] NGUIでボタンを配置 NGUIを使ってボタンを配置、イベント処理を行うまでを説明します。 なお、NGUI 3.0.9で解説。 !!NGUIのAssetをインポート Asset Storeから、NGUIを購入してプロジェクトにインポートします。 メインメニューに「NGUI」が出ているのを確認。 !!2D UIのRootを配置 新規シーンにて、メインメニューの「NGUI」-「Create」-「2D UI」を選択。 これでシーンに「UI Root」というのが配置されます。この中にはGUI用のCameraが配置されています。このUI Rootの子として各種ウィジットを配置していきます。 {{ref_image unity_ngui_first_01.png}} !!ビューを2D表示にする シーンビューは3Dのパースペクティブ表示になっているため、GUIを確認しやすいように2Dにします。 シーンビューの上の「2D」を選択して、ビューで見やすいようにズーム。 {{ref_image unity_ngui_first_02.png}} !!あらかじめ用意されたウィジットを配置 プロジェクトの「Assets」-「NGUI」-「Examples」-「Atlases」-「Wooden」内に「Control - xxxx」というのがあります。 これが、サンプルとして用意されているウィジットのPrefabです。 {{ref_image unity_ngui_first_03.png}} 「Control - Colored Button」はプッシュボタンになり、これをシーンの「UI Root」にドラッグします。 {{ref_image unity_ngui_first_04.png}} 赤枠に収まるように水平垂直移動させて配置を調整。これを実行すると、マウスオーバーで色が変わるボタンが実装できます。 GameObjectとしての「Control - Colored Button」の子に「Label」があり、ここのUILabelで表示テキストを変更できます。 次に、このボタンが押されたときのイベントをScriptで取得してみましょう。 UI Rootや各種ウィジット/Spriteなどを選択した状態でCtrlキーを押すと、 幅と高さが表示されます。 !!ボタンイベントの取得 メインメニューの「GameObject」-「Create Empty」で、シーンにカラのGameObjectを配置します。 GameObject名を「main」という名称に変更し、InepectorのAdd Componentボタンを押して、New Scriptで「UIEvent」というのを作成しました。 これはMonoBehaviour派生クラスである必要があります。 この「UIEnevt.cs」をMonoで開き、イベントを受け取るpublic関数を追加します。 public void MyButtonClick() { Debug.Log("Button Pushed!"); } この「main」GameObjectの「UIEnevt」の「MyButtonClick」関数を、プッシュボタン「Control - Colored Button」のボタンイベントで呼び出すようにします。 「Control - Colored Button」を選択して、Inspectorの「On Click」のNotifyが見えるようにスクロール。 シーンツリーの「main」GameObjectをドラッグしてInspectorの「On Click」のNotifyにドロップ。この間、マウスアップしてはいけません(マウスを離すとmainのGameObjectが選択されてInspectorが切り替わるため)。 {{ref_image unity_ngui_first_05.png}} これでNotifyの表示の下に「Method」が表示されます。ここで「UIEvent.MyButtonClick」を選択できるので指定。 {{ref_image unity_ngui_first_06.png}} 実行して、ボタンをプッシュするとConsoleに「Button Pushed!」が表示されてイベントが呼ばれるのが確認できます。 ---- {{lastmodified}}