PagerTabStrip与PagerTitleStrip添加标题栏的异同

前言:在前两篇文章中,我们讲解了滑动页面的的实现方法与四大函数的意义,但有时,仅仅实现页面滑动是不够的,还要有标题栏才会显得更友好。所以在这篇文章中,我将会向大家展示在android.support.v4包中的两个控件PagerTabStrip与PagerTitleStrip,他们都是用来实现标题栏的,但各自有些不同,在这篇文章中,我们就讲讲它们各自都能实现怎样的功能,又有哪些异同点。

相关文章:

1、《ViewPager 详解(一)—基本入门》

2、《ViewPager 详解(二)—详解四大函数》

3、《ViewPager 详解(三)—PagerTabStrip与PagerTitleStrip添加标题栏的异同》

4、《ViewPager 详解(四)—-自主实现滑动指示条》

5、《ViewPager 详解(五)—–使用Fragment实现ViewPager滑动》

一、PagerTitleStrip

先看个简单的,先上个效果图,吸引大家一下眼球。

三个页面间的滑动,此时是带着上面的标题一块滑动的。

看一下android 对于PagerTabStrip的官方解释:

Class Overview

PagerTitleStrip is a non-interactive indicator of the current, next, and previous pages of aViewPager. It is intended to be used as a child view of a ViewPager widget in your XML layout. Add it as a child of a ViewPager in your layout file and set its android:layout_gravity to TOP or BOTTOM to pin it to the top or bottom of the ViewPager. The title from each page is supplied by the methodin the adapter supplied to the ViewPager.

For an interactive indicator, seePagerTabStrip.

翻译:

PagerTabStrip是ViewPager的一个关于当前页面、上一个页面和下一个页面的一个非交互的指示器。它经常作为ViewPager控件的一个子控件被被添加在XML布局文件中。在你的布局文件中,将它作为子控件添加在ViewPager中。而且要将它的 android:layout_gravity 属性设置为TOP或BOTTOM来将它显示在ViewPager的顶部或底部。每个页面的标题是通过适配器的函数提供给ViewPager的。

我可能译的不大通顺,这里英文也难度不大,大家应该也能看得懂,但我还是着重讲两点:

1、首先,文中提到:在你的布局文件中,将它作为子控件添加在ViewPager中。

2、第二,标题的获取,是重写适配器的getPageTitle(int)函数来获取的。

根据这两点,我们就可以看代码了:

1、XML布局文件:<RelativeLayout xmlns:android=""xmlns:tools=""android:layout_width="match_parent"android:layout_height="match_parent"tools:context="com.example.testviewpage_2.MainActivity" ><android.support.v4.view.ViewPagerandroid:id="@+id/viewpager"android:layout_width="wrap_content"android:layout_height="200dip"android:layout_gravity="center"><android.support.v4.view.PagerTitleStripandroid:id="@+id/pagertitle"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="top"/></android.support.v4.view.ViewPager></RelativeLayout>清楚的看到我们将.PagerTitleStrip将其作为ViewPager的子控件直接嵌入其中;这是第一步;当然android:layout_gravity=""的值要设置为top或bottom。将标题栏显示在顶部或底部。2、重写适配器的getPageTitle()函数便于大家有个整体认识,先贴全局代码,然后再逐个讲,这段代码是在《ViewPager 详解(二)—详解四大函数》直接更改来的,如果不太明白,先看看这篇文章。package com.example.testviewpage_2;/** * @author harvic * @date 2014.8.12 */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.PagerTitleStrip;import android.support.v4.view.ViewPager;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;public class MainActivity extends Activity {private View view1, view2, view3;private List<View> viewList;// view数组private ViewPager viewPager; // 对应的viewPagerprivate List<String> titleList; //标题列表数组@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);viewPager = (ViewPager) findViewById(R.id.viewpager);LayoutInflater inflater = getLayoutInflater();view1 = inflater.inflate(R.layout.layout1, null);view2 = inflater.inflate(R.layout.layout2, null);view3 = inflater.inflate(R.layout.layout3, null);viewList = new ArrayList<View>();// 将要分页显示的View装入数组中viewList.add(view1);viewList.add(view2);viewList.add(view3);titleList = new ArrayList<String>();// 每个页面的Title数据titleList.add("王鹏");titleList.add("姜语");titleList.add("结婚");PagerAdapter pagerAdapter = new PagerAdapter() {@Overridepublic boolean isViewFromObject(View arg0, Object arg1) {// TODO Auto-generated method stub//根据传来的key,找到view,判断与传来的参数View arg0是不是同一个视图return arg0 == viewList.get((int)Integer.parseInt(arg1.toString()));}@Overridepublic int getCount() {// TODO Auto-generated method stubreturn viewList.size();}@Overridepublic void destroyItem(ViewGroup container, int position,Object object) {// TODO Auto-generated method stubcontainer.removeView(viewList.get(position));}@Overridepublic Object instantiateItem(ViewGroup container, int position) {// TODO Auto-generated method stubcontainer.addView(viewList.get(position));//把当前新增视图的位置(position)作为Key传过去return position;}@Overridepublic CharSequence getPageTitle(int position) {// TODO Auto-generated method stubreturn titleList.get(position);}};viewPager.setAdapter(pagerAdapter);}}相比较《ViewPager 详解(二)—详解四大函数》这里作了一点更改:1、变量private List<String> titleList; //标题列表数组申请了一个String数组,用来存储三个页面所对应的标题的2、初始化titleList = new ArrayList<String>();// 每个页面的Title数据titleList.add("王鹏");titleList.add("姜语");titleList.add("结婚");在初始化阶段增加了这么一段初始化数组的代码。3、重写CharSequence getPageTitle(int )函数@Overridepublic CharSequence getPageTitle(int position) {// TODO Auto-generated method stubreturn titleList.get(position);}根据位置返回当前所对应的标题。

销售世界上第一号的产品——不是汽车,

PagerTabStrip与PagerTitleStrip添加标题栏的异同

相关文章:

你感兴趣的文章:

标签云: