How to remove the leading and trailing space space in the cell SwiftUI - swift

Question

I am a beginner in SwiftUI and i am stuck on this.
I want to remove the leading and trailing white space in cell as in the picture [Sample output Picture][1]
That is the orange color should touch the left and right margin of the iPhone screen
[1]: https://i.stack.imgur.com/XhiFR.png
Here is my code -
{
var body : some View {
List(0 ..< 15) { item in
VStack() {
HStack{
VStack(alignment: .leading){
Text("sample text is t iu ")
.fontWeight(.medium)
Text("Sample text 2 jksbdkj")
}
Spacer()
Image("pro1")
.resizable()
.scaledToFit()
.frame( height: 50)
}
// bottom view of card
HStack(){
Image("pro2")
.resizable()
.scaledToFit()
.frame(width: 20, height: 20)
Text("0")
Text("+3")
Spacer()
Image(systemName: "pencil")
Image("pro3")
.resizable()
.scaledToFit()
.frame(width: 20, height: 20)
}
}
.background(Color.orange)
.listRowSeparator(.hidden)
}
.listStyle(.plain)
.background(Color.green)
}
}
I appreciate any help . Thanks!

Answer 1

i am a beginner in SwiftUI and learning my self.
How to change the color between the two cell in a list in SwiftUI Sample picture
I want the white colors to be grey.
Here is my code -
struct cardView: View{
var body : some View {
List(0 ..< 15) { item in
VStack() {
HStack{
VStack(alignment: .leading){
Text("sample text is t iu ")
.fontWeight(.medium)
Text("Sample text 2 jksbdkj")
}
Spacer()
Image("pro1")
.resizable()
.scaledToFit()
.frame( height: 50)
}
// bottom view of card
HStack(){
Image("pro2")
.resizable()
.scaledToFit()
.frame(width: 20, height: 20)
Text("0")
Text("+3")
Spacer()
Image(systemName: "pencil")
Image("pro3")
.resizable()
.scaledToFit()
.frame(width: 20, height: 20)
}
} .listRowInsets(EdgeInsets())
.background(Color.orange)
.listRowSeparator(.hidden)
Spacer()
}
.listStyle(.plain)
}
}
struct ContentView: View {
var body: some View {
ZStack{
cardView()
}.background(Color.black)
}
}
I would appreciate any help thanks.