如何实现支持父视图交互且可全屏展开的Bottom Sheet？

原生实现方案（无需第三方库） #

Android Jetpack的BottomSheetBehavior就能搞定这个需求，搭配CoordinatorLayout就能实现谷歌地图那样的效果，具体步骤如下：

1. 搭建布局结构 #

• 根布局用CoordinatorLayout，里面包含主界面（父视图）和Bottom Sheet布局。
• Bottom Sheet布局要设置app:layout_behavior="@string/bottom_sheet_behavior"，同时配置初始露出高度、可展开状态。

示例布局代码：

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!-- 主界面内容（比如地图、列表等可操作元素） -->
    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <!-- 这里放你的主界面控件，比如MapView或者其他交互组件 -->
    </FrameLayout>

    <!-- Bottom Sheet布局 -->
    <LinearLayout
        android:id="@+id/bottom_sheet"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_behavior="@string/bottom_sheet_behavior"
        app:behavior_peekHeight="120dp" <!-- 初始露出的高度，可按需调整 -->
        app:behavior_hideable="false"
        app:behavior_skipCollapsed="false">

        <!-- Bottom Sheet内部用NestedScrollView包裹内容，支持滑动展开 -->
        <androidx.core.widget.NestedScrollView
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <!-- 这里放Bottom Sheet的具体内容，比如详情列表、表单等 -->
        </androidx.core.widget.NestedScrollView>
    </LinearLayout>

</androidx.coordinatorlayout.widget.CoordinatorLayout>

2. 代码配置行为逻辑 #

在Activity里获取BottomSheetBehavior实例，设置状态监听，实现全屏展开和父视图交互的逻辑：

val bottomSheet = findViewById<LinearLayout>(R.id.bottom_sheet)
val behavior = BottomSheetBehavior.from(bottomSheet)

// 设置可展开至全屏
behavior.maxHeight = resources.displayMetrics.heightPixels
behavior.state = BottomSheetBehavior.STATE_COLLAPSED

// 监听Bottom Sheet状态变化
behavior.addBottomSheetCallback(object : BottomSheetBehavior.BottomSheetCallback() {
    override fun onStateChanged(bottomSheet: View, newState: Int) {
        // 可根据状态调整父视图交互（可选）
        when(newState) {
            BottomSheetBehavior.STATE_EXPANDED -> {
                // 全屏时可让父视图暂时不可交互，避免误触
                // parentView.isEnabled = false
            }
            BottomSheetBehavior.STATE_COLLAPSED -> {
                // 收起时恢复父视图交互
                // parentView.isEnabled = true
            }
        }
    }

    override fun onSlide(bottomSheet: View, slideOffset: Float) {
        // 滑动过程中可做过渡动画，比如调整父视图透明度
    }
})

3. 核心特性说明 #

• 父视图可交互：当Bottom Sheet处于收起状态（STATE_COLLAPSED）时，主界面的触摸事件不会被拦截，用户能正常操作父视图元素，和谷歌地图的交互逻辑一致。
• 上滑全屏展开：用户上滑Bottom Sheet，它会从初始的peekHeight高度展开至全屏（STATE_EXPANDED状态），此时可专注操作Bottom Sheet内的内容。
• 纯原生实现：完全依赖AndroidX的Material库，不需要额外引入第三方库。

注意事项 #

• 项目中要确保引入Material库，在build.gradle（Module级别）中添加：

implementation 'com.google.android.material:material:1.11.0' // 版本可按需更新

• Bottom Sheet内部的滚动内容必须用NestedScrollView包裹，这样滑动时才会自动触发Bottom Sheet的展开/收起行为。

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