AlertDialog中ViewPager2同时显示两个Fragment问题求助

你遇到的两个Fragment同时显示的问题，大概率是布局参数配置错误或者ViewPager2初始化逻辑遗漏导致的，以下是具体排查和修复步骤：

1. 检查FragmentStateAdapter实现 #

确保Adapter的页面数量和Fragment创建逻辑正确，这是基础：

class ChatPagerAdapter(fragment: Fragment) : FragmentStateAdapter(fragment) {
    // 必须返回页面总数2
    override fun getItemCount(): Int = 2

    override fun createFragment(position: Int): Fragment {
        return when(position) {
            0 -> ChatGanerelFragment()
            1 -> ChatMembersFragment()
            else -> throw IllegalArgumentException("无效页面位置: $position")
        }
    }
}

注意：Adapter的构造参数要传入正确的Fragment（比如当前宿主Fragment或Activity），不能传null或错误的上下文。

2. 修正AlertDialog布局 #

核心要保证ViewPager2宽度为match_parent，且父布局为纵向排列，避免页面并排：

<!-- 弹窗布局示例 -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <!-- TabLayout（可选，但要和ViewPager2关联） -->
    <com.google.android.material.tabs.TabLayout
        android:id="@+id/tabLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>

    <androidx.viewpager2.widget.ViewPager2
        android:id="@+id/viewPager"
        android:layout_width="match_parent" <!-- 关键：必须占满父容器宽度 -->
        android:layout_height="match_parent"
        android:orientation="horizontal"/> <!-- 默认是横向，不要改成vertical -->
</LinearLayout>

3. 确保Fragment根布局占满宽度 #

检查两个Fragment的XML根布局，宽度必须设为match_parent，否则会出现多个页面挤在一起的情况：

<!-- ChatGanerelFragment布局示例 -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent" <!-- 关键 -->
    android:layout_height="match_parent"
    android:orientation="vertical">
    <!-- 你的页面内容 -->
</LinearLayout>

4. 正确关联TabLayout与ViewPager2 #

如果使用TabLayout切换页面，必须通过TabLayoutMediator完成关联，否则Tab点击不会切换，且可能间接导致ViewPager2逻辑异常：

val dialogView = LayoutInflater.from(context).inflate(R.layout.dialog_chat_layout, null)
val viewPager = dialogView.findViewById<ViewPager2>(R.id.viewPager)
val tabLayout = dialogView.findViewById<TabLayout>(R.id.tabLayout)

// 初始化Adapter
viewPager.adapter = ChatPagerAdapter(this)

// 关联TabLayout和ViewPager2
TabLayoutMediator(tabLayout, viewPager) { tab, position ->
    tab.text = if (position == 0) "通用" else "成员"
}.attach()

// 显示弹窗
AlertDialog.Builder(context)
    .setView(dialogView)
    .show()

5. 排查AlertDialog窗口宽度 #

如果以上都没问题，可能是AlertDialog默认窗口宽度不足，导致ViewPager2无法正常展示单个页面，可以强制设置窗口宽度：

val dialog = AlertDialog.Builder(context)
    .setView(dialogView)
    .create()

dialog.show()
// 强制设置弹窗宽度为屏幕宽度的90%
val window = dialog.window
window?.setLayout((Resources.getSystem().displayMetrics.widthPixels * 0.9).toInt(), WindowManager.LayoutParams.WRAP_CONTENT)

内容的提问来源于stack exchange，提问作者David Feldman