Android实战简易教程-第十八枪（ViewPager组件详解）

对于ViewPager组件我们知道：

1）ViewPager类直接继承了ViewGroup类，所有它是一个容器类，可以在其中添加其他的view类。

2）ViewPager类需要一个PagerAdapter适配器类给它提供数据。

3）ViewPager经常和Fragment一起使用，并且提供了专门的FragmentPagerAdapter和FragmentStatePagerAdapter类供Fragment中的ViewPager使用。

下面我们通过实例看一下ViewPager的使用。

一 实现ViewPager（数据源为List<View>）

1.先在main.xml文件中添加一个ViewPager:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content">
    </android.support.v4.view.ViewPager>

</LinearLayout>

2.创建三个View:

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

    <TextView
        android:id="@+id/txt1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:textSize="25dp"
        android:text="第一页" >
    </TextView>

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

    <TextView
        android:id="@+id/txt2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="第二页" >
    </TextView>

</LinearLayout>

<?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" >
    
    <TextView
        android:id="@+id/txt3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="第三页" >
    </TextView>
    
</LinearLayout>
3.创建一个ViewPager适配器类：

package com.yayun.viewpagerdemo;

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

import android.support.v4.view.PagerAdapter;
import android.view.View;
import android.view.ViewGroup;

public class ViewPagerAdapter extends PagerAdapter {
	private List<View> lViews=new ArrayList<View>();

	public ViewPagerAdapter(List<View> lViews){
		this.lViews=lViews;
	}

	@Override
	public int getCount() {
		return lViews.size();
	}

	@Override
	public boolean isViewFromObject(View arg0, Object arg1) {
		return arg0==arg1;
	}
	@Override
	public Object instantiateItem(ViewGroup container, int position) {
		container.addView(lViews.get(position));
		return lViews.get(position);
	}
	@Override
	public void destroyItem(ViewGroup container, int position, Object object) {
		container.removeView(lViews.get(position));
	}

}

4.MainActivity.java:

package com.yayun.viewpagerdemo;

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

import android.support.v7.app.ActionBarActivity;
import android.support.v7.app.ActionBar;
import android.support.v4.app.Fragment;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.view.Window;
import android.os.Build;

public class MainActivity extends ActionBarActivity {
	private ViewPager viewPager;
	private List<View> listViews=null;
	ViewPagerAdapter pagerAdapter;

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

		viewPager=(ViewPager) findViewById(R.id.pager);
		listViews=new ArrayList<View>();
		/**
		 * 为Adapter创建数据源
		 */
		View view1=View.inflate(this, R.layout.view1, null);
		View view2=View.inflate(this, R.layout.view2, null);
		View view3=View.inflate(this, R.layout.view3, null);
		listViews.add(view1);
		listViews.add(view2);
		listViews.add(view3);
		pagerAdapter=new ViewPagerAdapter(listViews) ;
		viewPager.setAdapter(pagerAdapter);

	}

}

5.运行实例：

可以实现翻页效果。

二 添加标题

1.我们需要更改main.xml文件：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center" >

        <android.support.v4.view.PagerTabStrip
            android:id="@+id/strip"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="top" >
        </android.support.v4.view.PagerTabStrip>
    </android.support.v4.view.ViewPager>

</LinearLayout>

2.需要更改适配器文件：

package com.yayun.viewpagerdemo;

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

import android.support.v4.view.PagerAdapter;
import android.view.View;
import android.view.ViewGroup;

public class ViewPagerAdapter extends PagerAdapter {
	private List<View> lViews=new ArrayList<View>();
	private List<String> titleList=new ArrayList<String>();

	public ViewPagerAdapter(List<View> lViews,List<String> titleList){
		this.lViews=lViews;
		this.titleList=titleList;
	}

	@Override
	public int getCount() {
		return lViews.size();
	}

	@Override
	public boolean isViewFromObject(View arg0, Object arg1) {
		return arg0==arg1;
	}
	@Override
	public Object instantiateItem(ViewGroup container, int position) {
		container.addView(lViews.get(position));
		return lViews.get(position);
	}
	@Override
	public void destroyItem(ViewGroup container, int position, Object object) {
		container.removeView(lViews.get(position));
	}
	/**
	 * 标题
	 */
	@Override
	public CharSequence getPageTitle(int position) {
		// TODO Auto-generated method stub
		return titleList.get(position);
	}

}

