TableViewの後継?のListViewを調べたメモ
もうスマホアプリっていったらつまるところリストビューだから。
リストビューを制するものはスマホアプリを制す。
Titaniumではリスト表示には長らくTableViewが使われていたらしいが、パフォーマンスや使い勝手の面で性能アップしたListViewというものがそこそこ最近現れたらしい。
http://docs.appcelerator.com/titanium/3.0/#!/guide/ListViews
ListView is designed as a replacement for TableView
ということで、今後はTableViewを使っていいのは小学生まで、ということでよろしくお願いいたします。
TableViewとの違い
とりあえず先にTableViewとの違いを列挙する。
- ListViewはTableViewに対応し、ListSectionはTableViewSectionに対応し、ListItemはTableViewRowに対応するものです。
- ListViewはパフォーマンス向上を意識してデザインされています。そのかわりTableViewではできていた、子Viewを直接操作することができなくなっています。そのかわりテンプレートとデータアイテムというものを通して間接的にアクセスすることができます。
- ListViewではListItemを追加するにはListSectionを明示的に作る必要があります。TableViewは直接TableViewRowを追加できましたが、これはTableViewSectionが暗黙的に作られ、TableViewに追加されていたためです。
- ListItemはTableViewRowのような作り方はしません。ListItemはListDataItemの配列をListSectionに渡すことで作られます。へー。
- TableViewRowでやっていたように、ListItemにViewをaddメソッドで追加することはできません。ViewをListItemに追加するにはItemTemplateを定義する必要があり、ItemTemplateはtemplateプロパティを通してリストデータにバインドされます。
- ListItemに明示的にプロパティをセットしたりイベントをバインドすることはできません。ListDataItemのpropertiesディクショナリかItemTemplateと対応するItemTemplateかViewTemplateのeventsディクショナリを使ってセットする必要があります。
詳しくはListItemの章を嫁。
あとは、TableViewのAPIとの違いがずらずらと書いてあるけど、実はボクチンはニュービーなのでTableView使ったことないから調べまてん。
ListViewの構成
ListViewは、ListView、ListSection、ListItemからなるリスト表示用のIFです、と。
- ListItem:ListItemはバーチャルなviewでリストの1行を表します。1つのListItemはitem templateとdata itemで構成されます。
- ItemTemplate: ListItemのview構造を定義するJavascriptオブジェクトです。Itemの見た目をカスタマイズするには子viewとデフォルトのプロパティを追加します。
- ListDataItem: ListDataItemはリストに表示したいデータが格納されたJavascriptオブジェクトです。データはtemplateに適用され、list itemになります。
- ListSection: そのまんま、ListItemの集まりを制御するオブジェクトです。
- ListView: ListSectionの集まりを(ry
あとは使ってみる。
ここまで読んでみると、XMLでは定義できなさそうだなぁ。できたとしても逆にややこしくなりそう。。
だから、あとはこのドキュメント見て、やってみよう。
http://docs.appcelerator.com/titanium/3.0/#!/guide/ListViews
追記9/11)ちょっと使うの待ったほうがいいかも。→http://d.hatena.ne.jp/ria10/20130911/1378885998
今日はここまで。
Titanium Mobile iPhone/Androidアプリ開発入門―JavaScriptだけで作る
- 作者: 小澤栄一,増井雄一郎
- 出版社/メーカー: 秀和システム
- 発売日: 2012/02/01
- メディア: 単行本
- 購入: 9人 クリック: 169回
- この商品を含むブログ (24件) を見る