详解Android中ViewPager的PagerTabStrip子控件的用法

详解Android中ViewPager的PagerTabStrip子控件的用法,第1张

概述我们先来看一个小例子:可以看到,效果实现的也是很棒,比之前自定义的标签指示器更加的流畅。下面,简单介绍一下PagerTabStrip和它的使用。

我们先来看一个小例子:

可以看到,效果实现的也是很棒,比之前自定义的标签指示器更加的流畅。下面,简单介绍一下 PagerTabStrip和它的使用。

PagerTabStrip是v4支持包里面的类,是VIEwPager专用的类,不能在其他地方使用。在使用的时候,我们只需要在VIEwPager的布局里面声明即可。

    如下面的代码

<?xml version="1.0" enCoding="utf-8"?><linearLayout xmlns:androID="http://schemas.androID.com/apk/res/androID" androID:layout_wIDth="fill_parent" androID:layout_height="fill_parent" androID:background="@androID:color/white" androID:orIEntation="vertical" > <androID.support.v4.vIEw.VIEwPager  androID:ID="@+ID/vIEwPager"  androID:layout_wIDth="match_parent"  androID:layout_height="match_parent" >  <androID.support.v4.vIEw.PagerTabStrip   androID:layout_wIDth="match_parent"   androID:layout_height="wrap_content"   androID:layout_gravity="top"   androID:background="@androID:color/holo_blue_light"   androID:textcolor="@androID:color/white" /> </androID.support.v4.vIEw.VIEwPager></linearLayout>

我们可以设置layout_gravity属性,比如top或者是bottom,来控制显示的位置。除此之外,不需要进行其他设置。

    剩下的,就是我们需要在代码里面实现的了。

import java.util.ArrayList;import java.util.List;import androID.os.Bundle;import androID.support.v4.app.Fragment;import androID.support.v4.app.FragmentActivity;import androID.support.v4.app.FragmentPagerAdapter;import androID.support.v4.vIEw.VIEwPager;public class PagerTabStripActivity extends FragmentActivity { private List<Fragment> fragments; private VIEwPager vIEwPager; private List<String> TitleList; @OverrIDe public voID onCreate(Bundle savedInstanceState) {  super.onCreate(savedInstanceState);  setContentVIEw(R.layout.main);  initVIEw(); } private voID initVIEw() {  vIEwPager = (VIEwPager) findVIEwByID(R.ID.vIEwPager);  TitleList = new ArrayList<String>();  TitleList.add("最新推荐");  TitleList.add("游戏娱乐");  TitleList.add("影音视频");  fragments = new ArrayList<Fragment>();  fragments.add(new MyFragment(androID.R.color.holo_green_light));  fragments.add(new MyFragment(androID.R.color.holo_orange_light));  fragments.add(new MyFragment(androID.R.color.holo_red_light));  FragmentPagerAdapter adapter = new FragmentPagerAdapter(    getSupportFragmentManager()) {   @OverrIDe   public int getCount() {    return 3;   }   @OverrIDe   public Fragment getItem(int position) {    return fragments.get(position);   }   @OverrIDe   public CharSequence getPageTitle(int position) {    return TitleList.get(position);   }  };  vIEwPager.setAdapter(adapter); }}

在上面的代码里面,展现了我们如何控制标题的文字,我们只需要重写getPagerTitle方法即可。
下面我们再来结合例子细说一下PagerTabStrip:

PagerTabStrip是VIEwPager的一个关于当前页面、上一个页面和下一个页面的一个可交互的指示器。它经常作为VIEwPager控件的一个子控件被被添加在XML布局文件中。在你的布局文件中,将它作为子控件添加在VIEwPager中。而且要将它的 androID:layout_gravity 属性设置为top或BottOM来将它显示在VIEwPager的顶部或底部。每个页面的标题是通过适配器的getPageTitle(int)函数提供给VIEwPager的。
用法与PagerTitleStrip完全相同,即:

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

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

