Android TabLayout切換改變字體大小與顏色,以及下劃線長度
如圖
1.思路:只能想辦法給選中tab定制TextView,再根據(jù)監(jiān)聽TabLayout的選中狀態(tài)設(shè)置該TextView的顯示樣式贤姆。
注解 BindView
@BindView(R.id.tab_layout)
TabLayout tabLayout;
@BindView(R.id.view_pager)
ViewPager viewPager
2.tablayout與viewpager的使用
ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager(), fragmentList, titleList);
viewPager.setAdapter(adapter);
默認(rèn)選中第一條呜叫,字體顏色改變
viewPager.setCurrentItem(0); //默認(rèn)第一條數(shù)據(jù)
viewPager.setOffscreenPageLimit(size);
for (int i = 0; i <tabLayout.getTabCount() ; i++) {
TabLayout.Tab tabAt = tabLayout.getTabAt(i);
if(tabAt!=null){
tabAt.setCustomView(getTabView(i));
}
if(i==0){ //默認(rèn)選中第一條琼掠,字體變大
TextView viewByIdtext = tabAt.getCustomView().findViewById(R.id.tab_item_textview);
viewByIdtext.setSelected(true);
viewByIdtext.setTextSize(18);
viewByIdtext.setTextColor(Color.parseColor("#2F75F8"));
}
}
下面是tablayout 監(jiān)聽是否滑動 事件
tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
@Override
public void onTabSelected(TabLayout.Tab tab) {
//在這里可以設(shè)置選中狀態(tài)下 tab字體顯示樣式
// viewPager.setCurrentItem(tab.getPosition());
View view = tab.getCustomView();
if (null != view && view instanceof TextView) {
((TextView) view).setTextSize(18);
((TextView) view).setTextColor(ContextCompat.getColor(mActivity, R.color.coloresBules));
}
}
@Override
public void onTabUnselected(TabLayout.Tab tab) { //未選中狀態(tài)
View view = tab.getCustomView();
if (null != view && view instanceof TextView) {
((TextView) view).setTextSize(14);
((TextView) view).setTextColor(ContextCompat.getColor(mActivity, R.color.text_69));
}
}
@Override
public void onTabReselected(TabLayout.Tab tab) { //選定的
}
});
3. 需要設(shè)置 自定義tablayout的view
private View getTabView(int currentPosition) {
View view = LayoutInflater.from(mContext).inflate(R.layout.layout_tab, null);
TextView textView = (TextView) view.findViewById(R.id.tab_item_textview);
textView.setText(categoryList.get(currentPosition).getName());
return view;
}
layout_tab.xml文件也很簡單 只有一個textView
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/tab_item_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="bottom"
android:typeface="sans"
</TextView>
最后,改變tablayout下劃線長度,會根據(jù)內(nèi)容長度 反射來控制下劃線的長度
需要一個工具類
public void setIndicator(TabLayout tabs, int leftDip, int rightDip) {
Class<?> tabLayout = tabs.getClass();
Field tabStrip = null;
try {
tabStrip = tabLayout.getDeclaredField("mTabStrip");
} catch (NoSuchFieldException e) {
e.printStackTrace();
}
tabStrip.setAccessible(true);
LinearLayout llTab = null;
try {
llTab = (LinearLayout) tabStrip.get(tabs);
} catch (IllegalAccessException e) {
e.printStackTrace();
}
int left = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, leftDip, Resources.getSystem().getDisplayMetrics());
int right = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, rightDip, Resources.getSystem().getDisplayMetrics());
for (int i = 0; i < llTab.getChildCount(); i++) {
View child = llTab.getChildAt(i);
child.setPadding(0, 0, 0, 0);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(0, LinearLayout.LayoutParams.MATCH_PARENT, 1);
params.leftMargin = left;
params.rightMargin = right;
child.setLayoutParams(params);
child.invalidate();
}
}
需要在tablayout方法當(dāng)中調(diào)用
tabLayout.post(new Runnable() {
@Override
public void run() {
// setIndicator(tabLayout,30,30); 值可更改
}
});