xml
<com.google.android.material.tabs.TabLayout
android:id="@+id/tab_layout_tips"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="44dp"
android:layout_marginLeft="50dp"
android:layout_marginRight="50dp"
app:layout_constraintLeft_toRightOf="@id/iv_back"
app:layout_constraintTop_toTopOf="parent"
app:tabIndicatorHeight="0dp"
app:tabIndicatorFullWidth="true"
app:tabIndicatorGravity="bottom"
app:tabMinWidth="90dp"
app:tabTextColor="#333333"
app:tabSelectedTextColor="@color/black"
app:tabIndicatorColor="#F45701"
app:tabIconTintMode="src_in"
app:tabMode="fixed"
app:tabGravity="center"
app:tabBackground="@android:color/transparent"
app:tabRippleColor="@android:color/transparent">
</com.google.android.material.tabs.TabLayout>
<androidx.viewpager2.widget.ViewPager2
android:id="@+id/viewPager2Msg"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintHeight_default="percent"
app:layout_constraintTop_toBottomOf="@id/tab_layout_tips">
tabview自定义item布局（tabIndicator底部指示器）
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="90dp"
android:layout_height="50dp">
<TextView
android:id="@+id/text1"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:text="提醒"
android:layout_centerInParent="true"
android:textColor="#ff333333"
android:textSize="16sp"/>
<RelativeLayout
android:id="@+id/rl_tips"
android:layout_width="16dp"
android:layout_height="16dp"
android:gravity="center"
android:layout_marginTop="9dp"
android:layout_toRightOf="@id/text1">
<ImageView
android:id="@+id/iv_tips"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@drawable/re_tips_bg"
android:scaleType="centerInside"/>
<TextView
android:id="@+id/text_tips"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:textColor="#ffffffff"
android:textSize="11sp"
android:text="3"/>
</RelativeLayout>
<ImageView
android:id="@+id/iv_indicator"
android:layout_width="16dp"
android:layout_height="2dp"
android:background="#F45701"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"/>
</RelativeLayout>
动态tab数据
class DataGenerator {
companion object{
private val textList = arrayOf("提醒","私信")
fun getTabView(context: Context, position:Int) : View {
val view: View =
LayoutInflater.from(context).inflate(R.layout.re_tab_item_layout, null)
var text1 = view.findViewById<TextView>(R.id.text1)
var text_tips = view.findViewById<TextView>(R.id.text_tips)
text1.text = textList[position]
return view
}
}
}
ViewPager2适配器FragmentStateAdapter
添加adapter
class ReFragmentMsgAdapter(fragmentManager: FragmentManager,lifecycle:Lifecycle):FragmentStateAdapter(fragmentManager,lifecycle) {
private val mFragments = mutableListOf<Fragment>()
override fun getItemCount(): Int = mFragments.size
override fun createFragment(position: Int): Fragment = mFragments[position]
fun add(fragment:Fragment){
mFragments.add(fragment)
}
}
UI调用
fragmentAdapter = ReFragmentMsgAdapter(supportFragmentManager,lifecycle)
fragmentAdapter.add(ReTipsFragment())
fragmentAdapter.add(ReMsgFragment())
viewPager2Msg.adapter = fragmentAdapter
val tabLayoutMediator = TabLayoutMediator(tab_layout_tips,viewPager2Msg) {
tab, position ->
if(position == 0) {
tab.customView = DataGenerator.getTabView(this,0)
tab.customView?.findViewById<ImageView>(R.id.iv_indicator)?.visibility = View.VISIBLE
tab.customView?.findViewById<RelativeLayout>(R.id.rl_tips)?.visibility = View.VISIBLE
tab.customView?.findViewById<TextView>(R.id.text1)?.setTextColor(Color.BLACK)
}else{
tab.customView = DataGenerator.getTabView(this,1)
tab.customView?.findViewById<ImageView>(R.id.iv_indicator)?.visibility = View.GONE
tab.customView?.findViewById<RelativeLayout>(R.id.rl_tips)?.visibility = View.GONE
tab.customView?.findViewById<TextView>(R.id.text1)?.setTextColor(Color.parseColor("#333333"))
}
}
recoverItem()
tabLayoutMediator.attach()
tab_layout_tips.addOnTabSelectedListener(object : TabLayout.OnTabSelectedListener {
override fun onTabSelected(tab: TabLayout.Tab?) {
recoverItem()
chooseTab(tab)
}
override fun onTabUnselected(tab: TabLayout.Tab?) {
}
override fun onTabReselected(tab: TabLayout.Tab?) {
}
})
private fun recoverItem() {
for (i in 0..1){
var ivIndicator = tab_layout_tips?.getTabAt(i)?.view?.findViewById<ImageView>(R.id.iv_indicator)
var text1 = tab_layout_tips?.getTabAt(i)?.view?.findViewById<TextView>(R.id.text1)
var rlTips = tab_layout_tips?.getTabAt(i)?.view?.findViewById<RelativeLayout>(R.id.rl_tips)
rlTips?.visibility = View.GONE
ivIndicator?.visibility = View.GONE
text1?.setTextColor(Color.parseColor("#333333"))
}
}
private fun chooseTab(tab: TabLayout.Tab?) {
var ivIndicator = tab?.view?.findViewById<ImageView>(R.id.iv_indicator)
var text1 = tab?.view?.findViewById<TextView>(R.id.text1)
var rlTips = tab?.view?.findViewById<RelativeLayout>(R.id.rl_tips)
var textTips = tab?.view?.findViewById<TextView>(R.id.text_tips)
rlTips?.visibility = View.VISIBLE
ivIndicator?.visibility = View.VISIBLE
text1?.setTextColor(Color.BLACK)
}
