摘要
本文主要記錄TabLayout常常使用到的知識(shí)點(diǎn)绍移,避免每次使用TabLayout時(shí)悄窃,改個(gè)小地方,就要花時(shí)間去回憶蹂窖,百度轧抗。。瞬测。
目錄
一横媚、TabLayout的下劃線屬性設(shè)置
二、TabLayout中間的分割線Divider設(shè)置
三月趟、TabLayout的disable設(shè)置
四灯蝴、TabLayout的左右圓角設(shè)置
五、TabLayout和ViewPager的搭配使用
正文
一孝宗、TabLayout的下劃線屬性設(shè)置
TabLayout? tabSelect= (TabLayout) findViewById(R.id.tab_select);
//add tab
tabSelect.addTab(tabSelect.newTab().setText("盤(pán)虧"));
tabSelect.addTab(tabSelect.newTab().setText("盤(pán)盈"));
//設(shè)置寬度
TabUtils.setIndicatorHalf(tabSelect);
工具類(lèi):
public classTabUtils {
/**
* 設(shè)置TabLayout下方下劃線的寬度約為2分1
*@paramtabs
*/
public static voidsetIndicatorHalf(finalTabLayout tabs){
? ? ? ? ? tabs.post(newRunnable() {
? ? ? ? ? ? ? ? ? ? ? ? ?@Override
? ? ? ? ? ? ? ? ? ? ? public voidrun() {
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? tabs.measure(0,0);
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? intwidth =tabs.getMeasuredWidth();
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? setIndicator(tabs,width*1/4,width*1/4);
? ? ? ? ? ? ? ? ? ? ? ? }
? ? ? ? ? });
}
/**
* 設(shè)置TabLayout下方下劃線的寬度
* 至于使用方式的話,直接調(diào)用方法即可.必須要在Tablayout渲染出來(lái)后調(diào)用
*@paramtabs
*@paramleftDip
*@paramrightDip
*/
public static voidsetIndicator(TabLayout tabs, intleftDip, intrightDip) {
? ? ? ? ? ?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();
? ? ? ? ? }
? ? ? ? ? intleft = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, leftDip, Resources.getSystem().getDisplayMetrics());
? ? ? ? ?intright = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, rightDip, Resources.getSystem().getDisplayMetrics());
? ? ? ? // 通過(guò)修改Tab的寬度穷躁,間接修改Indicator的寬度
? ? ? ? ? for(int i =0; i < llTab.getChildCount(); i++) {
? ? ? ? ? ? ? ? ?View child = llTab.getChildAt(i);
? ? ? ? ? ? ? ? ?child.setPadding(0,0,0,0);
? ? ? ? ? ? ? ? ?LinearLayout.LayoutParams params =newLinearLayout.LayoutParams(0,LinearLayout.LayoutParams.MATCH_PARENT,1);
? ? ? ? ? ? ? ? ?params.leftMargin= left;
? ? ? ? ? ? ? ? ?params.rightMargin= right;
? ? ? ? ? ? ? ? ?child.setLayoutParams(params);
? ? ? ? ? ? ? ? ?child.invalidate();
? ? ? ? ? }
}
}
二、TabLayout中間的分割線Divider設(shè)置
TabLayout ?tabSelect= (TabLayout) findViewById(R.id.tab_select);?
//add tab
tabSelect.addTab(tabSelect.newTab().setText("盤(pán)虧"));
tabSelect.addTab(tabSelect.newTab().setText("盤(pán)盈"));
//add divider TABs中間分割線
LinearLayout linearLayout = (LinearLayout)tabSelect.getChildAt(0);? ? //SlidingTabStrip extends LinearLayout
//SHOW_DIVIDER_NONE:默認(rèn)碳褒,無(wú)分割線, SHOW_DIVIDER_BEGINNING:開(kāi)始處,
//SHOW_DIVIDER_MIDDLE:Tabs中間, SHOW_DIVIDER_END:結(jié)束處
linearLayout.setShowDividers(LinearLayout.SHOW_DIVIDER_MIDDLE);? ? //設(shè)置 Tabs 中間分割線顯示位置
linearLayout.setDividerPadding(10);
linearLayout.setDividerDrawable(ContextCompat.getDrawable(this, R.drawable.style_divider_line));? //設(shè)置分割線資源
三折砸、TabLayout的disable設(shè)置
/**
* TabSelect不可選時(shí)變灰 看疗,重置
*@paramenable
*/
private voidenableTabSelect(booleanenable) {
? ? ? ? ? ?LinearLayout linearLayout = ( LinearLayout )tabSelect.getChildAt(0);
? ? ? ? ? ?intchildCount = linearLayout.getChildCount();
? ? ? ? ? ?for(int i = 0; i < childCount; i++) {
? ? ? ? ? ? ? ? ? ? View child = linearLayout.getChildAt(i);
? ? ? ? ? ? ? ? ? ? child.setClickable(enable);
? ? ? ? ? ? ? ? ? ? if(enable){
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?child.setBackground(getResources().getDrawable(R.drawable.style_tab_select_bg));
? ? ? ? ? ? ? ? ? ? ?}else{
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? child.setBackgroundColor(getResources().getColor(R.color.all_bg_gary));
? ? ? ? ? ? ? ? ? ? ? }
? ? ? ? ? ?}
? ? ? ? ? ? tabSelect.setSelectedTabIndicatorColor( enable ? getResources().getColor(R.color.khaki): getResources().getColor(R.color.line_color));
? ? ? ? ? ? tabSelect.getTabAt(0).select();//重置selected
}
四、TabLayout的左右圓角設(shè)置
布局文件:
< android.support.design.widget.TabLayout
android:layout_centerInParent="true"
android:id="@+id/tab_select"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_margin="@dimen/padding_four"
app:tabGravity="fill"
app:tabIndicatorColor="@color/transparency"
app:tabMode="fixed"
app:tabSelectedTextColor="@color/black"
app:tabTextAppearance="@style/TabLayoutTextStyle"
app:tabTextColor="@color/white"
/>
代碼:
TabLayout tabSelect = (TabLayout) findViewById(R.id.tab_select);
tabSelect.addTab(tabSelect.newTab().setText("RFID模式"));
tabSelect.addTab(tabSelect.newTab().setText("條碼模式"));
LinearLayout linearLayout = (LinearLayout) tabSelect.getChildAt(0);
linearLayout.getChildAt(0).setBackgroundResource(R.drawable.style_tab_left_circle);
linearLayout.getChildAt(linearLayout.getChildCount()-1).setBackgroundResource(R.drawable.style_tab_right_circle);
drawable文件: