本文内容

  • 环境
  • 项目结构
  • 演示 1：PagerTitleStrip
  • 演示 2：PagerTabStrip
  • 演示 3：ViewPager 和动态 Fragment

下载 Demo

环境

  • Windows 2008 R2 64 位
  • Eclipse ADT V22.6.2，Android 4.4.2（API 19）
  • SAMSUNG GT-8618，Android OS 4.1.2

项目结构

图 1 项目结构

图 2 项目主界面

演示 1：PagerTitleStrip

演示 1 和演示 2 都是利用已有的静态的 xml 页面布局，作为 Pager 的 tab 页。通过 LayoutInflater 将 xml 布局文件，变成 View，供 ViewPager 使用。

图 3 演示 PagerTitleStrip 和点击“微博”按钮

package com.example.viewpagerdemo2.ui;

 

import java.util.ArrayList;

import java.util.List;

 

import com.example.viewpagerdemo2.R;

import com.example.viewpagerdemo2.adapter.NewPagerAdapter;

 

import android.os.Bundle;

import android.app.Activity;

import android.support.v4.view.PagerTitleStrip;

import android.support.v4.view.ViewPager;

import android.view.LayoutInflater;

import android.view.View;

 

public class PagerTitleStripDemo extends Activity {

 

    private View view1, view2, view3;

    private ViewPager viewPager;

    private NewPagerAdapter pagerAdapter;

    private PagerTitleStrip myPagerTitleStrip;

    private List<View> viewList;

    private List<String> titleList;

 

    @Override

    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_title);

 

        initClass();

 

        initData();

 

        initControl();

 

        initViewPager();

    }

 

    private void initClass() {

        viewList = new ArrayList<View>();

        titleList = new ArrayList<String>();

    }

 

    private void initData() {

 

        for (int i = 1; i <= 3; i++) {

            titleList.add(String.format("演示1页%s", i));

        }

 

        LayoutInflater lf = LayoutInflater.from(this);

        view1 = lf.inflate(R.layout.layout1, null);

        view2 = lf.inflate(R.layout.layout2, null);

        view3 = lf.inflate(R.layout.layout3, null);

 

        viewList.add(view1);

        viewList.add(view2);

        viewList.add(view3);

    }

 

    private void initControl() {

        viewPager = (ViewPager) findViewById(R.id.myViewPager1);

        myPagerTitleStrip = (PagerTitleStrip) findViewById(R.id.myPagerTitleStrip);

        pagerAdapter = new NewPagerAdapter(this, titleList, viewList);

    }

 

    private void initViewPager() {

        myPagerTitleStrip.setBackgroundColor(getResources().getColor(

                R.color.green));

        myPagerTitleStrip.setTextSpacing(50);

 

        viewPager.setAdapter(pagerAdapter);

    }

}

演示 2：PagerTabStrip

图 4 演示 PagerTabStrip

package com.example.viewpagerdemo2.ui;

 

import java.util.ArrayList;

import java.util.List;

 

import com.example.viewpagerdemo2.R;

import com.example.viewpagerdemo2.adapter.NewPagerAdapter;

 

import android.os.Bundle;

import android.app.Activity;

import android.support.v4.view.PagerTabStrip;

import android.support.v4.view.ViewPager;

import android.view.LayoutInflater;

import android.view.View;

 

public class PagerTabStripDemo extends Activity {

 

    private View view1, view2, view3;

    private ViewPager viewPager2;

    private NewPagerAdapter pagerAdapter;

    private PagerTabStrip myPagerTabStrip;

    private List<View> viewList;

    private List<String> titleList;

 

    @Override

    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_tab);

 

        initClass();

 

        initData();

 

        initControl();

 

        initViewPager();

    }

 

    private void initClass() {

        viewList = new ArrayList<View>();

        titleList = new ArrayList<String>();

    }

 

    private void initData() {

 

        for (int i = 1; i <= 3; i++) {

            titleList.add(String.format("演示2页%s", i));

        }

 

        LayoutInflater lf = LayoutInflater.from(this);

        view1 = lf.inflate(R.layout.layout1, null);

        view2 = lf.inflate(R.layout.layout2, null);

        view3 = lf.inflate(R.layout.layout3, null);

 

        viewList.add(view1);

        viewList.add(view2);

        viewList.add(view3);

    }

 

    private void initControl() {

        viewPager2 = (ViewPager) findViewById(R.id.myViewPager2);

        myPagerTabStrip = (PagerTabStrip) findViewById(R.id.myPagerTabStrip);

        pagerAdapter = new NewPagerAdapter(this, titleList, viewList);

    }

 

    private void initViewPager() {

        myPagerTabStrip.setTabIndicatorColor(getResources().getColor(

                R.color.red));

        myPagerTabStrip.setDrawFullUnderline(false);

        myPagerTabStrip.setBackgroundColor(getResources().getColor(

                R.color.green));

        myPagerTabStrip.setTextSpacing(50);

 

        viewPager2.setAdapter(pagerAdapter);

    }

}

