wp8 longlistselectorでのページング処理
DESCRIPTION
Windows Phone 8のLongListSelectorで、リスト終端でデータを追加読み込みする処理(ページング処理)の実現方法を紹介します。TRANSCRIPT
WP8版LongListSelectorでのページング処理
Windows Phoneハッカソン 2013/1/19
青木宣明 @kumar0001
Windows Phoneでのリスト表示
ListBox (Windows Phone 7.5) LongListSelector (Windows Phone 8)
ページング処理とは?
リストに表示するデータ
• データソースからデータを取得できる1回あたりの件数に上限があることが多い
Webサービスなど
Twitter, ATND, …
• データソースからのデータ取得パラメータ
取得条件(検索キーワードなど)
何件取得するか
何件目から取得するか
ListBoxへのデータ表示
ItemsSourceプロパティにIEnumerableなデータをBindingする
• データソースから取得したデータを格納したListなど
ItemsSource
List box item 01List box item 02List box item 03
…Bind
データ取得のタイミング
データソースから決まった件数ずつしか取得できないときは?
• ItemsSourceにBindしたデータを取得ごとに更新する
• いつ更新すればいいのか?
• 1つの方法は「ListBoxが最後まで表示した」ときにデータを取得する
ListBox(WP 7.5)の場合
Listの最後を表示したことを、VisualStateで検知できる
• MSDNブログ「WP7.5 でリストボックスのスクロールエンドで圧縮されるときのイベントを取る」(高橋忍)
http://blogs.msdn.com/b/shintak/archive/2011/08/06/10193347.aspx
以下の状態が定義されている
VisualStateGroup VisualState 意味
VerticalCompresion CompressionTop 最上段でのスクロールエンド
CompressionBottom 最下段でのスクロールエンド
NoVerticalCompression スクロールエンドでない
HorizontalCompression CompressionLeft 左端でのスクロールエンド
CompressionRight 右端でのスクロールエンド
NoHorizontalCompression スクロールエンドでない
ListBox(WP 7.5)の場合
手順1. VisualStateGroupをScrollViewerで再
定義するScrollViewerはListBoxに含まれる
2. ScrollViewerのVisualStateGroup“VerticalCompression”の状態変化イベントにハンドラを登録CurrentStateChangingイベント
3. イベントハンドラでは、新しい状態がCompressionBottomであればデータを取得する
ListBox(WP 7.5)の場合
デモ
LongListSelector(WP8)の場合
WP8で標準に取り込まれたLongListSelectorでは?
• ListBoxとは内部構造が変わっていてScrollViewerがない
• 別の方法が必要
ItemRealizedイベント
• LLSの要素が表示されるタイミングで発生
仮想化されているので、リスト要素を順次生成している
LongListSelector(WP8)の場合
LLSがデータを順次表示していって、次の条件を満たせば最後の要素が表示されたとみなす• e.ItemKindがLongListSelectorItemKind.Itemであるグループヘッダ生成の場合も呼びだされる
• ItemsSourceの最後の要素と、生成されたデータが一致する
画面に表示されていないので、ListBoxの場合と同じではない
LongListSelector(WP8)の場合
デモ
まとめ
データソースからページ単位で取得する場合、データ取得のタイミングとして以下が使える
• ListBox
VerticalCompresion VisualStateGroupのCompressionBottom状態を検知する
• LongListSelector
ItemRealizedイベントでItemsSourceの最後のデータが表示されたことを検知する