Jetpack Compose关闭Bottom Sheet触发IllegalArgumentException问题

在Jetpack Compose应用中关闭Bottom Sheet时会触发IllegalArgumentException崩溃，但将scrimColor属性设置为透明色时该问题不会出现。

我的代码 #

@OptIn(ExperimentalMaterial3Api::class)
@Composable
private fun DropDownBottomSheetSelector(
    sheetState: SheetState,
    bottomSheetTitle: String,
    items: List<String>,
    onItemSelected: (index: Int, item: String) -> Unit,
    scope: CoroutineScope,
    selectedText: String?,
    dropDownModifier: Modifier = Modifier,
    onDismissRequest: () -> Unit = {},
    show: Boolean = false,
    showSearch: Boolean = false,
) {
    var filterText by remember { mutableStateOf("") }
    val filteredItems =
        if (filterText.isNotEmpty()) {
            items.filter { it.lowercase().contains(filterText.lowercase()) }
        } else {
            items
        }
    var showState by remember(show) {
        mutableStateOf(show)
    }

    if (showState)
        StandardModalBottomSheet(
            state = sheetState,
            windowInsets = WindowInsets.statusBars,
            onDismissRequest = {
                filterText = ""
                showState = false
            },
            padding = PaddingValues(top = 4.dp),
        ) {
            BottomSheetHeaderWithClose(
                header = bottomSheetTitle,
                modifier = Modifier.padding(horizontal = 16.dp),
                showCloseButton = true,
                onCloseClick = {
                    filterText = ""
                    scope.launch {
                        sheetState.hide()
                    }.invokeOnCompletion {
                        if (!sheetState.isVisible) {
                            showState = false
                            onDismissRequest()
                        }
                    }
                },
            )
            Spacer(modifier = Modifier.height(10.dp))
            HorizontalDivider(
                thickness = 1.dp,
                color = DividerColor,
                modifier = Modifier.fillMaxWidth(),
            )
            if (showSearch) {
                Spacer(modifier = Modifier.height(16.dp))
                StandardBasicTextField(
                    modifier = Modifier.padding(horizontal = 16.dp),
                    state =
                    StandardTextFieldState(
                        newText = filterText,
                    ),
                    onValueChange = { filter ->
                        filterText = filter
                    },
                    leadingIcon = {
                        Icon(
                            imageVector = ImageVector.vectorResource(R.drawable.ic_search_gray),
                            contentDescription = null,
                            tint = AshenColorNatural700,
                        )
                    },
                    borderWidth = 0.dp,
                    containerColor = InputBackgroundColor,
                    minHeight = 45.dp,
                )
            }
            LazyColumn(
                verticalArrangement = Arrangement.spacedBy(8.dp),
                contentPadding = PaddingValues(vertical = 16.dp),
                modifier =
                Modifier
                    .navigationBarsPadding()
                    .imePadding(),
            ) {
                itemsIndexed(filteredItems) { index, title ->
                    DropdownMenuItem(
                        text = {
                            Text(
                                text = title,
                                style =
                                CairoBold.copy(
                                    color = DarkBlueGray,
                                    fontSize = 16.sp,
                                ),
                            )
                        },
                        onClick = {
                            if (selectedText != title) {
                                onItemSelected(index, title)
                                scope.launch { sheetState.hide() }
                                    .invokeOnCompletion {
                                        filterText = ""
                                        if (!sheetState.isVisible) {
                                            showState = false
                                            onDismissRequest()
                                        }
                                    }
                            }
                        },
                        contentPadding = PaddingValues(16.dp),
                        trailingIcon = {
                            if (selectedText == title) {
                                Icon(
                                    painter = painterResource(id = R.drawable.ic_check_selector),
                                    contentDescription = selectedText,
                                    tint = BrandColor,
                                )
                            }
                        },
                        modifier = dropDownModifier,
                    )
                }
            }
        }
}

崩溃详情 #

