使用 TabLayout?

1.xml中添加布局

<android.support.design.widget.TabLayoutandroid:id="@+id/tab"android:layout_width="@dimen/x500"android:layout_height="@dimen/y100"android:layout_marginLeft="@dimen/x20"android:padding="-1dp"app:tabContentStart="0dp"app:tabGravity="fill"app:tabIndicatorColor="@color/blue_293F59"app:tabIndicatorHeight="2dp"app:tabMode="fixed"app:tabPadding="-1dp"app:tabPaddingBottom="-1dp"app:tabPaddingEnd="-1dp"app:tabPaddingStart="-1dp"app:tabPaddingTop="-1dp"app:tabSelectedTextColor="@color/blue_293F59" />

2.代碼中

//文字的集合 tabTitles = new ArrayList<>(); //這里我是把需要的文字寫到String 里面統一管理（可以直接tabTitles.add()標題也行） tabTitles = Arrays.asList(getResources().getStringArray(R.array.clerk_good_count_tab)); for (int i = 0; i < tabTitles.size(); i++) {String title = tabTitles.get(i);//我喜歡引入自定義的布局View view = View.inflate(context, R.layout.tab_count_view, null);TextView titleText = view.findViewById(R.id.title);titleText.setText(title);//這里可以加入圖片之類的（看自己寫的自定義布局）tab.addTab(tab.newTab().setCustomView(view)); } //如果只是單獨使用 TabLayout 只需要這個監聽就好 tab.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {// 如果需要選中 和不選中區分顏色之類的操作 可以在下面回調方法中寫@Overridepublic void onTabSelected(TabLayout.Tab tab) {//這段代碼暫時沒用 后面講解AnimatorUtils animatorUtils = AnimatorUtils.getInstance();if (tab.getPosition() == 4) {animatorUtils.viewShowOrHidden((int) context.getResources().getDimension(R.dimen.y90), 1, lDate);} else {ViewGroup.LayoutParams l = lDate.getLayoutParams();final float height = l.height;if (l.height == 0) {return;}animatorUtils.viewShowOrHidden((int) height, 0, lDate);}//這里就是切換后要做的事情switch (tab.getPosition()) {case 0:break;case 1:break;default:break;}//如果需要和ViewPage 一起使用//vp.setCurrentItem(tab.getPosition());}@Overridepublic void onTabUnselected(TabLayout.Tab tab) {}@Overridepublic void onTabReselected(TabLayout.Tab tab) {} });

//如果需要和ViewPage 一起使用

vp.addOnPageChangeListener(new Page() {@Overridepublic void onPageSelected(int position) {tabTask.getTabAt(position).select();} });

--------------------------------- 以上使用是沒什么問題了 --------------------------------

現在就要說說開發中可能遇到的問題（至少是我遇到的）

1.下劃線太長，導致不美觀，我們發現api里面并沒有控制長度的方法

所以就需要用反射的方式來給每一個tab變相設置長度

/*** 設置tab下劃線的長度*/ //最好要求一下版本 @TargetApi(Build.VERSION_CODES.JELLY_BEAN_MR1) public void setTabLine(int left, int right) {try {Class<?> tablayout = tab.getClass();Field tabStrip = tablayout.getDeclaredField("mTabStrip");tabStrip.setAccessible(true);LinearLayout ll_tab = (LinearLayout) tabStrip.get(tab);for (int i = 0; i < ll_tab.getChildCount(); i++) {View child = ll_tab.getChildAt(i);child.setPadding(0, 0, 0, 0);LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(0,LinearLayout.LayoutParams.MATCH_PARENT, 1);//修改兩個tab的間距params.setMarginStart(DensityUtil.dp2px(context, left));params.setMarginEnd(DensityUtil.dp2px(context, right));child.setLayoutParams(params);child.invalidate();}} catch (NoSuchFieldException e) {e.printStackTrace();} catch (IllegalAccessException e) {e.printStackTrace();} }

這樣設置2個tab的margin 就可以控制長度了

2.這個是我遇到的一個坑（算是坑吧）

公司需求選擇到某一個tab的時候在下面顯示一個界面（比如選擇時間）而選擇其他界面的時候就隱藏這個界面

開始開發都沒什么問題，就是手賤了，覺得直接隱藏和顯示的界面太生硬，于是就寫了一個動畫效果，

動態改變布局的高度，來慢慢顯示和隱藏。

寫好了也沒什么問題，突然我就把動畫時間延長了5秒，看看慢效果，就發現一個問題，

發現那個下標（下面的那條線）會在動畫完成后才移動顯示，這個不友好了

然后各種查資料，做實驗，終于發現了 如果TabLayout的父布局是RelativeLayout就會有這個奇葩的問題，

<RelativeLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content"android:orientation="vertical"><android.support.design.widget.TabLayoutandroid:id="@+id/tab"android:layout_width="match_parent"android:layout_height="@dimen/y120"android:padding="-1dp"app:tabContentStart="0dp"app:tabGravity="fill"app:tabIndicatorColor="@color/blue_293F59"app:tabIndicatorHeight="2dp"app:tabMode="fixed"app:tabPadding="-1dp"app:tabPaddingBottom="-1dp"app:tabPaddingEnd="-1dp"app:tabPaddingStart="-1dp"app:tabPaddingTop="-1dp"app:tabSelectedTextColor="@color/blue_293F59" />

</RelativeLayout>

像這樣就有問題 把RelativeLayout 改為LinearLayout 就沒問題了。

總結

以上是生活随笔為你收集整理的TabLayout 的使用 更改下划线的长度,和一个奇葩的问题的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。