如何在Fragment A之上叠加Fragment B？求纯Fragment实现代码

要实现Fragment B叠加在Fragment A之上，核心是给Fragment B设置透明背景，同时使用FragmentManager的add()方法（而非replace()）将B添加到容器，并加入回退栈保留Fragment A的实例。以下是纯Fragment的实现代码：

1. Fragment B的透明布局 #

首先给Fragment B的根布局设置半透明背景，确保能看到下层的Fragment A：

<!-- fragment_b.xml -->
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#80000000" <!-- 半透明黑色，可根据需求调整透明度 -->
    android:gravity="center"
    android:orientation="vertical">

    <!-- 这里放置Fragment B的核心内容，比如弹窗样式布局 -->
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@android:color/white"
        android:orientation="vertical"
        android:padding="16dp">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Fragment B 内容区域"
            android:textSize="18sp"/>

        <Button
            android:id="@+id/btn_close_b"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="关闭"/>
    </LinearLayout>
</LinearLayout>

2. Fragment A中加载Fragment B的代码 #

在Fragment A内触发叠加逻辑，使用parentFragmentManager完成Fragment事务：

class FragmentA : Fragment() {

    override fun onCreateView(
        inflater: LayoutInflater,
        container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        return inflater.inflate(R.layout.fragment_a, container, false)
    }

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)
        
        // 示例：点击按钮显示Fragment B
        view.findViewById<Button>(R.id.btn_show_b).setOnClickListener {
            showOverlayFragmentB()
        }
    }

    private fun showOverlayFragmentB() {
        val fragmentB = FragmentB()
        val transaction = parentFragmentManager.beginTransaction()

        // 可选：添加进入/退出动画，提升交互体验
        transaction.setCustomAnimations(
            R.anim.slide_up, 0, 0, R.anim.slide_down
        )

        // 使用add()而非replace()，保留Fragment A在下层
        transaction.add(R.id.fragment_container, fragmentB)
        // 加入回退栈，支持返回键关闭Fragment B
        transaction.addToBackStack(null)
        transaction.commit()
    }
}

3. Fragment B的关闭逻辑 #

在Fragment B内实现关闭，从回退栈移除自身回到Fragment A：

class FragmentB : Fragment() {

    override fun onCreateView(
        inflater: LayoutInflater,
        container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        return inflater.inflate(R.layout.fragment_b, container, false)
    }

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)
        
        view.findViewById<Button>(R.id.btn_close_b).setOnClickListener {
            // 弹出回退栈，回到Fragment A
            parentFragmentManager.popBackStack()
        }
    }
}

关键注意事项 #

• 容器布局（如fragment_container）必须是FrameLayout或其他支持叠加的布局，FrameLayout默认允许子View叠加。
• 必须给Fragment B的根布局设置透明背景，否则会完全覆盖Fragment A。
• 使用add()方法添加Fragment B，replace()会移除Fragment A，无法实现叠加。
• 加入回退栈后，点击系统返回键会自动关闭Fragment B，也可通过popBackStack()手动触发关闭。

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