如何实现内置RecyclerView的透明Fragment布局,让下层Fragment内容模糊可见
解决方案
1 修正现有布局问题
你当前提供的布局存在2个会导致Fragment无法正常加载的问题,先修正:
- LinearLayout(id为dot_layout)的
android:layout_height属性当前为wrap_content,会导致下层的FrameLayout无法占满剩余屏幕空间,修改为match_parent - 末尾的DrawerLayout闭合标签缺失
>,补全为</androidx.drawerlayout.widget.DrawerLayout>
2 实现FragmentB透明背景效果
基础半透明效果(最常用,适配所有版本)
直接在FragmentB的根布局设置半透明背景即可,比如设置带透明度的黑色蒙版:
<!-- FragmentB的根布局 --> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" <!-- 前两位CC代表80%透明度,可根据需求调整00-FF的数值 --> android:background="#CC000000"> <!-- 此处放RecyclerView --> </FrameLayout>
如果需要高斯模糊效果,可以对下层FragmentA的视图做截图模糊后设置为FragmentB的背景,普通业务场景半透明蒙版足够满足需求。
3 FragmentB嵌套RecyclerView实现
直接在FragmentB的根布局中添加RecyclerView即可,示例布局如下:
<!-- fragment_b.xml 完整示例 --> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/fragment_b_root" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#CC000000"> <androidx.recyclerview.widget.RecyclerView android:id="@+id/search_result_rv" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_marginTop="10dp" android:background="@android:color/transparent" /> </FrameLayout>
注意事项:
- RecyclerView的item布局建议设置不透明的白色/浅灰色背景,避免和半透明的根背景重叠导致文字看不清
- 如果需要点击空白区域关闭FragmentB,可以给id为fragment_b_root的根布局设置点击事件,触发回退栈弹出操作即可
4 点击SearchView加载FragmentB逻辑
在FragmentA中给SearchView添加点击监听,将FragmentB加载到id为search_container的FrameLayout中:
// Kotlin示例代码 advance_search.setOnSearchClickListener { childFragmentManager.beginTransaction() .setCustomAnimations(android.R.anim.fade_in, android.R.anim.fade_out) .add(R.id.search_container, FragmentB::class.java, null) .addToBackStack("FragmentB") .commit() }
// Java示例代码 advance_search.setOnSearchClickListener(v -> { getChildFragmentManager().beginTransaction() .setCustomAnimations(android.R.anim.fade_in, android.R.anim.fade_out) .add(R.id.search_container, new FragmentB()) .addToBackStack("FragmentB") .commit(); });
内容的提问来源于stack exchange,提问作者I'm Coder
相关产品推荐
相关产品推荐

