在昨天的文章中,我们使用ViewPager制作了一个简单的滑动切换的例子。今天让我们在昨天的基础之上,利用ViewPager来制作一个可以滑动的Tab。要实现这样的功能,除了ViewPager外,我们还需要一个PagerTabStrip来配合使用。简单说一下PagerTabStrip,Google官方描述为:PagerTabStrip是当前,未来和以前的页面的交互指标ViewPager。它旨在用作ViewPager插件在XML布局的子图。添加为ViewPager的孩子在你的布局文件,并设置其Android:layout_gravity到顶部或底部的钉选到ViewPager的顶部或底部。从每个页面的标题是由方法提供
getPageTitle(INT)在提供给ViewPager的适配器。这段话的大致意思就是说,PagerTabStrip是一个ViewPager的子控件,不能单独使用。通过layout_gravity属性来控制它显示的位置。使用getPageTitle()方法返回页面的标题。通过对这段话的理解我们可以设计出下面的布局代码:
.support.v4.view.PagerTabStrip>
.support.v4.view.ViewPager>
接下来,类似地,我们来编写一个ViewPaperAdapter类来实现getPageTitle()方法
package com.Android.ViewPagerTab;
import java.util.ArrayList;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.View;
public class ViewPagerAdapter extends PagerAdapter
{
//存放View的数组
private ArrayList Views;
//存放Title的数组
private ArrayList Titles;
public ViewPagerAdapter(ArrayList Views,ArrayList Titles)
{
this.Views=Views;
this.Titles=Titles;
}
//获取PageTitle
@Override
public CharSequence getPageTitle(int position)
{
return Titles.get(position);
}
@Override
public void destroyItem(View container, int position, Object object)
{
((ViewPager)container).removeView(Views.get(position));
}
@Override
public Object instantiateItem(View container, int position)
{
((ViewPager)container).addView(Views.get(position),0);
return Views.get(position);
}
@Override
public int getCount()
{
if(Views!=null)
{
return Views.size();
}
return 0;
}
@Override
public boolean isViewFromObject(View view, Object object)
{
return (view==object);
}
}
这个适配器类和昨天的基本上时一致的,唯一的不同就在于它需要实现getPageTitle()方法。这里,我们通过构造函数来初始化一个存放标题的数组,通过返回这个数组中指定索引项对应的值来实现getPageTitle()方法。
到目前为止,适配器和界面都已经编写完成了,那么接下来,我们需要填充适配器,通过构造函数,我们知道,我们需要一个Views和Titles。对于Titles我们只需要写入一些字符串就可以了。对于Views,我们需要创建一些界面布局代码,简单的代码如下:
该布局将在屏幕中央显示一个字符串,这个为了简单,其它的布局都和这个布局是一样的,唯一的不同是它们显示不同的字符串。
现在我们来编写主要的逻辑代码:
package com.Android.ViewPagerTab;
import java.util.ArrayList;
import android.os.Bundle;
import android.app.Activity;
import android.support.v4.view.PagerTabStrip;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.View;
import android.view.Window;
public class MainActivity extends Activity implements OnPageChangeListener {
//存放view的数组
private ArrayList Views;
//适配器类
private ViewPagerAdapter mAdapter;
//存放标题的数组
private ArrayList Titles;
//PagerTabStrip
private PagerTabStrip PagerTab;
//ViewPager
private ViewPager mViewPager;
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
//取得ViewPager实例
mViewPager=(ViewPager)findViewById(R.id.ViewPager);
//取得ViewTabStrip实例
PagerTab=(PagerTabStrip)findViewById(R.id.PagerTab);
//设置Tab选中时的颜色
PagerTab.setTabIndicatorColor(getResources().getColor(R.color.black));
//设置Tab是否显示下划线
PagerTab.setDrawFullUnderline(true);
//设置Tab背景色
PagerTab.setBackgroundColor(getResources().getColor(R.color.white));
//设置Tab间的距离?我感觉是这样
PagerTab.setTextSpacing(50);
//初始化Views
Views=new ArrayList();
LayoutInflater Inflater=LayoutInflater.from(this);
Views.add(Inflater.inflate(R.layout.activity_tab1, null));
Views.add(Inflater.inflate(R.layout.activity_tab2, null));
Views.add(Inflater.inflate(R.layout.activity_tab3, null));
//初始化Titles
Titles=new ArrayList();
Titles.add("Tab1");
Titles.add("Tab2");
Titles.add("Tab3");
//初始化适配器
mAdapter=new ViewPagerAdapter(Views,Titles);
mViewPager.setAdapter(mAdapter);
//默认显示第二项
SetTab(1);
}
public void SetTab(int index)
{
switch(index)
{
case 0:
mViewPager.setCurrentItem(0);
break;
case 1:
mViewPager.setCurrentItem(1);
break;
case 2:
mViewPager.setCurrentItem(2);
break;
}
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
@Override
public void onPageScrollStateChanged(int arg0) {
// TODO 自动生成的方法存根
}
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
// TODO 自动生成的方法存根
}
@Override
public void onPageSelected(int position)
{
SetTab(position);
}
}
这一部分的代码和昨天的基本一致,需要实现OnPageSelected()方法接口。最终的运行效果图如下所示: