Android design包 TabLayout

android 5.0 的新特性 主要是配合ViewPager来使用，很多项目中都会用到这个东西，我就简单来记录一下。
先写基本用吗 xml文件里面

<android.support.design.widget.TabLayout
    android:id="@+id/tab"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"></android.support.design.widget.TabLayout>

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

然后在activity里面初始化控件，然后就是需要新建fragment 新建一个adapter，先上一个简单adapter的代码

private ArrayList<Fragment> mArrayList;//存放fragment的集合
private ArrayList<String> mStrings;//存放标题的集合

public MyVpAdapter(FragmentManager fm, ArrayList<Fragment> mArrayList, ArrayList<String> mStrings) {
    super(fm);
    this.mArrayList = mArrayList;
    this.mStrings = mStrings;
}

@Override
public Fragment getItem(int position) {
    return mArrayList.get(position);
}

@Override
public int getCount() {
    return mArrayList == null ? 0 : mArrayList.size();//判空
}

@Override
public CharSequence getPageTitle(int position) {
    return mStrings.get(position);//获取对应的标题，然后赋值给对应的tablaout

fragment就是简单的继承一下fragment就可以了，然后填充一下布局，就没那么简单 代码不上了，然后就是activity的代码。

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    mTabLayout = (TabLayout) findViewById(R.id.tab);
    mViewPager = (ViewPager) findViewById(R.id.vp);
    mStringArrayList = new ArrayList<>();
    mFragmentArrayList = new ArrayList<>();
    for (int i = 0; i < count; i++) {//造假数据
        int pages = i + 1;
        mStringArrayList.add("页面=----->" + pages);
    }
    for (int i = 0; i < mStringArrayList.size(); i++) {//把fragment添加到集合中
        Fragment fragment = new TestFragment();
        Bundle bundle = new Bundle();
        bundle.putString("key", mStringArrayList.get(i));
        fragment.setArguments(bundle);
        mFragmentArrayList.add(fragment);
    }
    MyVpAdapter myVpAdapter = new MyVpAdapter(getSupportFragmentManager(), mFragmentArrayList, mStringArrayList);
    mViewPager.setAdapter(myVpAdapter);//给viewpager添加适配器
    mTabLayout.setupWithViewPager(mViewPager);//tablayout和viewpager建立联系，，这个很重要
    mTabLayout.setSelectedTabIndicatorHeight(2);//设置tablayout底部滑标的高度
    mTabLayout.setSelectedTabIndicatorColor(Color.YELLOW);//设置滑标颜色 现在是黄色

// for (int i = 0; i < mTabLayout.getTabCount(); i++) {
// TabLayout.Tab tb = mTabLayout.getTabAt(i);//获取对应位置的tab
// tb.setIcon(R.mipmap.ic_launcher);//设置tab的图标
// }
//设置标题的正常颜色和选择颜色
mTabLayout.setTabTextColors(Color.GREEN, Color.RED);
//设置标题的背景色
// mTabLayout.setBackgroundColor(Color.MAGENTA);
}

效果图.png

是不是感觉很丑 并不是我们想要的那种效果，那么就在xml文件的tablyout里面添加一行代码

<android.support.design.widget.TabLayout
    android:id="@+id/tab"
    android:layout_width="match_parent"
    app:tabMode="scrollable"//滑动
    android:layout_height="wrap_content"></android.support.design.widget.TabLayout>

效果图2.png

是不是好看多了 ， 没那么丑了。还可以设置图片加文字 或者单纯的图片，注释掉的代码放开后，你就会发现是图片加文字的效果了。
这里写的是一些简单的使用，基本上能够满足使用，骚操作的话问百度吧。