できる! NGUI で tableView を作ろう!

[unity][ngui]できる! NGUI で tableView を作ろう!

成果物
参考できたやつ
https://dl.dropboxusercontent.com/u/45612210/webplayer.html
(ドラッグ範囲がみづらくて恐縮)

背景
NGUIの情報少なすぎワロタwww 状態なのでとりあえず NGUI で table view 作る手順を書いてみた!
実際 webview で適当にtable とってくる方が早い感あるけど、凝ったやつとか考えたら結局NGUIの使い方覚えた方が
いい気がしたから、ここにまとめておく。

手順

1. Table view をおきたいようの UIRoot を作る
2. 1.のUIのPanel にGameObject を作る(TiledSprite っていう名前になってるけどUISpriteのComponent消した)
3. 2 でつくった GameObject にBoxColider(基本は大丈夫だと思うけどsizeは1,1,0に注意)、
4. 2. でつくった GameObject にUIDragCamera Component つける Draggable camera はあとで付ける
5. 2. で作った GameObject のscaleは自分でいい感じに設定する(200,200, 0) とした。その子供にTopLeft, BottomRight というGameObjectをつけて、左上、右下の位置にそれぞれ設置する。
6. TableView の中身 を置く用に UIRoot を作る。 その中の UIPanel の Position を1000,1000,0 とかにする
7. 6. でつくったPanel に Component -> NGUI -> Interaction -> Table でテーブルつける
8. (縦の場合) 7.のUITableは、Columns を 1 にする
9. 6. でつくった UIRoot の中の UIPanel の小要素として、適当にObject を浮かべる(ここでは NGUIシーンサンプル(8)のItemをPrefab化してそのままコピペで増やして使用した)
10. 6. でつくった UIRoot の中の UIPanel の小要素として、ViewCamera を作る(ここでは、NGUIシーンサンプル(8)のViewCamera をPrefab化して使用した)。たぶん重要なのはUIViewPort Component のアタッチ、UIDraggableCamera Component のアタッチ。
11. 10. の UIViewPort のinspector で 6. で作ったCamera を関連づけ、TopLeft, BottomRightを5. の左上、右下のやつに関連づける。
12. 10. の UIDraggableCamera の inspector でScale を x 0, y 1 とする(縦の場合)。RootForBoundsを6.のUIRootを指定。
13. 4. のDraggable camera を10.でつくったカメラと関連づける。

補足
たぶん RepositionNow とか inspector から使用できるので 動的に追加しても呼べば大丈夫だと思われる。
なんかうごかないなーっておもったら 3. の Box collider 忘れかも知れない
7. で作ったUITable のDirection を Up にしておいたほうが良いかもしれない。
本来はプレビュー(2by3の下の画面)で、自分の表示したい方のやつはすでに表示できているはずなんだけど、表示されない場合があるかもしれなくて、もしかしたらそれは camera の depth かもしれない。

所感
それっぽくできるようになったので次はスクリプトを使って動的に追加みたいなやつをやりたい。
なんか間違ってたりするかもしれないからなんかあったら教えてください。

参考画像