一手遮天 Android - view(集合类): ViewPager 基础 1

项目地址 https://github.com/webabcd/AndroidDemo
作者 webabcd

一手遮天 Android - view(集合类): ViewPager 基础 1

示例如下:

/view/collection/ViewPagerDemo1.java

/**
 * ViewPager - 页面切换控件
 *     setCurrentItem() - 指定 ViewPager 当前显示的页面的索引位置
 *     setAdapter() - 指定用于为 ViewPager 呈现数据的 PagerAdapter 对象
 *
 * 本例演示
 * 1、如何通过自定义的 PagerAdapter 来为 ViewPager 对象提供数据
 * 2、PagerAdapter 会缓存 3 个页,即当前页、左边页和右边页
 *    需要被缓存就调用 instantiateItem(),不需要被缓存就调用 destroyItem()
 * 3、如何为 ViewPager 的每个页面添加类似 Tab 控件的标题
 */

package com.webabcd.androiddemo.view.collection;

import androidx.viewpager.widget.PagerAdapter;
import androidx.viewpager.widget.ViewPager;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import com.webabcd.androiddemo.R;

import java.util.ArrayList;

public class ViewPagerDemo1 extends AppCompatActivity {

    private final String LOG_TAG = "ViewPagerDemo1";

    private ViewPager mViewPager1;
    private ViewPager mViewPager2;
    private ViewPager mViewPager3;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_view_collection_viewpagerdemo1);

        mViewPager1 = findViewById(R.id.viewPager1);
        mViewPager2 = findViewById(R.id.viewPager2);
        mViewPager3 = findViewById(R.id.viewPager3);

        sample();
    }

    private void sample() {
        ViewPager[] viewPagerList = {mViewPager1, mViewPager2, mViewPager3};
        for (ViewPager viewPager: viewPagerList) {
            // 用于保存 ViewPager 的每个 view
            ArrayList viewList = new ArrayList<View>();
            LayoutInflater layoutInflater = getLayoutInflater();
            viewList.add(layoutInflater.inflate(R.layout.activity_view_collection_viewpagerdemo1_page1, null, false));
            viewList.add(layoutInflater.inflate(R.layout.activity_view_collection_viewpagerdemo1_page2, null, false));
            viewList.add(layoutInflater.inflate(R.layout.activity_view_collection_viewpagerdemo1_page3, null, false));

            // 用于保存 ViewPager 的每个 view 的标题
            ArrayList titleList = new ArrayList<String>();
            titleList.add("红色");
            titleList.add("绿色");
            titleList.add("蓝色");

            // 实例化自定义的 PagerAdapter
            MyPagerAdapter myPagerAdapter = new MyPagerAdapter(viewList, titleList);
            // 指定 ViewPager 的 PagerAdapter
            viewPager.setAdapter(myPagerAdapter);
        }
    }

    /**
     * 自定义 PagerAdapter 用于为 ViewPager 提供数据
     */
    class MyPagerAdapter extends PagerAdapter {

        private ArrayList<View> mViewList;
        private ArrayList<String> mTitleList;

        public MyPagerAdapter() {
        }

        public MyPagerAdapter(ArrayList<View> viewList, ArrayList<String> titleList) {
            super();

            this.mViewList = viewList;
            this.mTitleList = titleList;
        }

        // ViewPager 的页面的数量
        @Override
        public int getCount() {
            return mViewList.size();
        }

        // 固定这么写就好
        @Override
        public boolean isViewFromObject(View view, Object object) {
            return view == object;
        }

        // 将 ViewPager 的指定索引位置的 view 添加进容器,并返回这个 view
        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            View view = mViewList.get(position);
            container.addView(view);

            // 用于验证 PagerAdapter 会缓存 3 个页,即当前页、左边页和右边页
            Log.d(LOG_TAG, "instantiateItem: " + position);

            return view;
        }

        // 将 ViewPager 的指定索引位置的 view 从容器中删除
        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {
            container.removeView(mViewList.get(position));

            // 用于验证 PagerAdapter 会缓存 3 个页,即当前页、左边页和右边页
            Log.d(LOG_TAG, "destroyItem: " + position);
        }

        // 返回 ViewPager 的指定索引位置的 view 的标题
        @Override
        public CharSequence getPageTitle(int position) {
            return mTitleList.get(position);
        }
    }
}

/layout/activity_view_collection_viewpagerdemo1.xml

<?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">

    <!--
        ViewPager - 页面切换控件
    -->
    <androidx.viewpager.widget.ViewPager
        android:id="@+id/viewPager1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1">
    </androidx.viewpager.widget.ViewPager>

    <!--
        ViewPager - 页面切换控件
            PagerTitleStrip - 为 ViewPager 增加不同页面的标题(类似 Tab 控件),标题无下划线
    -->
    <androidx.viewpager.widget.ViewPager
        android:id="@+id/viewPager2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1">
        <androidx.viewpager.widget.PagerTitleStrip
            android:layout_width="wrap_content"
            android:layout_height="32dp"
            android:background="@color/orange"
            android:textColor="@color/white" />
    </androidx.viewpager.widget.ViewPager>


    <!--
        ViewPager - 页面切换控件
            PagerTabStrip - 为 ViewPager 增加不同页面的标题(类似 Tab 控件),标题有下划线
    -->
    <androidx.viewpager.widget.ViewPager
        android:id="@+id/viewPager3"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1">
        <androidx.viewpager.widget.PagerTabStrip
            android:layout_width="wrap_content"
            android:layout_height="32dp"
            android:background="@color/orange"
            android:textColor="@color/white" />
    </androidx.viewpager.widget.ViewPager>

</LinearLayout>

/layout/activity_view_collection_viewpagerdemo1_page1.xml

<?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:background="@color/red"
    android:orientation="vertical">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="page 1"
        android:textColor="@color/white"
        android:textSize="24sp"/>

</LinearLayout>

/layout/activity_view_collection_viewpagerdemo1_page2.xml

<?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:background="@color/green"
    android:orientation="vertical">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="page 2"
        android:textColor="@color/white"
        android:textSize="24sp"/>

</LinearLayout>

/layout/activity_view_collection_viewpagerdemo1_page3.xml

<?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:background="@color/blue"
    android:orientation="vertical">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="page 3"
        android:textColor="@color/white"
        android:textSize="24sp"/>

</LinearLayout>

项目地址 https://github.com/webabcd/AndroidDemo
作者 webabcd

上一篇:ViewPager控件之PagerAdapter适配器


下一篇:C语言实现设计模式之行为模式:模式方法模式