java.lang.IllegalArgumentException: red = 0.0, green = 0.0, blue = 0.0, alpha = -2.3841858E-8 outside the range for sRGB IEC61966-2.1 (id=0, model=Rgb)
  at androidx.compose.ui.graphics.InlineClassHelperKt.throwIllegalArgumentException(InlineClassHelper.kt:26)
  at androidx.compose.ui.graphics.ColorKt.Color(Color.kt:722)
  at androidx.compose.ui.graphics.Color.copy-wmQWz5c(Color.kt:259)
  at androidx.compose.ui.graphics.Color.copy-wmQWz5c$default(Color.kt:254)
  at androidx.compose.ui.graphics.drawscope.CanvasDrawScope.modulate-5vOe2sY(CanvasDrawScope.kt:713)
  at androidx.compose.ui.graphics.drawscope.CanvasDrawScope.configurePaint-2qPWKa0(CanvasDrawScope.kt:645)
  at androidx.compose.ui.graphics.drawscope.CanvasDrawScope.configurePaint-2qPWKa0$default(CanvasDrawScope.kt:635)
  at androidx.compose.ui.graphics.drawscope.CanvasDrawScope.drawRect-n-J9OG0(CanvasDrawScope.kt:195)
  at androidx.compose.ui.node.LayoutNodeDrawScope.drawRect-n-J9OG0(Unknown Source:15)
  at androidx.compose.ui.graphics.drawscope.DrawScope.drawRect-n-J9OG0$default(DrawScope.kt:487)
  at androidx.compose.material3.ModalBottomSheet_androidKt$Scrim$1$1.invoke(ModalBottomSheet.android.kt:393)
  at androidx.compose.material3.ModalBottomSheet_androidKt$Scrim$1$1.invoke(ModalBottomSheet.android.kt:392)
  at androidx.compose.ui.draw.DrawBackgroundModifier.draw(DrawModifier.kt:127)
  at androidx.compose.ui.node.LayoutNodeDrawScope.drawDirect-eZhPAX0$ui_release(LayoutNodeDrawScope.kt:110)
  at androidx.compose.ui.node.LayoutNodeDrawScope.draw-eZhPAX0$ui_release(LayoutNodeDrawScope.kt:89)
  at androidx.compose.ui.node.NodeCoordinator.drawContainedDrawModifiers(NodeCoordinator.kt:434)
  at androidx.compose.ui.node.NodeCoordinator.draw(NodeCoordinator.kt:423)
  at androidx.compose.ui.node.LayoutModifierNodeCoordinator.performDraw(LayoutModifierNodeCoordinator.kt:280)
  at androidx.compose.ui.node.NodeCoordinator.drawContainedDrawModifiers(NodeCoordinator.kt:431)
  at androidx.compose.ui.node.NodeCoordinator.draw(NodeCoordinator.kt:423)
  at androidx.compose.ui.node.LayoutNode.draw$ui_release(LayoutNode.kt:964)
  at androidx.compose.ui.node.InnerNodeCoordinator.performDraw(InnerNodeCoordinator.kt:196)
  at androidx.compose.ui.node.NodeCoordinator.drawContainedDrawModifiers(NodeCoordinator.kt:431)
  at androidx.compose.ui.node.NodeCoordinator.draw(NodeCoordinator.kt:423)
  at androidx.compose.ui.node.LayoutModifierNodeCoordinator.performDraw(LayoutModifierNodeCoordinator.kt:280)
  at androidx.compose.ui.node.NodeCoordinator.drawContainedDrawModifiers(NodeCoordinator.kt:431)
  at androidx.compose.ui.node.NodeCoordinator.draw(NodeCoordinator.kt:423)
  at androidx.compose.ui.node.LayoutNode.draw$ui_release(LayoutNode.kt:964)
  at androidx.compose.ui.node.InnerNodeCoordinator.performDraw(InnerNodeCoordinator.kt:196)
  at androidx.compose.ui.node.NodeCoordinator.drawContainedDrawModifiers(NodeCoordinator.kt:431)
  at androidx.compose.ui.node.NodeCoordinator.draw(NodeCoordinator.kt:423)
  at androidx.compose.ui.node.LayoutModifierNodeCoordinator.performDraw(LayoutModifierNodeCoordinator.kt:280)
  at androidx.compose.ui.node.NodeCoordinator.drawContainedDrawModifiers(NodeCoordinator.kt:431)
  at androidx.compose.ui.node.NodeCoordinator.draw(NodeCoordinator.kt:423)
  at androidx.compose.ui.node.LayoutModifierNodeCoordinator.performDraw(LayoutModifierNodeCoordinator.kt:280)
  at androidx.compose.ui.node.NodeCoordinator.drawContainedDrawModifiers(NodeCoordinator.kt:431)
  at androidx.compose.ui.node.NodeCoordinator.access$drawContainedDrawModifiers(NodeCoordinator.kt:58)
  at androidx.compose.ui.node.NodeCoordinator$drawBlock$1$1.invoke(NodeCoordinator.kt:453)
  at androidx.compose.ui.node.NodeCoordinator$drawBlock$1$1.invoke(NodeCoordinator.kt:452)
  at androidx.compose.runtime.snapshots.Snapshot$Companion.observe(Snapshot.kt:2439)
  at androidx.compose.runtime.snapshots.SnapshotStateObserver$ObservedScopeMap.observe(SnapshotStateObserver.kt:502)
  at androidx.compose.runtime.snapshots.SnapshotStateObserver.observeReads(SnapshotStateObserver.kt:258)
  at androidx.compose.ui.node.OwnerSnapshotObserver.observeReads$ui_release(OwnerSnapshotObserver.kt:133)
  at androidx.compose.ui.node.NodeCoordinator$drawBlock$1.invoke(NodeCoordinator.kt:452)
  at androidx.compose.ui.node.NodeCoordinator$drawBlock$1.invoke(NodeCoordinator.kt:450)
  at androidx.compose.ui.platform.RenderNodeApi29.record(RenderNodeApi29.android.kt:209)
  at androidx.compose.ui.platform.RenderNodeLayer.updateDisplayList(RenderNodeLayer.android.kt:341)
  at androidx.compose.ui.platform.RenderNodeLayer.drawLayer(RenderNodeLayer.android.kt:283)
  at androidx.compose.ui.node.NodeCoordinator.draw(NodeCoordinator.kt:418)
  at androidx.compose.ui.node.LayoutNode.draw$ui_release(LayoutNode.kt:964)
  at androidx.compose.ui.node.InnerNodeCoordinator.performDraw(InnerNodeCoordinator.kt:196)
  at androidx.compose.ui.node.NodeCoordinator.drawContainedDrawModifiers(NodeCoordinator.kt:431)
  at androidx.compose.ui.node.NodeCoordinator.draw(NodeCoordinator.kt:423)
  at androidx.compose.ui.node.LayoutNode.draw$ui_release(LayoutNode.kt:964)
  at androidx.compose.ui.platform.AndroidComposeView.dispatchDraw(AndroidComposeView.android.kt:1515)
  at android.view.View.draw(View.java:24193)
  at android.view.View.updateDisplayListIfDirty(View.java:23056)
  at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4550)
  at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:4523)
  at android.view.View.updateDisplayListIfDirty(View.java:23012)
  at android.view.ThreadedRenderer.updateViewTreeDisplayList(ThreadedRenderer.java:694)
  at android.view.ThreadedRenderer.updateRootDisplayList(ThreadedRenderer.java:700)
  at android.view.ThreadedRenderer.draw(ThreadedRenderer.java:798)
  at android.view.ViewRootImpl.draw(ViewRootImpl.java:5234)
  at android.view.ViewRootImpl.performDraw(ViewRootImpl.java:4900)
  at android.view.ViewRootImpl.performTraversals(ViewRootImpl.java:4049)
  at android.view.ViewRootImpl.doTraversal(ViewRootImpl.java:2659)
  at android.view.ViewRootImpl$TraversalRunnable.run(ViewRootImpl.java:9789)
  at android.view.Choreographer$CallbackRecord.run(Choreographer.java:1399)
  at android.view.Choreographer$CallbackRecord.run(Choreographer.java:1408)
  at android.view.Choreographer.doCallbacks(Choreographer.java:1008)
  at android.view.Choreographer.doFrame(Choreographer.java:938)
  at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:1382)
  at android.os.Handler.handleCallback(Handler.java:959)
  at android.os.Handler.dispatchMessage(Handler.java:100)
  at android.os.Looper.loopOnce(Looper.java:232)
  at android.os.Looper.loop(Looper.java:317)
  at android.app.ActivityThread.main(ActivityThread.java:8501)
  at java.lang.reflect.Method.invoke(Native Method)
  at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:552)
  at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:878)

