Horizontal Pager加载Fragment异常：Toast显示但Fragment不可见

你在Composable里直接写IntroFragment1()这种代码，只是创建了Fragment对象，但根本没把它挂载到Android的视图层级里——Fragment得靠FragmentManager和宿主容器才能完成生命周期绑定、渲染视图，所以Fragment内容显示不出来，而Toast能正常弹是因为这部分代码不依赖Fragment的生命周期。

方案1：把Fragment改成Composable函数（优先推荐） #

既然用了Jetpack Compose，直接把Fragment里的Compose内容抽成独立的Composable是最省心的，完全适配Compose的生命周期：

重构后的页面组件 #

@Composable
fun IntroScreen1() {
    Column(
        Modifier.fillMaxSize(),
        verticalArrangement = Arrangement.Center,
        horizontalAlignment = Alignment.CenterHorizontally
    ) {
        Text(text = "Intro Fragment 1")
    }
}

// 照着这个写法，把IntroFragment2、IntroFragment3也改成IntroScreen2、IntroScreen3

修改后的Pager代码 #

@OptIn(ExperimentalFoundationApi::class)
@Composable
fun IntroPager() {
    val pagerState = rememberPagerState(pageCount = { 3 })
    val context = LocalContext.current

    HorizontalPager(state = pagerState, modifier = Modifier.fillMaxSize()) { page: Int ->
        Box(modifier = Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
            when (page) {
                0 -> {
                    Toast.makeText(context, "Intro 1", Toast.LENGTH_SHORT).show()
                    IntroScreen1()
                }
                1 -> {
                    Toast.makeText(context, "Intro 2", Toast.LENGTH_SHORT).show()
                    IntroScreen2()
                }
                2 -> {
                    Toast.makeText(context, "Intro 3", Toast.LENGTH_SHORT).show()
                    IntroScreen3()
                }
                else -> error("Invalid page: $page")
            }
        }
    }
}

方案2：用AndroidView套Fragment容器（必须保留Fragment时用） #

如果非得保留Fragment结构，得通过AndroidView在Compose里嵌入FragmentContainerView，再用FragmentManager来管理Fragment的切换：

修改后的Pager代码 #

@OptIn(ExperimentalFoundationApi::class)
@Composable
fun IntroPager() {
    val pagerState = rememberPagerState(pageCount = { 3 })
    val context = LocalContext.current
    // 注意：这里要确保context是AppCompatActivity类型，不然拿不到supportFragmentManager
    val fragmentManager = (context as AppCompatActivity).supportFragmentManager

    HorizontalPager(state = pagerState, modifier = Modifier.fillMaxSize()) { page: Int ->
        Box(modifier = Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
            AndroidView(
                factory = { ctx ->
                    FragmentContainerView(ctx).apply {
                        id = View.generateViewId() // 必须给容器设唯一ID，不然Fragment切换会报错
                    }
                },
                update = { container ->
                    // 切换当前页面对应的Fragment
                    val transaction = fragmentManager.beginTransaction()
                    val targetFragment = when (page) {
                        0 -> IntroFragment1()
                        1 -> IntroFragment2()
                        2 -> IntroFragment3()
                        else -> error("Invalid page: $page")
                    }
                    transaction.replace(container.id, targetFragment)
                    transaction.commitNow()

                    Toast.makeText(context, "Intro ${page + 1}", Toast.LENGTH_SHORT).show()
                }
            )
        }
    }
}

注意点 #

• 要保证传入的Context是Activity实例，不然无法获取supportFragmentManager
• 必须给FragmentContainerView设置唯一ID，否则Fragment事务无法执行
• 这种方式比直接用Composable复杂，只在你需要复用现有Fragment代码的时候用

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