android 使用IconButton在使用jetpack compose的Image中显示可绘制对象

xqk2d5yq 于 2023-05-21 发布在 Android

关注(0)|答案(1)|浏览(156)

使用AsyncImage可以正确显示。但我想在IconButton中使用它，但效果不同。有关IconButton和Image，请参见下文

AsyncImage(
                    model = R.drawable.add_photo,
                    contentDescription = stringResource(R.string.selected_image),
                    modifier = Modifier
                        .size(60.dp)
                        .border(
                            width = 2.dp,
                            color = MaterialTheme.colorScheme.photoPickerBorderColor,
                            shape = RoundedCornerShape(5.dp)
                        )
                        .clip(shape = RoundedCornerShape(5.dp)).
                        clickable {
                            onAddPhotosClicked()
                        })

我试图在这里使用IconButton和具有相同属性的Image，只是想知道为什么它会这样显示，因为它似乎在剪裁角落。有没有办法像在AsyncImage中那样显示它

IconButton(
            onClick = {
                onAddPhotosClicked()
            }) {
            Image(
                painter = painterResource(id = R.drawable.add_photo),
                contentDescription = stringResource(id = R.string.add_photos),
                modifier = Modifier
                    .size(60.dp)
                    .border(
                        width = 2.dp,
                        color = MaterialTheme.colorScheme.photoPickerBorderColor,
                        shape = RoundedCornerShape(5.dp)
                    )
                    .clip(shape = RoundedCornerShape(5.dp)),
            )
        }

android

来源：https://stackoverflow.com/questions/76264953/using-iconbutton-to-display-a-drawable-in-the-image-using-jetpack-compose

1条答案

按热度按时间

6yjfywim1#

这是因为M3图标按钮剪辑与md.sys.shape.corner.full这是一个圆圈，可以在官方文件。
M3的IconButton源代码，您可以在此answer中看到M2

@Composable
fun IconButton(
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
    enabled: Boolean = true,
    colors: IconButtonColors = IconButtonDefaults.iconButtonColors(),
    interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
    content: @Composable () -> Unit
) {
    Box(
        modifier = modifier
            .minimumInteractiveComponentSize()
            .size(IconButtonTokens.StateLayerSize)
            .clip(IconButtonTokens.StateLayerShape.toShape())
            .background(color = colors.containerColor(enabled).value)
            .clickable(
                onClick = onClick,
                enabled = enabled,
                role = Role.Button,
                interactionSource = interactionSource,
                indication = rememberRipple(
                    bounded = false,
                    radius = IconButtonTokens.StateLayerSize / 2
                )
            ),
        contentAlignment = Alignment.Center
    ) {
        val contentColor = colors.contentColor(enabled).value
        CompositionLocalProvider(LocalContentColor provides contentColor, content = content)
    }

您可以轻松地复制源代码并删除剪辑或创建自己的具有类似属性的Box。

赞(0）回复(0）举报 2023-05-21

我来回答

android 使用IconButton在使用jetpack compose的Image中显示可绘制对象

1条答案

相关问题

热门标签

最新问答