SwiftUI : text gets cut off with "..." in my view

Question

In my view I have a lot of text and a border around it but it sometimes gets cut off and has "..." at the end of it. I've tried with .layout .layoutPriority() and .fixedSize(), what's weird is that depending on where and how often I use the .layoutPriority() it's not cut off at the same place and on every device. Screenshot of it in the iPhone 8 iOS 13.3 simulator. Thanks in advance for your help.

Here is my current code

import SwiftUI
import SafariServices

struct WhatIsStopView: View {

    @State var show4 = false

    var body: some View {
        GeometryReader { geometry in
            ScrollView(.vertical) {
            VStack(alignment: .leading, spacing: 30) {
                HStack(spacing: 15) {
                    Text("whatIsAStop")
                    Image(systemName: "camera")
                }.font(.largeTitle)
                VStack(alignment: .leading, spacing: 45) {
                    VStack(alignment: .leading, spacing: 25) {
                        Text("inPhotographyAStop").layoutPriority(2)

                        Text("stopDoubling").fontWeight(.semibold).layoutPriority(2)

                        Text("forExample").layoutPriority(2)

                        VStack {
                            Image("exposure-stops").resizable()
                                        .aspectRatio(contentMode: .fit)
                            Text("stopIsAMeasure").italic().layoutPriority(2)
                        }

                        Text("amountOfLightCaptured").layoutPriority(2)

                    }

                    VStack(alignment: .leading, spacing: 25) {
                        Text("stopsAndShutterSpeed").font(.headline).layoutPriority(2)

                        Text("shutterSpeedMeasures").layoutPriority(2)

                        VStack {
                            Image("exposure-stops-shutter-speed").resizable()
                                .aspectRatio(contentMode: .fit)
                            Text("commonShutterSpeedStops").italic().layoutPriority(2)
                        }

                        Text("forExampleChanging").layoutPriority(2)

                        Text("mostCamerasAllow").layoutPriority(2)
                    }

                    VStack(alignment: .leading, spacing: 25) {
                        Text("stopsAndISOSpeed").font(.headline).layoutPriority(2)

                        Text("ISOSpeedDescribes").layoutPriority(2)

                        VStack {
                            Image("exposure-stops-iso-speed").resizable()
                            .aspectRatio(contentMode: .fit)
                            Text("commonISOSpeedStops").italic().layoutPriority(2)
                        }

                        Text("ISOIsMeasured").layoutPriority(2)

                        Text("forExampleSwitching").layoutPriority(2)
                    }

                    VStack(alignment: .leading, spacing: 25) {
                        Text("stopsAndAperture").font(.headline).layoutPriority(2)

                        Text("apertureIsMeasured").layoutPriority(2)

                        VStack {
                            Image("exposure-stops-aperture").resizable()
                            .aspectRatio(contentMode: .fit)
                            Text("commonApertureStops").italic().layoutPriority(2)
                        }

                        Text("becauseOfTheWay").layoutPriority(2)

                        Text("asWithShutterSpeed").layoutPriority(2)
                    }

                    VStack(alignment: .leading, spacing: 25) {

                            Text("stopsAreInterchangeable").font(.headline).layoutPriority(2)

                            Text("theGreatThing").layoutPriority(2)

                            Text("letsSay").layoutPriority(2)

                            Text("thisChangeOf").layoutPriority(2)

                            Text("youCouldOpen").layoutPriority(2)

                            Text("alternativelyYouCould").layoutPriority(2)

                            Text("asYouCanSee").layoutPriority(2)
                    }

                    VStack(alignment: .leading, spacing: 25) {

                            Text("conderationsWhenAdjustingExposure").font(.headline).layoutPriority(2)

                            Text("whenAdjustingTheThree").layoutPriority(2)

                            Text("shutterSpeedIf").layoutPriority(2)

                            Text("apertureA").layoutPriority(2)

                            Text("ISOSpeedThe").layoutPriority(2)

                            Text("asWithEverything").layoutPriority(2)

                            Text("exposureStopsAreA").layoutPriority(2)
                    }

                    Divider()

                    HStack {
                        Button(action: {
                            self.show4.toggle()
                        }) {
                            Text("linkToOriginalArticle").padding().foregroundColor(.white)
                                .background(LinearGradient(gradient: .init(colors: [.yellow,.purple]), startPoint: .leading, endPoint: .trailing))
                            .cornerRadius(20)
                                .sheet(isPresented: self.$show4) {
                                    photography().edgesIgnoringSafeArea(.all)
                            }
                        }
                        Spacer()
                        Text("© Photography Mad")
                    }

                    }.padding()
                .overlay(
                    RoundedRectangle(cornerRadius: 16)
                        .stroke((LinearGradient(gradient: .init(colors: [.purple,.blue]), startPoint: .leading, endPoint: .trailing)), lineWidth: 4)
                )
                Spacer()
            }.padding()
                VStack {
                    AdView().frame(width: 320, height: 50)
                }.edgesIgnoringSafeArea([.top, .leading, .trailing])
        }
    }
        .navigationBarTitle(Text("whatIsAStop"), displayMode: .inline)
    }
}

struct WhatIsStopView_Previews: PreviewProvider {
    static var previews: some View {
        WhatIsStopView()
            .environment(\.locale, .init(identifier: "fr"))
    }
}


struct photography : UIViewControllerRepresentable {

    func makeUIViewController(context: UIViewControllerRepresentableContext<photography>) -> SFSafariViewController {
        let controller = SFSafariViewController(url: URL(string: "https://www.photographymad.com/pages/view/what-is-a-stop-of-exposure-in-photography")!)
        return controller
    }
    func updateUIViewController(_ uiViewController: SFSafariViewController, context: UIViewControllerRepresentableContext<photography>) {

    }
}

Answer 1

In iOS 14 you could try

For horizontal expansion try

.fixedSize(horizontal: false, vertical: true)

For vertical expansion try

.fixedSize(horizontal: true, vertical: false)

Answer 2

The behavior is quite normal.

Layout priority lets you control how readily a view shrinks when space is limited or expands when space is plentiful. All views have a layout priority of 0 by default, which means they each get an equal chance to grow or shrink. When you give your text a layout priority of 1, which is higher than 0, it will automatically take up all available space.

When you set all Textfields to layoutPriority(1), that means, that all textfields again have the same priority and the view decides, which one will expand.

You can check with the following example.

struct layout: View {

let text: String = "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet."

    var body: some View {
        VStack(alignment: .leading, spacing: 25) {
            Text(text)
            Text(text)
            Text(text)
        }
    }
}

Now embed the VStack into a scrollView. Because the scrollView expands automatically, when the view will not fit, all Textfields will show the complete Text without using Layout Priority.

You see, that there is normally no need for a layout priority in a flexible view.

In your Code, you use a geometryReader but have no constraints set. So please check your code, if the geometryReader limits the size of the view.