Material3 Jetpack Compose：ModalBottomSheet的Modifier.imePadding()在API29及以下失效

当BottomSheet内嵌TextField时，弹出的键盘常会遮挡输入框，Modifier.imePadding()可以自动添加键盘高度的padding来上移布局，但该API仅在Android 10（API 29）及以上生效。以下是兼容全版本的解决方案：

方案1：通过ViewCompat手动监听WindowInsets（推荐） #

利用ViewCompat提供的Insets监听API，手动获取键盘高度并设置给BottomSheet的根布局，兼容所有支持WindowInsetsCompat的版本（API 14+）。

Compose实现示例 #

import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.text.BasicTextField
import androidx.compose.material3.ModalBottomSheet
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.LocalView
import androidx.core.view.ViewCompat
import androidx.core.view.WindowInsetsCompat

@Composable
fun KeyboardFriendlyBottomSheet() {
    val bottomSheetState = rememberModalBottomSheetState(skipPartiallyExpanded = true)
    val view = LocalView.current
    var inputText by remember { mutableStateOf("") }

    LaunchedEffect(view) {
        ViewCompat.setOnApplyWindowInsetsListener(view) { v, insets ->
            // 获取键盘对应的Insets值
            val imeInsets = insets.getInsets(WindowInsetsCompat.Type.ime())
            // 将BottomSheet底部padding设置为键盘高度
            v.setPadding(0, 0, 0, imeInsets.bottom)
            insets
        }
    }

    ModalBottomSheet(
        sheetState = bottomSheetState,
        onDismissRequest = { /* 关闭逻辑 */ }
    ) {
        Column(modifier = Modifier.fillMaxWidth()) {
            Text("请输入内容")
            BasicTextField(
                value = inputText,
                onValueChange = { inputText = it },
                modifier = Modifier.fillMaxWidth()
            )
        }
    }
}

View系统（BottomSheetDialogFragment）实现示例 #

import android.os.Bundle
import android.view.View
import androidx.appcompat.app.AppCompatDialogFragment
import androidx.core.view.ViewCompat
import androidx.core.view.WindowInsetsCompat
import com.google.android.material.bottomsheet.BottomSheetDialog

class CustomBottomSheetDialogFragment : AppCompatDialogFragment() {

    override fun onCreateDialog(savedInstanceState: Bundle?): Dialog {
        val dialog = super.onCreateDialog(savedInstanceState) as BottomSheetDialog
        dialog.setOnShowListener {
            // 获取BottomSheet的根View
            val bottomSheet = dialog.findViewById<View>(com.google.android.material.R.id.design_bottom_sheet)
            bottomSheet?.let { sheet ->
                ViewCompat.setOnApplyWindowInsetsListener(sheet) { v, insets ->
                    val imeInsets = insets.getInsets(WindowInsetsCompat.Type.ime())
                    v.setPadding(0, 0, 0, imeInsets.bottom)
                    insets
                }
            }
        }
        return dialog
    }
}

方案2：结合可滚动布局+动态高度调整 #

如果BottomSheet内容较多，建议将内容放在可滚动容器（如Compose的ScrollableColumn、View系统的NestedScrollView）中，再配合Insets监听调整布局高度，确保输入框始终可见。

Compose示例补充 #

// 在BottomSheet内容中使用ScrollableColumn
ScrollableColumn(modifier = Modifier.fillMaxWidth()) {
    // 其他内容
    BasicTextField(
        value = inputText,
        onValueChange = { inputText = it },
        modifier = Modifier.fillMaxWidth()
    )
}

关键注意事项 #

• 若使用ModalBottomSheet，确保skipPartiallyExpanded设置为true，避免半展开状态下的布局冲突
• 测试时需覆盖不同API版本的设备，验证键盘弹出时的布局偏移效果

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