CODEWITHSUNDEEP
swiftuiswiftui-foreach
MattBlack
MattBlack

Reputation: 3828

SwiftUI How to use LazyGrid so that Text elements are not truncated?

Using the code below the text is truncated as shown in the image.

I would like all the text to be displayed without the truncation, taking into account the variable text lengths.

struct ContentView: View {
    
    let data = ["O Menino","The Boy", "The Girl", "A Menina","Mae","Mother"]
    
    let layout = [
        GridItem(.adaptive(minimum:50))
        
    ]
    
    var body: some View {
       
        ScrollView{
            LazyVGrid(columns: layout, spacing: 20){
                ForEach(data, id: \.self){ item in
                    VStack{
                        Text(item).lineLimit(1)
                    }.background(Color.red)
                }
            }
        }
    }
}

enter image description here

Upvotes: 16

Views: 14301

Answers (1)

Asperi
Asperi

Reputation: 258501

It is VGrid, it grows vertically filling columns. In your case it is only one column.

If you want to fit all those content in screen, you'd need to increase number of grid columns, like

let data = ["O Menino","The Boy", "The Girl", "A Menina","Mae","Mother"]
let layout = Array(repeating: GridItem(.adaptive(minimum:50)), count: 4)

demo

Upvotes: 6

Related Questions