问题原因与解决方案 #

原因分析 #

从崩溃栈可以看出，问题出在Bottom Sheet的scrim遮罩绘制时，颜色的alpha值变成了负数（-2.3841858E-8），超出了sRGB颜色空间要求的[0,1]范围。这通常是因为Bottom Sheet关闭动画中，遮罩透明度的计算出现了浮点精度误差，导致alpha值溢出合法范围。当设置scrimColor为透明时，遮罩不会参与绘制，因此不会触发该错误。

解决方案 #

1. 显式指定合法的scrim颜色
   在StandardModalBottomSheet中显式设置scrimColor，确保alpha值在0到1之间，比如：

   StandardModalBottomSheet(
       // 其他参数
       scrimColor = Color.Black.copy(alpha = 0.5f)
   ) {
       // Sheet内容
   }
   

2. 升级Material3库版本
   这个问题可能是Material3旧版本的已知bug，升级到最新稳定版的Material3 Compose库可以修复该问题。

3. 修正scrim透明度的计算逻辑
   如果StandardModalBottomSheet是自定义组件，可以在处理遮罩透明度时，用coerceIn(0f, 1f)来确保alpha值始终在合法范围内：

   val scrimAlpha = // 原透明度计算值
   val safeScrimColor = scrimColor.copy(alpha = scrimAlpha.coerceIn(0f, 1f))
   

内容的提问来源于stack exchange，提问作者Hassan Salah