SwiftUI HStack 文本未对齐

Question

我目前在列表中有一些 HStacks。

然而，奇怪的是，“攻击”文本比所有其他字段稍微靠右一些。它可能很难被注意到，但它让一切看起来都有些不对劲。奇怪的是，当我尝试为其使用不同的图标时，这并没有发生，比如 shield.checkerboard:

这是我为这里的每个单元格使用的代码：

struct StatCell: View {
    
    var title: String
    var imgName: String
    var clr: Color
    var value: Int
    
    var body: some View {
        HStack {
            Image(systemName: imgName)
                .font(.headline)
                .foregroundColor(clr)
                .imageScale(.medium)
            
            Text(title)
                .font(.headline)
                .padding(.leading, 10)
            
            Spacer()
            
            Text("\(value)")
                .font(.headline)
                .foregroundColor(.gray)
        }
    }
}

我是 Swift 和 iOS 开发的新手，所以如果我有任何术语错误，我深表歉意。如果有人知道除了使用不同图标之外的任何解决方案，我们将不胜感激！

Answer 1

Asperi 的评论包含这个答案，解决了我的问题！

在图像上放置 .frame(width: 28) 会将它们设置为相同的宽度，从而防止出现此问题。

SwiftUI HStack 文本未对齐

SwiftUI HStack text unaligned

ios

swift

swiftui

swiftui-list