官方文档，对 PagerTabStrip 和 PagerTitleStrip 描述是，“PagerTabStrip is an interactive indicator of the current, next, and previous pages of a ViewPager.” 而“PagerTitleStrip is a non-interactive indicator of the current, next, and previous pages of a ViewPager. ”

简单来说，PagerTabStrip 和 PagerTitleStrip 都能实现滑动切换 Tab 页，但是 PagerTabStrip 还通过点击 Tab 的标签实现 Tab 页的切换；而 PagerTitleStrip 则不能。

下面是演示 1 和演示 2 共用的 PagerAdapter。代码如下所示：

package com.example.viewpagerdemo2.adapter;

 

import java.util.List;

 

import com.example.viewpagerdemo2.R;

import com.example.viewpagerdemo2.ui.WeiBoActivity;

 

import android.app.Activity;

import android.content.Intent;

import android.support.v4.view.PagerAdapter;

import android.view.View;

import android.view.View.OnClickListener;

import android.view.ViewGroup;

import android.widget.Button;

 

public class NewPagerAdapter extends PagerAdapter {

 

    private Activity activity;

    private List<String> listTitle;

    private List<View> listView;

    private Button button;

    private Intent intent;

 

    public NewPagerAdapter(Activity activity, List<String> title,

            List<View> view) {

        this.activity = activity;

        this.listTitle = title;

        this.listView = view;

    }

 

    @Override

    public int getCount() {

 

        return listTitle.size();

    }

 

    @Override

    public void destroyItem(ViewGroup container, int position, Object object) {

        container.removeView(listView.get(position));

    }

 

    @Override

    public int getItemPosition(Object object) {

        return super.getItemPosition(object);

    }

 

    @Override

    public CharSequence getPageTitle(int position) {

        return listTitle.get(position);

    }

 

    @Override

    public Object instantiateItem(ViewGroup container, int position) {

        container.addView(listView.get(position));

 

        button = (Button) container.findViewById(R.id.button1);

        button.setOnClickListener(new OnClickListener() {

 

            public void onClick(View v) {

                intent = new Intent(activity, WeiBoActivity.class);

                activity.startActivity(intent);

            }

        });

        return listView.get(position);

    }

 

    @Override

    public boolean isViewFromObject(View arg0, Object arg1) {

        // TODO Auto-generated method stub

        return arg0 == arg1;

    }

 

}

ViewPager 控件都要配合一个 ***Adapter，这个 Adapter 或是 Android 提供，或是你新建 Adapter，并继承系统提供的 Adapter，然后调用 ViewPager.setAdapter 方法。

new 一个 Adapter 时，大都是将 Activity 和 adapter 构造自己需要的数据传递给他。

你会发现一个规律：只要有数据，控件就可以自己构造自己。通过 override 相应的方法，控件就知道自己的某个部分，应该利用你提供数据中的那个（些）数据。

演示 3：ViewPager 和动态 Fragment

动态 Fragment 在实际情况中，较为常用。

图 5 ViewPager 和动态 Fragment

package com.example.viewpagerdemo2.ui;

 

import java.util.ArrayList;

import java.util.HashMap;

import java.util.List;

import java.util.Map;

 

import com.example.viewpagerdemo2.R;

import com.example.viewpagerdemo2.adapter.NewFragmentStatePagerAdapter;

 

import android.os.Bundle;

import android.support.v4.app.FragmentActivity;

import android.support.v4.view.PagerTabStrip;

import android.support.v4.view.ViewPager;

 

public class NewFragmentActivityDemo extends FragmentActivity {

 

    private ViewPager mPager;

    private NewFragmentStatePagerAdapter mAdapter;

    private PagerTabStrip myPagerTabStrip;

