android tablayout结合viewpager实现带导航条的滑动页卡

在之前很多人习惯用tabhost结合viewpager来实现滑动的tabhost。

不过谷歌在android.support:desing:23.1.1包有了更简单的做法。

该包需要自行导入。。在android studio里面是直接导入就行了。

下面列出tablayout的基本属性。。

tabLayout.setSelectedTabIndicatorColor   //tablayout导航条的颜色

tabLayout.setSelectedTabIndicatorHeigh   //tablayout导航条的大小

tabLayout.setTabTextColors(Color.WHITE, Color.BLACK);  //第一个参数表示当前页面没有被显示的时候的页面标题颜色。第二个参数相反。

下面给出代码。。

布局代码

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
<android.support.design.widget.TabLayout
    android:layout_width="match_parent"
    android:id="@+id/tablayout"
    android:layout_height="wrap_content"
    android:background="#FFE154E1"

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


</LinearLayout>
java代码(另外建立了两个fragment的类来作为list的数据源)
import android.graphics.Color;
import android.support.design.widget.TabLayout;
import android.support.v4.app.*;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {
    private TabLayout tabLayout;
    private ViewPager viewPager;
    private List<android.support.v4.app.Fragment> list;
    private FragmentPagerAdapter fragmentPagerAdapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        tabLayout = (TabLayout) findViewById(R.id.tablayout);
        tabLayout.setSelectedTabIndicatorColor(Color.parseColor("#FF5E365E"));
        tabLayout.setSelectedTabIndicatorHeight(10);
        tabLayout.setTabTextColors(Color.WHITE, Color.BLACK);

        viewPager = (ViewPager) findViewById(R.id.viewpager);



        list = new ArrayList<>();
        list.add(new Fragment());
        list.add(new Fragment1());

        fragmentPagerAdapter = new FragmentPagerAdapter(getSupportFragmentManager()) {
            @Override
            public android.support.v4.app.Fragment getItem(int position) {
                return list.get(position);
            }

            @Override
            public int getCount() {
                return list.size();
            }

            @Override
            public CharSequence getPageTitle(int position) {
                switch (position) {
                    case 0:
                        return "第一页";
                    case 1:
                        return "第二页";
                }

                return null;
            }
        };
        viewPager.setAdapter(fragmentPagerAdapter);
        tabLayout.setupWithViewPager(viewPager);

    }

}
  
  

   
   
  
  
  
  

   
   
  
  
  
  

   
   
  
  
v