Get elements to fill width screen in LazyHStack-CodePudding

I have a LazyHstack in a horizontal scrollview :

struct HorizontalSpotsList: View {
var spots: [Spot]

    var body: some View {
        ScrollView(.horizontal){
            LazyHStack(alignment: .center, spacing: 0){
                if (!spots.isEmpty){
                    ForEach(spots.prefix(upTo: 3) , id: \.self) { spot in
                        Text("Test").frame(maxWidth: .infinity)
                            .background(RoundedRectangle(cornerRadius: 25)
                            .fill(Color.white)).border(Color.blue)
                    }
                }
            }.frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity).border(Color.red)
        }.frame(width: .infinity, height: 130).border(Color.green)
    }

}

How can i get my lazyHStack elements to fill all the width screen ?

My LazyHstack doesn't seems to fill the width, i tried to apply .frame(width: .infinity) or .frame(maxWidth: .infinity) to different combinaisons of my scrollView / LazyHstack / Text element but it doesn't seems to work.

CodePudding user response：

You could use Geometry Reader. You would have to apply a height however.

`GeometryReader { geo in

ScrollView {

LazyHStack {

content

}.frame(width: geo.size.width, height: #)

} }`

CodePudding user response：

Try adding Spacer() in between the Text elements.