    private List<Map<String, String>> list;

 

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_tab);

 

        initClass();

 

        initData();

 

        initControl();

 

        initViewPager();

    }

 

    private void initClass() {

        list = new ArrayList<Map<String, String>>();

    }

 

    private void initData() {

        for (int i = 1; i <= 3; i++) {

            Map<String, String> cat = new HashMap<String, String>();

            cat.put("name", "演示3页" + i);

            cat.put("content", String.format("%s", i));

            list.add(cat);

        }

    }

 

    private void initControl() {

        mPager = (ViewPager) findViewById(R.id.myViewPager2);

        myPagerTabStrip = (PagerTabStrip) findViewById(R.id.myPagerTabStrip);

        mAdapter = new NewFragmentStatePagerAdapter(

                getSupportFragmentManager(), list);

    }

 

    private void initViewPager() {

        myPagerTabStrip.setTabIndicatorColor(getResources().getColor(

                R.color.red));

        myPagerTabStrip.setDrawFullUnderline(false);

        myPagerTabStrip.setBackgroundColor(getResources().getColor(

                R.color.green));

        myPagerTabStrip.setTextSpacing(50);

 

        mPager.setAdapter(mAdapter);

    }

}

自定义 Adapter，如下所示：

package com.example.viewpagerdemo2.adapter;

 

import java.util.List;

import java.util.Map;

 

import com.example.viewpagerdemo2.view.NewFragment;

 

import android.support.v4.app.Fragment;

import android.support.v4.app.FragmentManager;

import android.support.v4.app.FragmentStatePagerAdapter;

import android.view.ViewGroup;

 

public class NewFragmentStatePagerAdapter extends FragmentStatePagerAdapter {

    List<Map<String, String>> list;

 

    public NewFragmentStatePagerAdapter(FragmentManager fm,

            List<Map<String, String>> list) {

        super(fm);

        this.list = list;

    }

 

    @Override

    public int getCount() {

        return list.size();

    }

 

    @Override

    public CharSequence getPageTitle(int position) {

        return list.get(position).get("name");

    }

 

    // 初始化每个页卡选项

    @Override

    public Object instantiateItem(ViewGroup arg0, int position) {

        NewFragment ff = (NewFragment) super.instantiateItem(arg0, position);

        ff.setThings(list.get(position), position);

        return ff;

    }

 

    @Override

    public void destroyItem(ViewGroup container, int position, Object object) {

        System.out.println("position Destory" + position);

        super.destroyItem(container, position, object);

    }

 

    @Override

    public Fragment getItem(int arg0) {

        // TODO Auto-generated method stub

        return new NewFragment();

    }

}

FragmentStatePagerAdapter 和 FragmentPagerAdapter 的区别是，FragmentStatePagerAdapter 在当前只会存在前一个 Fragment，其他 Fragment 会销毁，适合加载多数据；而FragmentPagerAdapter 是所有 Fragment 都存在，所以不太适合加载大量的数据 如图片什么的，很容易内存溢出。

每个 ViewPager 里的 Fragment，如下所示：

package com.example.viewpagerdemo2.view;

 

import java.util.Map;

 

import com.example.viewpagerdemo2.R;

 

import android.os.Bundle;

import android.support.v4.app.Fragment;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.TextView;

 

public class NewFragment extends Fragment {

    private Map<String, String> ee;

    private int position;

 

    public void setThings(Map<String, String> ee, int position) {

        this.ee = ee;

        this.position = position;

    }

 

    @Override

    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

    }

 

    @Override

    public View onCreateView(LayoutInflater inflater, ViewGroup container,

            Bundle savedInstanceState) {

        System.out.println("onCreateView = ");

        View v = inflater.inflate(R.layout.fragment_pager, container, false);

        ((TextView) v.findViewById(R.id.myTitle)).setText(ee.get("name")

                + " = " + ee.get("content"));

        return v;

    }

 

    @Override

    public void onActivityCreated(Bundle savedInstanceState) {

        System.out.println("onActivityCreated = ");

        super.onActivityCreated(savedInstanceState);

    }

 

    @Override

    public void onDestroyView() {

        System.out.println("onDestroyView = " + position);

        super.onDestroyView();

    }

 

    @Override

    public void onDestroy() {

        System.out.println("onDestroy = " + position);

        super.onDestroy();

    }

}

下载 Demo

