使用TabLayout撸出多颜色的Tab

换了份公司，差不多两个月没有写博客了。新的公司，新的需求，还是比较坑爹的，给大伙看一下做成什么样子的东西：
这里写图片描述

由于项目刚开始的时候，没有想那么多，直接使用了android.support.design.widget.TabLayout，原因很简单，是因为懒和这个东西成熟，可是项目快要结束了，UI给我来了个有些地方你得加上颜色标注一下，搞得当时就想换个第三方的库，苦于时间的关系，还是看了下TabLayout的源码，直接使用反射给替换了下，代码不多，感觉还是有用的，这里就记一笔。

还是先看代码吧：
//换每个Tab中textView的颜色，先定义各种颜色：


public class Constant {
    public static final int[] COLORS = {
            Color.RED,
            Color.parseColor("#ff6000"),
            Color.GREEN,
            Color.BLUE,
            Color.parseColor("#179cfe")
    };

}

使用反射更换掉颜色：
这个不懂的话，你可以留言。

        for (int index = 0; index < mTabLayout.getTabCount(); index++) {
            TabLayout.Tab tab = mTabLayout.getTabAt(index);
            if (null != tab) {
                try {
                    Field field = TabLayout.Tab.class.getDeclaredField("mView");
                    field.setAccessible(true);
                    ViewGroup tabView = (ViewGroup) field.get(tab);

                    for (int i = 0; i < tabView.getChildCount(); i++) {
                        View indexView = tabView.getChildAt(i);
                        if (indexView instanceof TextView) {
                            ((TextView) indexView).setTextColor(Constant.COLORS[index]);
                        }
                    }
                } catch (IllegalAccessException e) {
                    e.printStackTrace();
                } catch (NoSuchFieldException e) {
                    e.printStackTrace();
                }
            }
        }

更换下面Indicator的颜色：
获取画颜色的Paint：

private Paint mPaint;
 private void initGetIndicator() {
        try {
            Field field = TabLayout.class.getDeclaredField("mTabStrip");
            field.setAccessible(true);

            LinearLayout layout = (LinearLayout) field.get(mTabLayout);

            Class<?> clazz = field.get(mTabLayout).getClass();
            Field paintField = clazz.getDeclaredField("mSelectedIndicatorPaint");
            paintField.setAccessible(true);
            mPaint = (Paint) paintField.get(layout);

        } catch (NoSuchFieldException e) {
            e.printStackTrace();
        } catch (IllegalAccessException e) {
            e.printStackTrace();
        }
    }

监听ViewPager.addOnPageChangeListener方法：

 mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
                if (position == mViewPager.getAdapter().getCount() - 1) return;

                if (null != mPaint) {
                    mPaint.setColor(betWeenColor(position, positionOffset));
                }
            }

            @Override
            public void onPageSelected(int position) {
            }

            @Override
            public void onPageScrollStateChanged(int state) {
            }
        });

颜色之间的过渡：

  private int betWeenColor(int position, float positionOffset) {

        int startColor = Constant.COLORS[position];
        int endColor = Constant.COLORS[position + 1];

        int redOne = (int) (Color.red(startColor) * (1 - positionOffset) + Color.red(endColor) * positionOffset);
        int greenOne = (int) (Color.green(startColor) * (1 - positionOffset) + Color.green(endColor) * positionOffset);
        int blueOne = (int) (Color.blue(startColor) * (1 - positionOffset) + Color.blue(endColor) * positionOffset);

        return Color.rgb(redOne, greenOne, blueOne);
    }

基本上就好了，另外你得自己撸一个Fragment，这个就有些简单，你就自己撸吧。如果有时间的话，我就整理一下代码。今晚就这样了。

github地址：
github

使用TabLayout撸出多颜色的Tab

猜你喜欢