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したデータを取得ごとに更新する

• いつ更新すればいいのか？

• １つの方法は「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の最後のデータが表示されたことを検知する