swiftui中使用icon图标时,让中间部分不透明显示

在使用了Image(systemName: "plus.circle.fill")这个视图组件后,发现中间的加号竟然是透明的,但是我们想要的是不让它透明,该怎么做呢?

最简单的方式就是给这个图片设置一个白色的背景是不是就好了?我们可以尝试修改一下:

Swift 复制代码
Image(systemName: "plus.circle.fill")
                              .font(.title)
                              .background(Circle().fill(.white))

可以看到确实不透明了,但是这个按钮的周围怎么出现了白色的一个边框?这也不是我们想要的结果啊,好吧,确实不能这么简单的设置

还有一种方式,就是设置symbolRenderingMode渲染模式,将渲染模式设置为色盘模式:.symbolRenderingMode(.palette),然后自定义修改前景色和背景色:.foregroundStyle(.white, .blue),最后出现的效果就是:

Swift 复制代码
Image(systemName: "plus.circle.fill")
                              .font(.title)
                              .symbolRenderingMode(.palette)
                              .foregroundStyle(.white, .blue)

这么设置之后,就是我们想要的结果了:

相关推荐
hepherd3 分钟前
Flask学习笔记 - 模板渲染
前端·flask
LaoZhangAI3 分钟前
【2025最新】Manus邀请码免费获取完全指南:5种稳定渠道+3个隐藏方法
前端
经常见5 分钟前
浅拷贝与深拷贝
前端
前端飞天猪10 分钟前
学习笔记:三行命令,免费申请https加密证书📃
前端
关二哥拉二胡11 分钟前
前端的 AI 应用开发系列二:手把手揭秘 RAG
前端·面试
斯~内克13 分钟前
前端图片加载性能优化全攻略:并发限制、预加载、懒加载与错误恢复策略
前端·性能优化
奇怪的知识又增长了22 分钟前
Command SwiftCompile failed with a nonzero exit code Command SwiftGeneratePch em
前端
Maofu22 分钟前
从React项目 迁移到 Solid项目的踩坑记录
前端
薄荷味22 分钟前
ubuntu 服务器安装 docker
前端
Carlos_sam23 分钟前
OpenLayers:如何控制Overlay的层级?
前端·javascript