3.需要更改MainActivity.java文件：

package com.yayun.viewpagerdemo;

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

import android.support.v7.app.ActionBarActivity;
import android.support.v7.app.ActionBar;
import android.support.v4.app.Fragment;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.PagerTabStrip;
import android.support.v4.view.ViewPager;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.view.Window;
import android.os.Build;

public class MainActivity extends ActionBarActivity {
	private ViewPager viewPager;
	private List<View> listViews=null;
	ViewPagerAdapter pagerAdapter;
	PagerTabStrip pagerTabStrip;
	private List<String> titleList;

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

		viewPager=(ViewPager) findViewById(R.id.pager);
		pagerTabStrip=(PagerTabStrip) findViewById(R.id.strip);
		listViews=new ArrayList<View>();
		titleList=new ArrayList<String>();
		titleList.add("第一页");
		titleList.add("第二页");
		titleList.add("第三页");
		/**
		 * 为Adapter创建数据源
		 */
		View view1=View.inflate(this, R.layout.view1, null);
		View view2=View.inflate(this, R.layout.view2, null);
		View view3=View.inflate(this, R.layout.view3, null);
		listViews.add(view1);
		listViews.add(view2);
		listViews.add(view3);
		pagerAdapter=new ViewPagerAdapter(listViews,titleList) ;
		viewPager.setAdapter(pagerAdapter);

	}

}

4.运行实例如下：

三 实现ViewPager(数据源为List<Fragment>)

1.首先我们要创建三个Fragment:

package com.yayun.viewpagerdemo;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class Fragment1 extends Fragment {
	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		return inflater.inflate(R.layout.view1, container, false);
	}

}

package com.yayun.viewpagerdemo;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class Fragment2 extends Fragment {
	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		return inflater.inflate(R.layout.view2, container, false);
	}

}


package com.yayun.viewpagerdemo;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class Fragment3 extends Fragment {
	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		return inflater.inflate(R.layout.view3, container, false);
	}

}

2.设置Adapter:

package com.yayun.viewpagerdemo;

import java.util.List;

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;

public class MyFragmentPagerAdapter extends FragmentPagerAdapter {
	List<Fragment> fragmentsList;
	List<String> titleList;

	public MyFragmentPagerAdapter(FragmentManager fm,List<Fragment> fragmentsList,List<String> titleList) {
		super(fm);
		this.fragmentsList=fragmentsList;
		this.titleList=titleList;
	}

	@Override
	public Fragment getItem(int arg0) {
		// TODO Auto-generated method stub
		return fragmentsList.get(arg0);
	}

	@Override
	public int getCount() {
		// TODO Auto-generated method stub
		return fragmentsList.size();
	}
@Override
/**
 * 添加标题
 */
public CharSequence getPageTitle(int position) {
	// TODO Auto-generated method stub
	return titleList.get(position);
}

}

3.MainActivity.java:

package com.yayun.viewpagerdemo;

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

import android.graphics.Color;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.view.PagerTabStrip;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.PageTransformer;
import android.support.v7.app.ActionBarActivity;
import android.view.View;
import android.view.Window;

public class MainActivity extends ActionBarActivity {
	private ViewPager viewPager;
	private List<View> listViews=null;
	ViewPagerAdapter pagerAdapter;
	PagerTabStrip pagerTabStrip;
	private List<String> titleList;
	private List<Fragment> fragmentsList;
	MyFragmentPagerAdapter myFragmentPagerAdapter;

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

		viewPager=(ViewPager) findViewById(R.id.pager);
		pagerTabStrip=(PagerTabStrip) findViewById(R.id.strip);

