Android 自定义 TabLayout

TabLayout 的两种交互方式

TabLayout 有两种交互方式，第一种是通过滑动来选择 Tab，第二种是通过点击来选择 Tab。因此，当你在实现自定义 TabLayout 时，首先要保证自己对原组件的扩展能够同时支持这两种交互方式，其次要注意自己的扩展能够复合这两种交互方式的特点。

需求

1. 所有的 Tab 都由标题和色块组成；无论 Tab 是否被选中，标题的位置都位于整个 Tab 的正中；当 Tab 未被选中时，色块的高度较低，在视觉上位于标题的下面；当 Tab 被选中的时候，色块的高度较高，在视觉上包裹了标题；当 Tab 在未选中状态和选中状态之间切换时，色块的高度逐渐变高或逐渐变低，文字的颜色组件变白或变黑。

2. 滑动时，Tab 的渐变过程应该是由用户控制的，用户滑动的快慢对应渐变的快慢。

3. 点击时，Tab 的渐变过程应该是不受用户控制的，当用户执行完点击操作后，原来的 Tab 进入反向渐变过程，被点击的 Tab 进入正向渐变过程。

4. 需要提供的接口包括：设置 ViewPager 的接口；设置选中 Tab 的接口；增删 Tab 后更新自定义 TabLayout 视图的接口。

分析

1. TabLayout 和 ViewPager 的配合 —— 当滑动时，通过 ViewPager 的原有 API 去更新 TabLayout 的视图：通过重写 onPageScrolled 方法实现 Tab 上的渐变效果；通过重写 onPageSelected 方法实现 Tab 的移动居中。

2. TabLayout 和 ViewPager 的配合 —— 当点击时，通过 TabLayout 的自定义 API 去更新 ViewPager 的视图：通过获取点击的 Tab 的下标来选中 ViewPager 的指定 Page。

3. 色块应该是一个继承自 View 的类，可以设置高度和背景颜色，并提供让高度渐变的接口（原始高度、最终高度、渐变类型）；重写 onDraw 方法，根据不断改变的高度绘制不同高度的色块。
   （待续）