imagetextswiftuiiconsline-height

SwiftUI: fit SF Icon into line height


When I try to display an icon next to a text, the Image adds unwanted space above, increasing the line height and I don't understand how I can control it. I tried frame, padding, resizable without success. I also tried the Label element, which my XCode does not recognize ("unresolved identifier Label").

Image adds unwanted space around it, increasing the line height

The image shows the difference between an Image and Text, where the Image adds unwanted space.

Where is that extra space coming from and how can I control it?

VStack {
    Text("User Name").bold()
    HStack {
        Text("hello@contact.com")
        Image(systemName: "checkmark.seal.fill")
        .font(.system(size: 14))
            .foregroundColor(.blue)
    }
}

Solution

  • The image shows the difference between an Image and Text, where the Image adds unwanted space. Where is that extra space coming from and how can I control it?

    It is all about default spacing... it is, yes, strange, use explicit, eg

    VStack(spacing: 0) {
       // ... other your code
    }