ViewPager和Fragment学习笔记(1)

最新推荐文章于 2024-04-09 23:11:54 发布

FioManDream

最新推荐文章于 2024-04-09 23:11:54 发布

阅读量301

点赞数

分类专栏： ViewPager

ViewPager 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

一. 什么是ViewPager
1.初识ViewPager
*记忆中一直停留在和你相遇的那一刻,只因你回眸一笑,我却停止了思考!*
1.1 ViewPager的继承结构

public class ViewPager extends ViewGroup

java.lang.Object
->android.view.View
->android.view.ViewGroup
->android.suppot.v4.view.ViewPager

1.2 ViewPager控件的特性
ViewPager是android.support.v4包中的控件类.ViewPager是一个默认支持手势的水平滑动,实现对多个View的切换显示,并自带平移动画效果的控件.你可以通过一个适配器(PagerAdapter)来管理要显示的页面.
ViewPager主要用来左右滑动.它要用适配器来连接ViewPager控件和Pages.类似ListView和Adapter

2.下面通过一个案例来说明ViewPager的使用
2.1 首先是创建主界面的xml,里面放一个ViewPager控件.因为ViewPager是android.support.v4包中的控件,所以写的时候跟普通的控件有所不同.
activity_main.xml 如下:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >
    <android.support.v4.view.ViewPager
        android:id="@+id/vp_pages"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</RelativeLayout>

2.2 在layout目录下创建4个xml文件,用来显示4张图片,作为ViewPager的视图来源.
page01.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" >
<ImageView 
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:scaleType="fitXY"
    android:contentDescription="@null"
    android:src="@drawable/a001"
    />    
</LinearLayout>

page02.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" >
<ImageView 
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:scaleType="fitXY"
    android:contentDescription="@null"
    android:src="@drawable/a002"
    />    
</LinearLayout>

page03.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" >
<ImageView 
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:scaleType="fitXY"
    android:contentDescription="@null"
    android:src="@drawable/a003"
    />    

</LinearLayout>

page04.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" >
<ImageView 
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:scaleType="fitXY"
    android:contentDescription="@null"
    android:src="@drawable/a004"
    />    
</LinearLayout>

2.3 下面是Acitivity里面配置ViewPager,使其完成活动显示功能.
编写过程
//1.初始化控件
vpPages = (ViewPager) findViewById();

//2.准备数据 – 要显示的pages
pages = new ArrayList();
pages.add();
…..

//3.创建adapter
adapter = new InnerPagerAdapter();

//4.为ViewPager配置Adapter,以显示内容
vpPages.setAdapter(adapter);

其中我们用成员内部类的方式创建InnerPagerAdapter,它必须继承自PagerAdapter,并实现PagerAdapter的4个抽象方法.

关于PagerAdapter:
PagerAdapter是用于”将多个页面填充到ViewPager”的适配器的基类,PagerAdapter比AdapterView的使用更加普通.ViewPager使用回调函数来表示一个更新的步骤，而不是使用一个视图回收机制。在需要的时候pageradapter也可以实现视图的回收或者使用一种更为巧妙的方法来管理视图，比如采用可以管理自身视图的fragment。
viewpager不直接处理每一个视图而是将各个视图与一个键联系起来。这个键用来跟踪且唯一代表一个页面，不仅如此，该键还独立于这个页面所在adapter的位置。当pageradapter将要改变的时候他会调用startUpdate函数，接下来会调用一次或多次的instantiateItem或者destroyItem。最后在更新的后期会调用finishUpdate。当finishUpdate返回时 instantiateItem返回的对象应该添加到父ViewGroup destroyItem返回的对象应该被ViewGroup删除。methodisViewFromObject(View, Object)代表了当前的页面是否与给定的键相关联。

对于非常简单的pageradapter或许你可以选择用page本身作为键，在创建并且添加到viewgroup后instantiateItem方法里返回该page本身即可
destroyItem将会将该page从viewgroup里面移除。isViewFromObject方法里面直接可以返回view == object。

pageradapter支持数据集合的改变，数据集合的改变必须要在主线程里面执行，然后还要调用notifyDataSetChanged方法。和baseadapter非常相似。数据集合的改变包括页面的添加删除和修改位置。viewpager要维持当前页面是活动的，所以你必须提供getItemPosition方法。

代码实现:

package com.example.my20_viewpager;

import java.util.ArrayList;
import java.util.List;

import android.app.Activity;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class MainActivity extends Activity
{   
    /**
     * ViewPager 控件
     */
    private ViewPager vpPages;

    /**
     * PagerAdapter ViewPager的适配器
     */
    private PagerAdapter adapter;

    /**
     * 在ViewPager中要显示的View对象集合
     */
    List<View> pages ;

    /**
     * 将xml文档解析成view对象的工具
     */

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

        LayoutInflater inflater = getLayoutInflater();
        //1.初始化控件
        vpPages = (ViewPager) findViewById(R.id.vp_pages);

        //2.准备数据源 --> 要显示的view对象
        pages = new ArrayList<View>();
        pages.add(inflater.inflate(R.layout.page01, null));
        pages.add(inflater.inflate(R.layout.page02, null));
        pages.add(inflater.inflate(R.layout.page03, null));
        pages.add(inflater.inflate(R.layout.page04, null));

        //3.创建adapter
        adapter = new InnerAdapter();

        //4.为ViewPager配置适配器,以显示内容
        vpPages.setAdapter(adapter);
    }


    private class InnerAdapter extends PagerAdapter
    {
        /**
         * 这个函数的功能是创建指定位置的页面视图.适配器有责任将即将创建的View视图到这里给定的container中,
         * 这是为了确保在finishUpdate(viewGroup)返回时这里已经完成.
         * return: 返回一个代表新增视图页面的Object(key),而一般简单的PagerAdapter我们就返回视图本身.
         * 在finishUpdate(ViewGroup)执行完后,有两个操作,一个是原视图的移除(不再显示的视图),另一个是新视图的
         * 增加(即将显示的视图)
         * 
         * 对于非常简单的pageradapter或许你可以选择用page本身作为键，在创建并且添加到viewgroup后instantiateItem方法里返回该page本身即可
         * destroyItem将会将该page从viewgroup里面移除。isViewFromObject方法里面直接可以返回view == object。
         */
        @Override
        public Object instantiateItem(ViewGroup container, int position)
        {
            //根据第二个参数position确定需要显示的view对象
            View view = pages.get(position);
            //将需要显示的view增加到容器container中.
            container.addView(view);
            //返回将要显示的view对象
            return view;
        }

        /**
         * 这个方法的功能是从container容器中移除一个指定位置的视图.在finishUpdate(viewGroup)返回时视图要确保被移除.
         */
        @Override
        public void destroyItem(ViewGroup container, int position, Object object)
        {
            container.removeView(pages.get(position));
        }

        /**
         * 返回当前有效视图的个数,也即是pages集合中元素的个数
         */
        @Override
        public int getCount()
        {
            return pages.size();
        }

        /**
         * 这个方法用来判断instantiateItem(ViewGroup,int)函数所返回来的key与一个页面视图是否代表同一个视图
         * (即他俩是否是对应的,对应的表示同一个View)
         * 
         * Determines whether a page View is associated with a specific key object as returned by instantiateItem(ViewGroup, int)
         */
        @Override
        public boolean isViewFromObject(View view, Object object)
        {
            return view == object;
        }

    }

}