		/**
		 * 设置PagerTabStrip属性
		 */
		pagerTabStrip.setBackgroundColor(Color.GREEN);
		pagerTabStrip.setDrawFullUnderline(false);
		pagerTabStrip.setTextColor(Color.WHITE);
		listViews=new ArrayList<View>();
		titleList=new ArrayList<String>();
		fragmentsList=new ArrayList<Fragment>();
		fragmentsList.add(new Fragment1());
		fragmentsList.add(new Fragment2());
		fragmentsList.add(new Fragment3());
		titleList.add("第一页");
		titleList.add("第二页");
		titleList.add("第三页");
		/**
		 * 为Adapter创建数据源
		 */
		View view1=View.inflate(this, R.layout.view1, null);
		View view2=View.inflate(this, R.layout.view2, null);
		View view3=View.inflate(this, R.layout.view3, null);
		listViews.add(view1);
		listViews.add(view2);
		listViews.add(view3);
		pagerAdapter=new ViewPagerAdapter(listViews,titleList) ;
		myFragmentPagerAdapter=new MyFragmentPagerAdapter(getSupportFragmentManager(), fragmentsList, titleList);
		//viewPager.setAdapter(pagerAdapter);
		viewPager.setAdapter(myFragmentPagerAdapter);

	}

}

4.运行实例：

这种方法不会销毁不在当前页面的页面，不能实现页卡的创建和销毁。

四 实现ViewPager(数据源为List<Fragment>实现FargmentStatePagerAdapter)常用

改变Adapter:

package com.yayun.viewpagerdemo;

import java.util.List;

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.app.FragmentStatePagerAdapter;
import android.view.View;

public class MyFragmentPagerAdapter2 extends FragmentStatePagerAdapter {
	List<Fragment> fragmentsList;
	List<String> titleList;

	public MyFragmentPagerAdapter2(FragmentManager fm,List<Fragment> fragmentsList,List<String> titleList) {
		super(fm);
		this.fragmentsList=fragmentsList;
		this.titleList=titleList;
	}

	@Override
	public Fragment getItem(int arg0) {
		// TODO Auto-generated method stub
		return fragmentsList.get(arg0);
	}

	@Override
	public int getCount() {
		// TODO Auto-generated method stub
		return fragmentsList.size();
	}
@Override
/**
 * 添加标题
 */
public CharSequence getPageTitle(int position) {
	// TODO Auto-generated method stub
	return titleList.get(position);
}
@Override
public Object instantiateItem(View container, int position) {
	// TODO Auto-generated method stub
	return super.instantiateItem(container, position);
}
@Override
public void destroyItem(View container, int position, Object object) {
	// TODO Auto-generated method stub
	super.destroyItem(container, position, object);
}

}

将MainActivity.java中的Adapter换一下即可，它可以实现页卡的创建和销毁。

五  onPagerChangeListener 监听使用

只需要修改MainActivity.java:

package com.yayun.viewpagerdemo;

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

import android.graphics.Color;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.view.PagerTabStrip;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.support.v4.view.ViewPager.PageTransformer;
import android.support.v7.app.ActionBarActivity;
import android.view.View;
import android.view.Window;
import android.widget.Toast;

public class MainActivity extends ActionBarActivity implements OnPageChangeListener {
	private ViewPager viewPager;
	private List<View> listViews=null;
	ViewPagerAdapter pagerAdapter;
	PagerTabStrip pagerTabStrip;
	private List<String> titleList;
	private List<Fragment> fragmentsList;
	MyFragmentPagerAdapter myFragmentPagerAdapter;

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

		viewPager=(ViewPager) findViewById(R.id.pager);
		pagerTabStrip=(PagerTabStrip) findViewById(R.id.strip);

		/**
		 * 设置PagerTabStrip属性
		 */
		pagerTabStrip.setBackgroundColor(Color.GREEN);
		pagerTabStrip.setDrawFullUnderline(false);
		pagerTabStrip.setTextColor(Color.WHITE);
		listViews=new ArrayList<View>();
		titleList=new ArrayList<String>();
		fragmentsList=new ArrayList<Fragment>();
		fragmentsList.add(new Fragment1());
		fragmentsList.add(new Fragment2());
		fragmentsList.add(new Fragment3());
		titleList.add("第一页");
		titleList.add("第二页");
		titleList.add("第三页");
		/**
		 * 为Adapter创建数据源
		 */
		View view1=View.inflate(this, R.layout.view1, null);
		View view2=View.inflate(this, R.layout.view2, null);
		View view3=View.inflate(this, R.layout.view3, null);
		listViews.add(view1);
		listViews.add(view2);
		listViews.add(view3);
		pagerAdapter=new ViewPagerAdapter(listViews,titleList) ;
		myFragmentPagerAdapter=new MyFragmentPagerAdapter(getSupportFragmentManager(), fragmentsList, titleList);
		//viewPager.setAdapter(pagerAdapter);
		viewPager.setAdapter(myFragmentPagerAdapter);
		viewPager.setOnPageChangeListener(this);//加载监听器

	}

	@Override
	public void onPageScrollStateChanged(int arg0) {
		// TODO Auto-generated method stub

	}

	@Override
	public void onPageScrolled(int arg0, float arg1, int arg2) {
		// TODO Auto-generated method stub

	}

	@Override
	public void onPageSelected(int arg0) {
		Toast.makeText(this, "当前页面为"+(arg0+1), Toast.LENGTH_SHORT).show();

	}

}

