リア充爆発日記

You don't even know what ria-ju really is.

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だけで作る

Titanium Mobile iPhone/Androidアプリ開発入門―JavaScriptだけで作る