我有一个设计要完成,这是一个白色背景的图标,必须是圆形的. 我try 了许多可能的方法,但我一直未能做到这一点.

我附上了我所做的图像和代码.

我目前的设计:

enter image description here

它应该是什么样子:

enter image description here

我的代码是:

Box(
    modifier = Modifier
        .background(Color.White)
        .clip(RoundedCornerShape(10.dp))
) {
    Icon(
        Icons.Outlined.StarOutline,
        modifier = Modifier
            .size(50.dp)
            .padding(10.dp),
        contentDescription = null
    )
}

推荐答案

The order of the modifiers matters,对于您正在try 实现的内容,应该首先裁剪可合成的内容,然后应用白色背景:

Box(
    modifier = Modifier
        .clip(RoundedCornerShape(percent = 50))
        .background(Color.White)
) {
    Icon(
        Icons.Outlined.StarOutline,
        modifier = Modifier
            .size(50.dp)
            .padding(10.dp),
        contentDescription = null
    )
}

我还将RoundedCornerShape设置为50%,这样它就像所需的输出一样是圆形的.

Android相关问答推荐

致命异常:java.lang. SecureExcellent::用户10021和当前进程都没有android. permissions.Change_WIFI_STATE

编写Landscape BoxWithRequests具有错误的高度.(aspectRatio matchHeight约束第一次未按预期工作)

使用Kotlin/Compose与Java/XML指南的比较

Jetpack Compose-如何在进入新产品线之前删除单词?

设置文本 colored颜色 动画时如何减少重新组合?

为什么我在 android 中使用 TabLayout 时无法启动我的 Activity?

使用 settings.gradle 文件将 Firebase 依赖项添加到 Android 项目

单击按钮时不显示 Toast 消息

Android Studio:按下前缀键:切换 Logcat 格式

Jetpack Compose 部分或开放侧边框

在移动设备上看到时如何增加 PasswordField 文本?

Jetpack Compose UI - 在 AlertDialog 中单击时按钮宽度会发生变化

如何像 XML 一样在 Compose Android Studio 中折叠/展开小部件代码区域/区域

您如何衡量条形图的 4 个类别?

使用 capacitor cordova 插件的 Android Studio 错误

在 Kotlin 客户端应用程序中发送 FCM 推送通知 - Firebase 云消息传递

新安装 Expo Go 的 android 设备上的 sdk 46.0.0 (@snack/sdk.46.0.0) 出错

如何在stroke android drawable中设置渐变

如何删除 Ktor 客户端 2.0.0 的默认标头

使用协程访问数据库