Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
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 01
Lis...
データ取得のタイミング
データソースから決まった件数ずつし
か取得できないときは?
• ItemsSourceにBindしたデータを取得ご
とに更新する
• いつ更新すればいいのか?
• 1つの方法は「ListBoxが最後まで表示し
た」とき...
ListBox(WP 7.5)の場合
 Listの最後を表示したことを、VisualStateで検知できる
• MSDNブログ「WP7.5 でリストボックスのスクロールエンドで圧
縮されるときのイベントを取る」(高橋忍)
 http://b...
ListBox(WP 7.5)の場合
手順
1. VisualStateGroupをScrollViewerで再
定義する
ScrollViewerはListBoxに含まれる
2. ScrollViewerのVisualStateGroup...
ListBox(WP 7.5)の場合
デモ
LongListSelector(WP8)の場合
WP8で標準に取り込まれた
LongListSelectorでは?
• ListBoxとは内部構造が変わっていて
ScrollViewerがない
• 別の方法が必要
ItemRealized...
LongListSelector(WP8)の場合
LLSがデータを順次表示していって、
次の条件を満たせば最後の要素が表示
されたとみなす
• e.ItemKindが
LongListSelectorItemKind.Itemである
グルー...
LongListSelector(WP8)の場合
デモ
まとめ
データソースからページ単位で取得す
る場合、データ取得のタイミングとし
て以下が使える
• ListBox
VerticalCompresion VisualStateGroupの
CompressionBottom状態を検知する
...
Upcoming SlideShare
Loading in …5
×

Wp8 longlistselectorでのページング処理

1,343 views

Published on

Windows Phone 8のLongListSelectorで、リスト終端でデータを追加読み込みする処理(ページング処理)の実現方法を紹介します。

  • Be the first to comment

  • Be the first to like this

Wp8 longlistselectorでのページング処理

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

×