Xamarin.Forms,xf,flipview,pivotview,pivot,tab,多頁面切換,控件,ViewPager

PivotPage ———— 多頁面切換控件

PivotPage是一個多頁面切換控件，類似安卓中的ViewPager和UWP中的Pivot樞軸控件。

起初打算直接通過ScrollView+StackLayout直接實現該控件，但是在具體實現的時候，發現iOS中，利用UIScrollView的PagingEnabled 屬性，可以很方便的實現分頁效果。但是，在安卓平臺中，原生的ScrollView只提供了很有限的事件方法，需要比較繞的操作才能實現諸如滾動開始，滾動停止等事件的監聽，極其不便，所以直接利用ViewPager實現多頁面切換的效果。

又考慮到在Xamarin.Forms層面，應該有同意的方法實現頁面切換等操作，和具體平臺相互隔離
所以使用了一個自定義控件ViewPanel,該控件繼承自ScrollView

為什么ViewPanel不直接繼承自View呢？

1. 在安卓平臺中，無論是View還是ScrollView，最后都要通過ViewRenderer用ViewPager來實現，沒有區別。

2. 在iOS中，情況有些不同。應為iOS中該控件基本都是用FORMS直接實現的，唯一用到的Renderer是ScrollViewRenderer，用來設置ScrollView對應的UIScrollView的PagingEnabled屬性，讓滾動條按頁滑動，所以讓ViewPanel直接繼承自ScrollView，省去一些不必要的代碼

如何實現在ViewPanel中顯示自定義的控件？

在iOS中，ViewPanel是由ScrollView+StackLayout直接實現的，所以把我們自定義的View直接添加到StackLayout中就可以了，代碼實現類似于：

    ···
    _stackLaout.Children.Add(view);
    ···

在Android中，ViewPanel由一個ViewPager實現，ViewPanel為ViewPager提供所有的子元素，利用如下方法添加到ViewPager中：
（來資源PageAdapter）

    public override Java.Lang.Object InstantiateItem(Android.Views.View container, int position)
    {

        var viewPager = container.JavaCast<ViewPager>();

        var view = _views[position] as Xamarin.Forms.View;

        view.Parent = _customViewPage;

        if (Platform.GetRenderer(view) == null)

            Platform.SetRenderer(view, Platform.CreateRenderer(view));

        var renderer = Platform.GetRenderer(view);

        var viewGroup = renderer.ViewGroup;

        viewPager.AddView(viewGroup);

        return viewGroup;

    }

使用ViewPager的時候，數據由PageAdapter提供。根據我們提供的View,創建相應的NativeView添加到ViewPager中。

---

控件由兩部分組成：

1. Header:放置各個頁面標題，LOGO等，數據模板自定義，支持數據綁定
2. Views:自定義控件ViewPanel，繼承自ScrollView（主要方便iOS），安卓中不使用ScrollView的任何特性，只當作簡單的View

注意：使用的時候需要自定義兩個集合，一個存放Views，一個存放Header，二者中元素一一對應，由使用者維護

(在MVVM中使用舉例)

    Headers.Add(new PivotItemModel { Title = "Mokey" });
    Views.Add(new MokeyView());
    Headers.Add(new PivotItemModel { Title = "Test" });
    Views.Add(new TestView());

目前實現的版本

• iOS:利用Xamarin.Fomrs中SrollView+StackLayout實現ViewPanel
• Android:直接使用ViewPager實現ViewPanel

GitHub地址：PivotPage