核心问题
bottomSheet弹出之后,点击内部的EditText,软键盘弹出时,bottomSheet会被顶起来,但是顶起来的高度不对,
遮挡了editText下方的组件。
解决思路
- 观看源码发现 BottomSheet已经适配了软键盘弹出的问题。
ModalBottomSheetDialog( properties = properties, onDismissRequest = { if (sheetState.currentValue == Expanded && sheetState.hasPartiallyExpandedState) { // Smoothly animate away predictive back transformations since we are not fully // dismissing. We don't need to do this in the else below because we want to // preserve the predictive back transformations (scale) during the hide animation. scope.launch { predictiveBackProgress.animateTo(0f) } scope.launch { sheetState.partialExpand() } } else { // Is expanded without collapsed state or is collapsed. scope.launch { sheetState.hide() }.invokeOnCompletion { onDismissRequest() } } }, predictiveBackProgress = predictiveBackProgress, ) { //这里已经加入了imePadding Box(modifier = Modifier.fillMaxSize().imePadding().semantics { isTraversalGroup = true }) { Scrim( color = scrimColor, onDismissRequest = animateToDismiss, visible = sheetState.targetValue != Hidden, ) ModalBottomSheetContent( predictiveBackProgress, scope, animateToDismiss, settleToDismiss, modifier, sheetState, sheetMaxWidth, shape, containerColor, contentColor, tonalElevation, dragHandle, contentWindowInsets, content ) } }
- 但是在使用的时候,偏移的高度并不是整个键盘的高度
val newAnchors = DraggableAnchors { Hidden at fullHeight if ( sheetSize.height > (fullHeight / 2) && !sheetState.skipPartiallyExpanded ) { // 如果sheetSize.height大于fullHeight / 2 就把 partiallyExpanded 设置为 fullHeight / 2 PartiallyExpanded at fullHeight / 2f } if (sheetSize.height != 0) { Expanded at max(0f, fullHeight - sheetSize.height) } }
- 解决办法
我们并不需要这个部分展开的状态限制val bottomSheetState = rememberModalBottomSheetState( skipPartiallyExpanded = true )