WP7でリストの簡単ページング。

リストが長くなってくると読み込むのがものすっごく遅くなって残念なので、なんとかしてみたいです。今回はScrollViewer+ItemsControlの環境でやります。ListBoxじゃなくてごめんちゃい☆

おぼえがき。

ひつようなもの

 

  • ScrollViewerの下にItemsControlが入ってるような状態。
  • ViewModelに、リストの次の要素を読み込むようなICommand。
  • とりあえず表示が出来る状態にしておく。

てじゅん

  1. Expression Blendをおもむろに立ち上げます。
  2. 立ち上がるまでお茶を飲んで待ちます。
  3. 立ちあがったらページを開きます。
  4. ScrollViewerたんを選択してあげます。
    こんな感じね。
  5. アセットから「InvokeCommandAction」を探します。
    ざっつらいと。
  6. ScrollViewerに投げ込みます。どらっぐあんどどろっぷ。
    こうなって

    こうなればおっけー。
  7. 先ほどのInvokeCommandActionが選択されている状態で、プロパティペインを見ます。
  8. トリガーグループの EventName に ManipulationCompleted をセットしてあげます。
    はい、それです。
  9. トリガー のすぐ下、「条件」を開いて、「条件一覧」の右端にある+ボタン、「条件の追加」をクリックします。
    これを押すと


    こうなります。

  10. 上側のテキストボックスにバインドを設定します。
    画像のぽっち部分をクリックして、


    「要素のプロパティのバインド…」をクリックします。

  11. そうするとなんだか変な目玉アイコンになるので、そのままScrollViewerをクリックします。
  12. VerticalOffset を選んでOK。
    GO!GO!
  13. 上側の欄が黄色くなりましたね。バインドされました。こんどは下側でも同じ事を。
  14. ただし、今度は「ScrollableHeight」を選びます。
  15. さぁ、あと少し! 「is [Equal ]」ってなってるところを、GreatherThanEqual にしてあげます。
    「Equal」にしてしまうとスクロールし過ぎてしまった時に次の要素が読み込まれなくなるよ!
  16. 最後の総仕上げ、「データ バインド」でコマンドを呼び出してあげます!
    クリックして選ぶだけ!楽な時代になったもんだよ!!!

はい、おつかれさまでした。下まで読み込んだ時に次の要素を読み込むリストができあがりましたー。

似た要領で上から引っ張り下ろしてくるタイプもできるんじゃないかなーとか思ってます。値を固定値で-10くらいにしてしまって。ね。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です