Android v4包下的PagerTitleStrip PagerTabStrip ViewPager的页面标题
原创
©著作权归作者所有:来自51CTO博客作者shineflowers的原创作品,请联系作者获取转载授权,否则将追究法律责任
1、添加android support包
因为几个类都是在android support包中才提供,我们先添加android-support-v4.jar文件到工程的libs目录下即可。
2. activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<!--
注意事项:
1.这里ViewPager和 PagerTabStrip都要把包名写全了,不然会ClassNotFount
2.API中说:在布局xml把PagerTabStrip当做ViewPager的一个子标签来用,不能拿出来,不然还是会报错
3.在PagerTabStrip标签中可以用属性android:layout_gravity=TOP|BOTTOM来指定title的位置
4.如果要显示出PagerTabStrip某一页的title,需要在ViewPager的adapter中实现getPageTitle(int)
-->
<android.support.v4.view.ViewPager
android:id="@+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:background="#6B92A5" >
<android.support.v4.view.PagerTabStrip
android:id="@+id/pager_tabstrip"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:background="#33b5e5"
android:textColor="#ffffff" />
<!--
<android.support.v4.view.PagerTitleStrip
android:id="@+id/pagertitle"
android:layout_width="fill_parent"
android:layout_height="45dp"
android:layout_gravity="bottom"
android:visibility="gone" />
-->
</android.support.v4.view.ViewPager>
</RelativeLayout>
这里面有两个控件PagerTitleStrip和PagerTabStrip,这两个控件必须当作ViewPager的子控件来用,否则会报错。
两个控件有什么区别呢?
简单的理解就是:
PagerTabStrip:交互式
PagerTitleStrip:非交互式
经过简单测试发现:
PagerTabStrip:
① 点击上面的标题可以实现ViewPager的切换。
② 选中的文字下方包含指引线
③ 显示全宽下划线(setDrawFullUnderline)
PagerTitleStrip:
① 点击上面的标题无反应。
② 无上述描述。
3. 设置title值
PagerAdater里面有一个getPageTitle,需要重写,然后可以根据不同的page返回不同的title。
private class MyPagerAdapter extends PagerAdapter {
@Override
public int getCount() {
return mImageListView.size();
}
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0 == arg1;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
container.addView(mImageListView.get(position));
return mImageListView.get(position);
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView(mImageListView.get(position));
}
@Override
public CharSequence getPageTitle(int position) {
switch (position) {
case 0:
return "页面0";
case 1:
return "页面1";
case 2:
return "页面2";
case 3:
return "页面3";
}
return super.getPageTitle(position);
}
}
效果如下: