Android中ViewPager2搭配TabLayout时如何实现TabLayout横向滑动？

要让TabLayout在标签数量过多时支持横向滑动，只需调整布局属性即可，具体步骤如下：

• 关键属性配置
  在XML布局的TabLayout中添加app:tabMode="scrollable"，同时确保android:layout_width="match_parent"（让TabLayout占满屏幕宽度）。可选搭配app:tabGravity="start"（标签从左侧开始排列）或app:tabGravity="center"（标签居中），根据需求选择。

• 完整布局示例

  <com.google.android.material.tabs.TabLayout
      android:id="@+id/tabLayout"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      app:tabMode="scrollable"
      app:tabGravity="start"
      app:tabTextAppearance="@style/DefaultTabText" />
  

  其中tabTextAppearance可自定义文字大小，无需调至极小，滚动模式下正常字号也能完整显示标题。

• 绑定ViewPager2的常规操作
  保持用TabLayoutMediator绑定ViewPager2的逻辑不变，示例代码：

  val tabTitles = listOf("标签1", "标签2", "标签3", "标签4", "标签5", "标签6", "标签7")
  TabLayoutMediator(tabLayout, viewPager2) { tab, position ->
      tab.text = tabTitles[position]
  }.attach()
  

• 可选优化

  • 添加app:tabMaxWidth属性限制单个标签的最大宽度，避免过长标题挤压其他标签
  • 自定义Tab的选中/未选中样式，不影响横向滑动功能

内容的提问来源于stack exchange，提问作者Hussain Akbar