How can I stop a HStack shrinking text so that it truncates?

I have a simple layout I am looking to achieve in a MacOS SwiftUI app. It involves a HStack containing an icon on the left and on the right is some multiline text. However without setting an explicit height for the HStack or text frame, the HStack shrinks and truncates the text. Here is what happens:

Here is my code:

struct Test: View {
    var body: some View {
        HStack(alignment: .center) {
            Image(systemName: "book.fill")
            Text("Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.")
                
        }
//        .frame(height: 100)  // I am reluctant to do this as I may have any amount of text
        .padding()
        
    }
}

I have tried all sorts of stuff:

  • Text(...)..layoutPriority(1)
  • Text(...).multilineTextAlignment(.leading)
  • HStack{...}.frame(minWidth:..., maxWidth:...)

Thank you some kind person willing to help me with a simple layout,

If you limit the size of the Icon to a specific frame size like this:

struct Test: View {
    var body: some View {
        HStack(alignment: .center) {
            Image(systemName: "book.fill")
                .resizable()
                .aspectRatio(contentMode: .fit)
                .frame(width: 30, height: 30)
            Text("Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.")
                .multilineTextAlignment(.leading)

        }
//        .frame(height: 100)  // I am reluctant to do this as I may have any amount of text
        .padding()

    }
}

… and then run the code (rather than observing it using the Preview canvas) you should be OK since it will run it as a Mac App. It gives you a default window size

This is the output I get with the code above when I build and run the code:

If you want to see if look a little more sensible in the Preview canvas then add a frame modifier to the Preview Code like this which kind of simulates what small window would look like on your Mac:

#Preview {
    Test()
        .frame(width: 1024, height: 768)
}