Swiftui how to programatically adjust spacing between images and text?

Question

I'm trying to get an aligned text-image pairs in swiftui programmatically. Is it possible?

I want the word "Visit" to start from the same position in both rows.

This is my code:

HStack{
        Image(systemName: item.leftImage) // A system image name
        Text(item.text) // A text representing the item
}

I know that I can add spacing to the HStack itself, but it won't fix my issue. Since every systemimage provided by apple has a different sizing, I guess that I should programmatically somehow determine the spacing that should be instantiated between each the image to the text.

How can I do that?

Answer 1

I would recommend to use explicit width for image frame, this will fit any symbol automatically and make it centred

HStack{
        Image(systemName: item.leftImage)
           .frame(width: 28)
        Text(item.text)
}