SwiftUI中VStack内自定义图片与文本间额外空白来源问题

问题根源 #

你遇到的空白是因为自定义图片本身带有透明边距——也就是图片的实际画布尺寸比你看到的视觉内容要大，那些看不见的透明区域会在SwiftUI里占据空间，导致和下方文本之间出现空隙。系统自带的SF Symbols是矢量图标，不存在这类多余的透明区域，所以不会有这个问题。

解决办法 #

方法1：处理图片本身（最彻底）

用图片编辑工具（比如Mac自带的预览、Photoshop）打开你的launcher图片，裁剪掉周围所有透明的空白区域，然后重新导入Assets中。这样图片的实际尺寸就和视觉内容一致，不会再产生额外空隙。

方法2：在SwiftUI中调整图片渲染

如果暂时不想修改图片，可以给Image添加修饰符强制去除多余空间：

Image("launcher")
    .resizable()
    .scaledToFit() // 保持图片比例，同时适配父容器
    .frame(height: 60) // 手动设置图片高度，根据你的需求调整

或者如果图片是固定尺寸，也可以用.clipped()配合裁剪超出区域：

Image("launcher")
    .clipped() // 裁剪掉超出可视内容的区域

另外，也可以检查Assets里图片的设置：选中图片，在右侧属性面板里把Render As设为Original Image，避免SwiftUI自动添加额外的渲染边距。

内容的提问来源于stack exchange，提问作者Cameron Henige