Android 演示 ViewPager的更多相关文章

  1. android下ViewPager的使用,带下部选项栏的切换动画

    (文章针对类似我这种初学者,大神看到不要嘲笑) 演示 我的规矩是先上GIF动画效果(Linux下用转的GIF,清晰度还可以但是不知道为什么放博客上,界面会这么大): 代码: android中有View ...

  2. Android利用ViewPager实现滑动广告板

    •android-support-v4.jar,这是谷歌官方 给我们提供的一个兼容低版本Android设备的软件包,里面包囊了只有在Android3.0以上可以使用的api.而ViewPager就是其 ...

  3. Android 演示 Android ListView 和 github XListView（3-3）

    本文内容 环境 项目结构 演示 1:简单 XListView 演示 2:XListView + Fragment 演示 3:XListView + ViewPager + Fragment 本文三个演 ...

  4. Android中ViewPager实现滑动条及与Fragment结合的实例教程

    ViewPager类主要被用来实现可滑动的视图功能,这里我们就来共同学习Android中ViewPager实现滑动条及与Fragment结合的实例教程,需要的朋友可以参考下 自主实现滑动指示条先上一个 ...

  5. Android中viewPager的一两点使用

    Android中viewPager的一两点使用 viewPager是谷歌官方提供的一种方便实现页面滑动效果的控件,可以直接使用也可以和fragment联合使用.这里只简单说下直接使用. 使用viewP ...

  6. Android中ViewPager+Fragment取消(禁止)预加载延迟加载(懒加载)问题解决方案

    转载请注明出处:http://blog.csdn.net/linglongxin24/article/details/53205878本文出自[DylanAndroid的博客] Android中Vie ...

  7. android之ViewPager

    在android中ViewPager是非常常用的控件.它在android.support.v4.view.ViewPager下.你们自己可以进http://developer.android.com/ ...

  8. Android listview viewpager解决冲突 滑动

    Android listview viewpager滑动 跳动 冲突解决 ListView中嵌套ViewPage有或者滑动手势冲突解决   在listview 上使用 addHeaderView 在第 ...

  9. Android 使用ViewPager实现左右循环滑动图片

    ViewPager这个小demo实现的是可以左右循环滑动图片,下面带索引,滑到最后一页在往右滑动就要第一页,第一页往左滑动就到最后一页,先上效果图,用美女图片是我一贯的作风,呵呵 1.    首先看一 ...

随机推荐

  1. maria-developers 开发者邮件

    https://lists.launchpad.net/maria-developers/

  2. webpack原理与实战

    webpack是一个js打包工具,不一个完整的前端构建工具.它的流行得益于模块化和单页应用的流行.webpack提供扩展机制,在庞大的社区支持下各种场景基本它都可找到解决方案.本文的目的是教会你用we ...

  3. 用 CSS 实现三角形与平行四边形

    最近在逛某个技术网站的时候,感觉文章关键词上的样式好酷炫啊.于是我将那种写法照搬到了我的博客中,也许最近逛过我博客的小伙伴已经发现了它出现在哪儿了——分页的样式.来张截图: 你在首页的底部也可以看到这 ...

  4. 微软为何选择在 Github 上开源 .NET 核心？

    本文来自微软开源.NET 的一篇公告 ,文中阐述了微软为何选择在 Github 开源.NET,以及微软对开源和开源社区方面的认识的变迁. 对于.NET来说,今天(2014/11/12)是个大日子! 我 ...

  5. 十步轻松搞定IIS+PHP环境搭建

    突然心血来潮想着自己一直使用Apache+php的模式,想要了解一下IIS+php的模式.说起来也算是九曲十八弯吧! 第一部分:以ISAPI.dll 扩展的形式 结果按照资料上面说的我就是找不到一个i ...

  6. .Net Discovery系列之三 深入理解.Net垃圾收集机制(上)

    前言: 组成.Net平台一个很重要的部分----垃圾收集器(Garbage Collection),今天我们就来讲讲它.想想看没有GC,.Net还能称之为一个平台吗?各种语言虽然都被编译成MSIL,但 ...

  7. 在Brackets中使用Emmet

    当在Brackets中安装上Emmet插件后,就可以使用Emmet的语法来加速前端编写. 有关html ● 子关系> div>ul>li ● 相邻+ div+p+bq ● 上一级^ ...

  8. 电子书下载：Delphi XE 5 移动开发入门手册（完整版）

    更多电子书请到: http://maxwoods.400gb.com 下载:Delphi XE5移动开发入门手册(完整版)

  9. 用格式工厂将mts文件转换成其它格式flv,mpg失败

    通常情况下,是由帧速率的改变引起的! 看一看你的MTS帧速率是多少,则转换成FLV时,帧速率要一样!----------  这是非常重要的!!!

  10. Android按键添加和处理的方案

    Android按键添加和处理的方案  版本号 说明 作者 日期  1.0  Android按键添加和处理的方案 Sky Wang  2013/06/18        需求:Android机器上有个W ...