Xamarin.Android ViewPager簡單使用

ViewPager的簡單介紹

ViewPager就是一個頁面切換的組件而已,我們可以往裏面填多個view,然後

我們左右滑動切換不同的view而已,和ListView一樣,我們也需要一個Adapter(適配器),將要顯示的View和我們的ViewPager進行綁定,而ViewPager有特定的Adapter——PagerAdapter!

另外,Google官方是建議我們使用Fragment來填充ViewPager的,這樣可以更加方便的生成

每個Page以及管理每個Page的生命週期!當然也給我們提供了兩個不同的Adapter!分別是:

FragmentPageAdapter和FragmentStatePagerAdapter,前者適用於頁面較少的情況,後者適用於頁面較多的情況

先上效果圖


實現這個效果呢,並不難

首先要有Xamarin.Android.Support.V4這個dll文件,沒有的可以通過這種方式下載


     效果圖如下:


第一步:先建立三個.axml文件

界面佈局如下:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="center"
    android:background="#FF6666">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="第一個Page" />
</LinearLayout>

其餘連個界面背景顏色改變一下即可

第二步:建立ViewPager的適配器——PagerAdapter

internal class ViewPagerAdapter : PagerAdapter
    {
        private readonly List<View> viewLists; //定義一個view的集合,賦給ViewPager,viewPager和listview其實是一樣的

        public override bool IsViewFromObject(View view, Object objectValue)
        {
            return view == objectValue; //?判斷view和對應的objectValue等不等,對,就是醬紙。。。。
        }

        public ViewPagerAdapter(List<View> _viewList)
        {
            viewLists = _viewList;
        }

        //獲得ViewPage裏面有多少個Count
        public override int Count
        {
            get { return viewLists.Count(); }
        }

        public override Java.Lang.Object InstantiateItem(ViewGroup arg0, int arg1)
        {
            arg0.AddView(viewLists[arg1]);
            return viewLists[arg1];
        }

        public override void DestroyItem(ViewGroup arg0, int arg1, Java.Lang.Object arg2)
        {
            arg0.RemoveView(viewLists[arg1]);
        }

在MainActivity裏面

界面代碼:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/LinearLayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">
    <TextView
        android:gravity="center"
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:text="簡單的ViewPager使用"
        android:background="#FCBC12" />
    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center" />
</LinearLayout>
後臺代碼:
[Activity(Label = "Material", MainLauncher = true, Icon = "@drawable/icon")]
    public class MainActivity : Activity
    {
        private int count = 1;
        //定義相關變量  
        private View v1, v2, v3;
        private ViewPager vPager;
        private List<View> aList;
        private ViewPagerAdapter mAdapter;

        protected override void OnCreate(Bundle bundle)
        {
            base.OnCreate(bundle);
            SetContentView(Resource.Layout.Main);

            vPager = FindViewById<ViewPager>(Resource.Id.viewpager);
            //動態加載三個View  
            var li = LayoutInflater.From(this);
            v1 = li.Inflate(Resource.Layout.Page1, null);
            v2 = li.Inflate(Resource.Layout.Page2, null);
            v3 = li.Inflate(Resource.Layout.Page3, null);
            aList = new List<View>();
            aList.Add(v1);
            aList.Add(v2);
            aList.Add(v3);
            mAdapter = new ViewPagerAdapter(aList);
            vPager.Adapter = mAdapter;
        }
}
到此,代碼完成,運行一下,即可達到模擬器效果。




發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章