Jetpack Compose Material3 disabled ListItem-CodePudding

so I am trying to implement some Material3 theming and want to display a list of items which may be disabled or not. As far as I can see the ListItem Composable does not allow to display it in disabled state because the colors of the content are hardcoded to "enabled = true" as you can see in below code example. How can I implement a ListItem in disabled state?

@Composable
@ExperimentalMaterial3Api
fun ListItem(
    headlineText: @Composable () -> Unit,
    modifier: Modifier = Modifier,
    overlineText: @Composable (() -> Unit)? = null,
    supportingText: @Composable (() -> Unit)? = null,
    leadingContent: @Composable (() -> Unit)? = null,
    trailingContent: @Composable (() -> Unit)? = null,
    colors: ListItemColors = ListItemDefaults.colors(),
    tonalElevation: Dp = ListItemDefaults.Elevation,
    shadowElevation: Dp = ListItemDefaults.Elevation,
) {
    if (overlineText == null && supportingText == null) {
        // One-Line List Item
        ListItem(
            modifier = modifier,
            containerColor = colors.containerColor().value,
            contentColor = colors.headlineColor(enabled = true).value, // headlineColor is always enabled
            tonalElevation = tonalElevation,
            shadowElevation = shadowElevation,
            minHeight = ListTokens.ListItemContainerHeight,
            paddingValues = PaddingValues(ListItemHorizontalPadding, ListItemVerticalPadding)
        ) {
            if (leadingContent != null) {
                leadingContent(
                    leadingContent = leadingContent,
                    contentColor = colors.leadingIconColor(enabled = true).value,
                    topAlign = false
                )()
            }
            Box(
                Modifier
                    .weight(1f)
                    .align(Alignment.CenterVertically)
            ) {
                ProvideTextStyleFromToken(
                    colors.headlineColor(enabled = true).value,
                    ListTokens.ListItemLabelTextFont,
                    headlineText
                )
            }
            if (trailingContent != null) {
                trailingContent(
                    trailingContent = trailingContent,
                    contentColor = colors.trailingIconColor(enabled = true).value,
                    topAlign = false
                )()
            }
        }
    }

CodePudding user response：

Currently (M3 1.0.0-rc01) the ListItem doesn't support an enable parameter and the disabledLeadingIconColor is not used.

As workaround you can use something like:

var enabled by remember { mutableStateOf(true)}

Column {
    ListItem(
        headlineText = { Text("One line list item with 24x24 icon") },
        leadingContent = {
            Icon(
                Icons.Filled.Favorite,
                contentDescription = "Localized description",
            )
        },
        colors = ListItemDefaults.colors(
            leadingIconColor =  if (enabled) Teal200 else Red)
    )
    Divider()
}