运行实例即可以显示当前页面标签。

总结

1.android.support.v4.view.ViewPager全名；

2.android.support.v4.view.PagerTabStrip作为标题名称

喜欢的朋友可以关注，谢谢

时间： 2024-10-06 00:40:44

Android实战简易教程-第十八枪（ViewPager组件详解）的相关文章

Android实战简易教程-第二十八枪（Uri转String型实例）

接上一篇文章.我们能够轻易的获取所选图片的uri,那么我们考虑怎样将获取的uri转换成String型的地址呢? 接下来我们通过实例来研究.布局文件和上篇(二十七枪)一致,我们就不再列出,直接看MainActivity.java: package com.example.userphoto; import java.io.File; import android.app.Activity; import android.content.Intent; import android.database

Android实战简易教程-第二十八枪（基于Bmob实现头像图片设置和网络上传功能！）

上一篇我们介绍了怎样由uri转换成String ,本文就用到了上篇文章的方法.以下我们介绍一下怎样设置头像后将头像图片上传到云端的方法,本文基于Bmob提供的服务. 看一下代码:(布局文件和前两篇文章依然一样,不再提供) package com.example.userphoto; import java.io.File; import android.app.Activity; import android.content.Intent; import android.database.Cur

Android实战简易教程-第二十五枪（基于Baas的数据表查询下拉刷新和上拉加载实现！）

上一节我们实现了数据表的加载,但是,当数据表数据很多时,我们就要考虑数据的分页,这里我们选用了PullToRefreshListView控件,先看一下该控件的说明: 效果图:                                 正在刷新                                                                       刷新后        一.导入Library 下载源码后(https://github.com/chrisba

Android实战简易教程-第十六枪（LineChart实现数据趋势展示）

aChartEngine中的line Chart是线图,是数据显示的一种.首先我们要下载aChartEngine的jar包,然后导入到工程中. 直接看一下代码(部分注释): package com.yayun.linechart; import java.util.ArrayList; import java.util.List; import org.achartengine.ChartFactory; import org.achartengine.chart.PointStyle; imp

Android实战简易教程-第十五枪（实现ListView中Button点击事件监听）

1.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" androi

Android实战简易教程-第二十九枪（基于Face++实现年龄识别APP（一））

我们通过Face++提供的api和服务实现HowOld App的开发.首先我们实现图片的选择功能. 1.main.xml: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/container" android:la

Android实战简易教程-第二十六枪（基于ViewPager实现微信页面切换效果）

1.头部布局文件top.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="40dp" an

Android实战简易教程-第十九枪（SwipeRefreshLayout下拉刷新使用实例）

我们来看SwipeRefreshLayout的具体用法,顾名思义此组件就是一个布局,只不过要注意的是此布局内只能有一个直接子View.其实通过文档我们可以知道SwipeRefreshLayout只不过是继承了ViewGroup. 查看文档,我们可以知道,在SwipRefreshLayout中存在一个接口,通过此接口我们可以监听滑动手势,其实使用此组件最重要的步骤就是实现此接口的onRefresh方法,在此方法中实现数据的更新操作.如下: 接口中的方法: 除了OnRefreshListener接口

Android实战简易教程-第十一枪（树形组件：ExpandableListView显示和动态添加删除）

ListView组件可以为用户提供列表的显示功能,但是如果想对这些列表数据进行分组管理,则需要使用android.widget.ExpandableListView组件完成. 与ListView组件一样,如果想要进行数据显示的设置,也需要一个适配器类,但是此时不再继承之前的BaseAdapter,而是继承BaseExpandableListAdapter类完成,此类为抽象类,所以要实现其中的所有抽象方法. 一.创建ExpandableListView 1.定义适配器类-MyExpandableL