2014年10月20日

【Unity】NGUIでiPhoneでよくみる時間設定ドラムロールっぽいものを作る

TimeScroll.jpg

こういった上下スクロールさせ無限ループできるやつを作ります

使用するNGUIのコンポーネントは
「UIScrollView」「UICenterOnChild」「UIWrapContent」です
TimeHierarchy.jpg


ScrollViewをメニューからNGUI→Create→ScrollViewから作成
ScrollViewの子にEmptyGameObjectを配置して
メニューからComponent→NGUI→Interaction→CenterScrollViewOnChild
Component→NGUI→Interaction→WrapContentの2つを追加

TimeInspector.jpg

UICenterOnChildのSpringStrengthを調整すると
スクロールしたときにふんわり止まるかシャキっと止まるかを指定できます
ちょっと慣性がきいたような表現は8〜10あたりがちょうどよかった印象です

UIWrapContentのItemHeightの数値は
スクロールアイテムオブジェクトの高さサイズを指定しておくとベターですね

では、スクロールアイテムを作りましょう

TimeInspector2.jpg

数値を入力するのでUILabelを作ります
ScrollViewのドラッグイベントでスクロールしてくれるようにColiderを登録しましょう
メニューからNGUI→Attach→Coliderで登録します
さらにメニューからComponent→NGUI→Interaction→DragScrollViewを追加します

Prefabにしてスクリプトから生成して配置するもよし、
さっき作ったEmptyGameObjectの子として配置するもよし

スクリプトで配置したあと
ただしい並びになるようにソート処理をして再配置をします

UIWrapContent hourWrap = _EmptyGameObject.GetComponent<UIWrapContent>();
for(int h = 0; h < 24; h++){
GameObject hourItem = NGUITools.AddChild(_EmptyGameObject, _hourItemPrefab);
UILabel label = hourItem.GetComponent<UILabel>();
label.text = hourItem.name = h.ToString("D2");
}
hourWrap.SortAlphabetically();
hourWrap.WrapContent();

h.ToString("D2");をつかって
0埋め命名をすることでSortAlphabeticallyを実行すると0時~23時の順で並ぶようになります。
そしてWrapContentをコールすると0の上に23が配置されたようになります

UICenterOnChild hourCenterOnChild = _EmptyGameObject.GetComponent<UICenterOnChild >();
hourCenterOnChild .onCenter = OnHourItemCenter;

とコールバックを登録し

public void OnHourItemCenter(GameObject go){
_hour = go.GetComponent<UILabel>().text;
}

とすればテキストを取得できます

ラベル:unity NGUI
posted by ヒイロ at 13:23| 福岡 ☁| Comment(0) | TrackBack(0) | プログラム | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。

この記事へのトラックバック
×

この広告は1年以上新しい記事の投稿がないブログに表示されております。