TabLayout实现顶部导航(一)

代码地址如下：
http://www.demodashi.com/demo/14552.html

###前言
顶部导航栏，是我们在开发中比较常见的一种显示布局，它的实现可以有多种方式，那么今天我们就来讲讲 TabLayout 对它的实现
今天涉及的内容有：

1. 实现导航栏的几种方式
2. 库的导入
3. TabLayout的具体使用
4. 效果图

####一.实现导航栏的几种方式及解析
我们在实现顶部导航的时候，可以有多种选择：

1. ViewPagerIndicator + Fragment + ViewPager
2. ActionBar + Fragment + ViewPager
3. 自定义一个View实现

基于第一种需要和activity的主题相结合，对activity主题的限制比较高，第二种 actionBar耦合也高，第三种自定义view会比较繁琐。
所以今天我们介绍TabLayout的使用
####二.库的导入
TabLayout是android中Material Design库中控件，因此需要做以下库导入：

    //TabLayout
    compile 'com.android.support:design:27.1.1'
    compile 'com.android.support:support-v4:27.1.1'

####三.TabLayout的具体使用
#####3.1 先展示在mainActivity中的xml代码
实现顶部导航，所以TabLayout要结合ViewPager使用，xml代码如下：

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.android.testde