Text inside a VStack truncates when it's not supposed to in SwiftUI

Question

I'm trying to create a simple stack of Text inside a VStack, and no matter what I do, the text will truncate instead of wrap, even if I explicitly set lineLimit(nil) (although I know this is the default now).

I've tried setting layoutPriority(1) on the first element in the VStack, and I have also tried setting frame(idealHeight: .greatestFiniteMagnitude) as some other posts have suggested, but nothing seems to fix the issue.

Here is a video of the issue in action:

Here is some code that reproduces the issue:

import SwiftUI

struct BugRepro: View {

    @State var length: Double = 1.0

    var body: some View {
        VStack {
            ForEach(0..<3) { i in
                BugReproElement(index: i)
            }
            .background(Color.gray3)
            .frame(width: UIScreen.main.bounds.width * CGFloat(length))


            Slider(value: $length, in: 0.0...1.0)
        }

    }
}

struct BugRepro_Previews: PreviewProvider {
    static var previews: some View {
        BugRepro()
    }
}

struct BugReproElement: View {
    var index: Int

    var body: some View {
        Text("iaush isuh siudh siudh isudh isudhdsiu sdiuh sdihs")
        .foregroundColor(.gray7)
        .frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)
    }
}

Could this just be a bug in Xcode? I'm running Beta 7

Answer 1

I figured out how to get the text to render properly.

Applying the answer here works: Views compressed by other views in SwiftUI VStack and List

The key is to ensure that the .fixedSize() gets added before .frame()

No Spacer() needed!

Answer 2

I had to add .fixedSize(horizontal: false, vertical: true) AND .padding() before all my text would stop truncating (show in view properly) I also have a frame tag for a separate vstack (I have 2 separate vstacks in the view)

Answer 3

Unfortunately It is a bug.

There is a work around you can use to force it to recalculate elements but it's just a workaround and you must wait for the release and see if it fixed.

Workaround

Add a pair of spacer with the height of zero above and below the contents of ForEach.

struct BugRepro: View {

    @State var length: Double = 1.0

    var body: some View {
        VStack {
            ForEach(0..<3) { i in
                Spacer().frame(height: 0)
                BugReproElement(index: i)
                Spacer().frame(height: 0)
            }.frame(width: UIScreen.main.bounds.width * CGFloat(length))

            Slider(value: self.$length, in: 0.0...1.0)
        }
    }
}

Answer 4

.fixedSized had to be added before .font() for it to work for me.