看看实例:
1、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"   tools:context="com.example.testvIEwpage_2.MainActivity" >    <androID.support.v4.vIEw.VIEwPager     androID:ID="@+ID/vIEwpager"     androID:layout_wIDth="wrap_content"     androID:layout_height="wrap_content"     androID:layout_gravity="center">              <androID.support.v4.vIEw.PagerTabStrip       androID:ID="@+ID/pagertab"       androID:layout_wIDth="match_parent"       androID:layout_height="wrap_content"        androID:layout_gravity="top"/>        </androID.support.v4.vIEw.VIEwPager>  </relativeLayout> 

可以看到,同样,是将PagerTabStrip作为VIEwPager的一个子控件直接插入其中,当然androID:layout_gravity=""的值一样要设置为top或bottom。
2、重写适配器的getPageTitle()函数
全部代码:

package com.example.testvIEwpage_2; 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.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; // 对应的vIEwPager    private List<String> TitleList;    @OverrIDe   protected 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() {        @OverrIDe       public boolean isVIEwFromObject(VIEw arg0,Object arg1) {         // Todo auto-generated method stub         return arg0 == arg1;       }        @OverrIDe       public int getCount() {         // Todo auto-generated method stub         return vIEwList.size();       }        @OverrIDe       public voID destroyItem(VIEwGroup container,int position,Object object) {         // Todo auto-generated method stub         container.removeVIEw(vIEwList.get(position));       }        @OverrIDe       public Object instantiateItem(VIEwGroup container,int position) {         // Todo auto-generated method stub         container.addVIEw(vIEwList.get(position));          return vIEwList.get(position);       }        @OverrIDe       public CharSequence getPageTitle(int position) {                  return TitleList.get(position);       }     };      vIEwPager.setAdapter(pagerAdapter);    }  } 

这里的代码与PagerTitleStrip的完全相同,就不再讲解了。
就这样,我们就讲完了有关PagerTabStrip的简单使用方法。下面讲一讲PagerTabStrip的扩展。

3、扩展:PagerTabStrip属性更改
在源码中,大家可以看到有个工程叫TestVIEwPage_PagerTabStrip_extension,运行一下,效果是这样的:

在上面两个图中可以看到,我更改了两个地方:

(1)下划线颜色,原生是黑色,我变成了绿色;

(2)在Tab标题前加了一个图片;

下面说说是如何更改的:

1、更改下划线颜色:
主要靠PagerTabStrip的setTabIndicatorcolorResource方法;

代码如下:

pagerTabStrip = (PagerTabStrip) findVIEwByID(R.ID.pagertab); pagerTabStrip.setTabIndicatorcolorResource(R.color.green); 

2、添加标题――重写适配器CharSequence getPageTitle(int)方法
在CharSequence getPageTitle(int position)方法返回值是,我们不返回String对象,而采用SpannableStringBuilder来构造了下包含图片的扩展String对像;
具体代码如下,不再细讲,大家可以看看SpannableStringBuilder的使用方法,就可理解了。

@OverrIDe public CharSequence getPageTitle(int position) {    SpannableStringBuilder ssb = new SpannableStringBuilder(" "+TitleList.get(position)); // space added before text                     // for   Drawable myDrawable = getResources().getDrawable(       R.drawable.ic_launcher);   myDrawable.setBounds(0,myDrawable.getIntrinsicWIDth(),myDrawable.getIntrinsicHeight());   ImageSpan span = new ImageSpan(myDrawable,ImageSpan.AliGN_BASEliNE);    ForegroundcolorSpan fcs = new ForegroundcolorSpan(color.GREEN);// 字体颜色设置为绿色   ssb.setSpan(span,1,Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);// 设置图标   ssb.setSpan(fcs,ssb.length(),Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);// 设置字体颜色   ssb.setSpan(new relativeSizeSpan(1.2f),Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);   return ssb; } 

总结

以上是内存溢出为你收集整理的详解Android中ViewPager的PagerTabStrip子控件的用法全部内容,希望文章能够帮你解决详解Android中ViewPager的PagerTabStrip子控件的用法所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1142029.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-31
下一篇 2022-05-31

发表评论

登录后才能评论

评论列表(0条)

保存