CODEWITHSUNDEEP
swiftui
fs_tigre
fs_tigre

Reputation: 10748

Why text gets cutoff in Text in SwiftUI

As you can see from the image below the L (Lorem) and the p (previewing) are cutoff, any idea why some of the text inside the Text gets cut off?

struct ContentView: View {
    var body: some View {
        ZStack {
            Image("placeholder-image")
                .resizable()
                .scaledToFill()
                .ignoresSafeArea()

            VStack {
                Text("Lorem ipsum is placeholder text commonly used in the graphic, print, and publishing industries for previewing layouts and visual mockups..")
                    .foregroundColor(Color.systemGray)
                    .cornerRadius(15)

                Button("Tap Me") {
                    // some action
                }.buttonStyle(.borderedProminent)
            }
            .padding()
            .background(.thinMaterial)
            .cornerRadius(15)
        }
    }
}

enter image description here

Upvotes: 0

Views: 482

Answers (2)

Asperi
Asperi

Reputation: 258365

The cornerRadius adds clipping, so remove it after text (anyway it is not needed there by logic of your code even if it would behave differently)

VStack {
    Text("Lorem ipsum is placeholder text commonly used in the graphic, print, and publishing industries for previewing layouts and visual mockups..")
        .foregroundColor(Color.systemGray)
        //.cornerRadius(15)                  // << this !!

Upvotes: 2

greetal
greetal

Reputation: 1537

you can use as below for text:

  .fixedSize(horizontal: false, vertical: true)

Upvotes: 2

Related Questions