読者です 読者をやめる 読者になる 読者になる

SIN@SAPPOROWORKSの覚書

C#を中心に、夜な夜な試行錯誤したコードの記録です。

Xamarin.Forms ListViewのスクロール

【 Xamarin 記事一覧 】

ScrollTo

昨年末に公開されたXamarin.Forms 1.3において、ListViewにScrollToというメソッドが追加されました。
今までは、スクロールさせるだけでレンダラーの記述が必要だったのですが、これで、やっと?PCLからスクロールができるようになりました。


図は、Xamarin.Forms 1.2.xの時点でのメソッド
f:id:furuya02:20150126063154p:plain

下記は、1.3.1.6296(2015.01.27時点のデフォルト)の状態
f:id:furuya02:20150126063201p:plain


ScrollToには、パラメータによって以下の2種類の使い方があります。
・void ScrollTo (object item, ScrollToPosition position, bool animated)
・void ScrollTo (object item, object group, ScrollToPosition position, bool animated)

アイテム指定のスクロール

アイテムを指定した場所までスクロールさせるには、1つ目のメソッドを使用します。

void ScrollTo (object item, ScrollToPosition position, bool animated)

第1パラメータのitemは、移動対象のアイテムで、ItemSourceプロパティに指定されたソース(リスト)の中の1つのオブジェクトになります。

第2パラメタの ScrollToPosition は、移動させたい位置を指定します。
Start 表示領域の先頭
End 表示領域の最後
Center 表示領域の中央
MakeVisible 表示するまで

最後のanimatedは、スクロール時にアニメージョンするかどうかの指定です。

f:id:furuya02:20150127053420p:plain

図にように、指定したアイテムを現在表示中のListViewのどの位置に持ってくるかを指定できます。

なお、MakeVisibleは、指定したアイテムが表示されるまでスクロールするので、表示領域より上にある場合は、先頭に、表示領域より下にある場合、最下行に、そして、既に表示領域にある場合は、スクロールなしとなります。

class MyPage : ContentPage{
    public MyPage() {

        //100行「item-0~item-99」のリストを作成
        var ar = Enumerable.Range(0, 100).Select(n => string.Format("item-{0}", n)).ToList();
        var listView = new ListView() {
            ItemsSource = ar
        };


        //20番目の行「item-20」をターゲットとする
        const int index = 20;
        ar[index] = ar[index] + " (Target)";

        //コマンドボタンの生成
        var buttonStart = new Button { Text = "Start" };
        buttonStart.Clicked += (sender, args) => {
            //ターゲットが先頭になるようにスクロールする
            listView.ScrollTo(ar[index], ScrollToPosition.Start, true);
        };
        var buttonCenter = new Button { Text = "Center" };
        buttonCenter.Clicked += (sender, args) => {
            //ターゲットが中央になるようにスクロールする
            listView.ScrollTo(ar[index], ScrollToPosition.Center, true);
        };
        var buttonEnd = new Button { Text = "End" };
        buttonEnd.Clicked += (sender, args) => {
            //ターゲットが最後になるようにスクロールする
            listView.ScrollTo(ar[index], ScrollToPosition.End, true);
        };

        var buttonMakeVisible = new Button { Text = "MakeVisible" };
        buttonMakeVisible.Clicked += (sender, args) => {
            //ターゲットを見える位置までスクロールする
            listView.ScrollTo(ar[index], ScrollToPosition.MakeVisible, true);
        };

        Content = new StackLayout {
            Padding = new Thickness(0, Device.OnPlatform(20, 0, 0), 0, 0),
            Children = {
                new StackLayout {//コマンドボタンを横に4個配置する
                    Padding = new Thickness(10),
                    Orientation = StackOrientation.Horizontal,
                    Children = { buttonStart,buttonCenter,buttonEnd,buttonMakeVisible}
                },listView
            }
        };
    }
}


※2つ目のグループを指定するメソッドは、まだ試していません・・・


Windows Phone の問題

実は、昨年末、Xamarin.Forms1.3公開時に、「やっと来たか!」って感じで早々試してみたのですが、Windows Phoneだけ動作できませんでした(例外が発生)。レンダラー側でパラメータがnullになってしまっている感じ・・・

そして、この件、XamarinのBugzillaに上げさせて頂いたところ、先日、1.3.2.6299-pre1で修正されました。
Bug 25611 – In WindowsPhone, an exception occurs in ScrollTo of ListView.

しかし、例外は発生しなくなったのですが、やはり、動作が変です。(意図した位置にスクロールしません、1行の高さの計算が間違っている感じ)
そして再び、Bugzillaへ・・・
Bug 26428 – ScrollTo of ListView does not work in WindowsPhone normally


[参考]プレビュー版のインストール

パーケージマネージャーコンソールでは、Stable版しかインストールできません。
f:id:furuya02:20150126061351p:plain
プレビュー版は、「NuGetパーッケージの管理」から、行う必要があります。
f:id:furuya02:20150126061738p:plain

PM> Get-Package

Id                             Version              Description/Release Notes                                                                                                                                           
--                             -------              -------------------------                                                                                                                                           
WPtoolkit                      4.2013.08.16         Windows Phone toolkit provides a collection of controls, extension methods and page animations to help create beautiful and consistent Windows Phone user interfa...
Xamarin.Android.Support.v4     21.0.3.0             C# bindings for android support library v4.                                                                                                                         
Xamarin.Forms                  1.3.2.6299-pre1      Build native UIs for iOS, Android, and Windows Phone from a single, shared C# codebase                                                                              

【 Xamarin 記事一覧 】