在TabLayout的xml中添加屬性:
app:tabBackground="@android:color/transparent"
tab 使用自定義的layout 無法填充tab 的寬高問題
第一步 爲Tablayout 添加tab
private void initTabs() {
tabWidth = ScreenUtils.getScreenWidth5(this) / 3;
//遍歷tabs,設置每一個tab的樣式,默認第一個tab選中
for (int i = 0; i < titles.length; i++) {
TabLayout.Tab tab = tabs.newTab();
if (tab != null) {
tab.setCustomView(getTabView(i));
View view = tab.getCustomView();
if (i == 0) {
setTextColor(view, 0, true);
}
tabs.addTab(tab);
}
}
tabs.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
@Override
public void onTabSelected(TabLayout.Tab tab) {
//在這裏可以設置選中狀態下 tab字體顯示樣式
View view = tab.getCustomView();
setTextColor(view, tab.getPosition(), true);
MessageType = tab.getPosition();
page = 1;
//請求
if (MessageType == 0) {
getPresenter().getAbnormalMessageList(getAbnormalMessageParam(isAllType), page, false, false);
}/* else if (MessageType == 1) {
getPresenter().getSystemMessageList(getSystemNoticeMessageParam(isAllType), page, false, false);
} else {
getPresenter().getNoticeMessageList(getSystemNoticeMessageParam(isAllType), page, false, false);
}*/
adapter.MessageType = MessageType;
}
@Override
public void onTabUnselected(TabLayout.Tab tab) {
View view = tab.getCustomView();
setTextColor(view, tab.getPosition(), false);
// setTextColorUnSelect(view, tab.getPosition(), false);
}
@Override
public void onTabReselected(TabLayout.Tab tab) {
}
});
findViewById(R.id.iv_back).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
MessageActivity.this.finish();
}
});
}
第二步 爲每一個tab 添加layout 佈局
/**
* 設置底部切換tab佈局
*
* @param curPos
* @return
*/
private View getTabView(int curPos) {
View view = View.inflate(this, R.layout.message_tabs_layout, null);
// View view = LayoutInflater.from(this).inflate(R.layout.message_tabs_layout, null);
TextView tv = view.findViewById(R.id.tab_item_tv);
TextView tv_count = view.findViewById(R.id.tv_count);
ConstraintLayout.LayoutParams layoutParams = (ConstraintLayout.LayoutParams) tv.getLayoutParams();
layoutParams.width = tabWidth;
tv.setLayoutParams(layoutParams);
if (mesNum[curPos] == 0) {
tv_count.setVisibility(View.INVISIBLE);
} else {
tv_count.setVisibility(View.VISIBLE);
}
tv_count.setText(mesNum[curPos] > 99 ? "99+" : mesNum[curPos] + "");
tv.setText(titles[curPos]);
return view;
}
佈局layout
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="@+id/tab_item_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:paddingTop="@dimen/dp3"
android:text="標題"
android:textSize="16sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/tv_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/dp1"
android:background="@drawable/red_circle"
android:gravity="center"
android:text="0"
android:textColor="@color/common_white"
android:textSize="@dimen/sp8"
app:layout_constraintLeft_toRightOf="@id/tab_item_tv"
app:layout_constraintTop_toTopOf="@id/tab_item_tv" />
<View
android:id="@+id/view_selected"
android:layout_width="@dimen/dp40"
android:layout_height="@dimen/dp10"
android:layout_marginTop="@dimen/dp2_5"
android:background="@drawable/purple_rectangle_alpha20_radius5"
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="@id/tab_item_tv"
app:layout_constraintLeft_toLeftOf="@id/tab_item_tv"
app:layout_constraintRight_toRightOf="@id/tab_item_tv" />
</androidx.constraintlayout.widget.ConstraintLayout>
這樣就可以將自己定義的佈局設置給tab 作爲視圖使用。但是實際開發中我們發現,tab 中設置的佈局無法填充tab 的寬高
首先寬度,寬度無法填充tab 的寬度 是因爲tablayout 默認給子view設置了margin 這時候需要你在tablyout 中設置屬性來
解決這一問題
<com.google.android.material.tabs.TabLayout
android:id="@+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#fff"
app:tabBackground="@android:color/transparent"
app:tabGravity="fill"
app:tabIndicatorColor="#00000000"
app:tabMode="fixed"
app:tabPaddingEnd="-1dp"
app:tabPaddingStart="-1dp"
app:tabSelectedTextColor="@color/blue_4158FF"
app:tabTextColor="@color/gray_666666" />
app:tabPaddingStart="-1dp" 表示tab的paddingleft 是多少
app:tabPaddingEnd="-1dp" 表示tab的paddingright 是多少
這樣設置就可以保證tab 的內容寬度填充。
其次是自定義視圖的高度,其實它在計算的時候 是根據你內部子view 的高度一致,所以你如果想讓自己的佈局填充高度,
你需要將你設置的視圖 的layout 中的子view 設置一個與其相等的layout_hegit的dp值。如果你在根佈局設置這一高度是無效的
必須是在跟佈局中的子view 中設置才能生效.。