自定义TabLayout 1.0 (仅支持快捷设置指示器长度,且为固定值)
最近项目中有一个需求,TabLayout指示器长度改成指定固定值,当然网上有什么反射加padding什么的,可是治标不治本,且Tab过渡动画也加不了,什么?你告诉我github又xxx类似控件,可是为什么我要放弃google大神的源码呢,改改就能增加新功能了呢,为了达到目的,我就开始了下面一系列骚操作
首先是效果图,原谅不是动态的,懒得整了
项目中导入官方依赖,下面所有的操作都是依赖于官方基础上进行的
compile 'com.android.support:design:26.1.0'
1. copy support包TabLayout 一份当做自己的自定义view
2. 制作自定义属性
找到官方的属性文件,添加我们想要添加的属性
3. 修改源码
1.在TabLayout的构造方法中加入自己的自定义属性
2、修改SlidingTabStrip类的draw方法
@Override
public void draw(Canvas canvas) {
super.draw(canvas);
// Thick colored underline below the current selection
if (mIndicatorLeft >= 0 && mIndicatorRight > mIndicatorLeft) {
if(mTabLineOffset == 0){
canvas.drawRect(mIndicatorLeft, getHeight() - mSelectedIndicatorHeight,
mIndicatorRight, getHeight(), mSelectedIndicatorPaint);
}else {
//原来的下划线的长度(也就是Tab的宽度)
int width = mIndicatorRight - mIndicatorLeft;
//Tab的中心点的坐标(mIndicatorRight-width/2也是)
int tabCenter = mIndicatorLeft+width/2;
RectF oval3 = new RectF(tabCenter-mTabLineOffset, getHeight() - mSelectedIndicatorHeight,
mIndicatorRight-width/2+mTabLineOffset, getHeight());
canvas.drawRoundRect(oval3,30,30,mSelectedIndicatorPaint);
}
}
}
这里我进行了判断,如果在xml中没有使用自定义属性mTabLineOffset ,就还是展示的是系统TabLayout的样式,否者,就是我们可控制的下划线长度。
这里我们先取了Tab的宽度,算出Tab的中心坐标位置,让后根据中心位置坐标和mTabLineOffset 值来确定下划线的长度。
到此,任务完成了,
4. 使用
1.代码中直接引用我们的自定义TabLayout,设置指示器长度
<com.example.myapplication.TabLayout
android:id="@+id/tablayout"
android:layout_width="match_parent"
android:layout_height="44dp"
app:tabLineOffSet="10dp"></com.example.myapplication.TabLayout>
2.代码中findviewbyid我们的控件
在这里我没有与ViewPager绑定,因为我们的项目中用不到,其实我们在引用这个自定义的时候和官方的一点变化都没有,只是加入了我们需要的东西.
测试一下~
public class MainActivity extends BaseActivity {
private Map<String, Object> map = new LinkedHashMap<>();
private TabLayout tab;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
tab = findViewById(R.id.tablayout);
tab.addTab(tab.newTab().setText("新人"),true);
tab.addTab(tab.newTab().setText("老司机"),false);
tab.addTab(tab.newTab().setText("滴滴滴"),false);
tab.addTab(tab.newTab().setText("新人1"),false);
tab.addTab(tab.newTab().setText("新人2"),false);
tab.addTab(tab.newTab().setText("新人3"),false);
tab.addTab(tab.newTab().setText("新人4"),false);
tab.addTab(tab.newTab().setText("新人5"),false);
tab.addTab(tab.newTab().setText("新人6"),false);
tab.addTab(tab.newTab().setText("新人7"),false);
//tab可滚动
tab.setTabMode(TabLayout.MODE_SCROLLABLE);
//tab居中显示
tab.setTabGravity(TabLayout.GRAVITY_CENTER);
//tab的字体选择器,默认黑色,选择时红色
tab.setTabTextColors(Color.BLACK, Color.RED);
//tab的下划线颜色,默认是粉红色
tab.setSelectedTabIndicatorColor(Color.BLUE);
//设置监听事件
tab.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
@Override
public void onTabSelected(TabLayout.Tab tabItem) {
Toast.makeText(MainActivity.this, tabItem.getPosition() + ":" + tabItem.getText(), Toast.LENGTH_SHORT).show();
}
@Override
public void onTabUnselected(TabLayout.Tab tab) {
}
@Override
public void onTabReselected(TabLayout.Tab tab) {
}
});
}
@Override
public int getLayoutId() {
return R.layout.activity_main;
}
}