在 SwiftUI 中无法查看全屏

Question

I'm trying to build a very simple app in SwiftUI. The first thing I want is my view to be full screen, edge to edge. Somewhere the app is adding some padding and I can't figure it out.

Here's my code:

struct ContentView: View {

@ObservedObject var fetcher = ArticleService()

var body: some View {
    List {
        ForEach(fetcher.articles) { article in
            VStack (alignment: .leading) {
                Text(article.section)
                    .foregroundColor(.red)
                    .textCase(.uppercase)
                Text(article.title)
                    .font(.system(size: 20))
                    .fontWeight(.semibold)
                UrlImageView(article.image)
                    .padding(EdgeInsets(top: 10, leading: 0, bottom: 10, trailing: 0))
                    .frame(maxWidth: .infinity)
                Text(article.author)
                    .font(.system(size: 11))
                    .foregroundColor(Color.gray)
            }
            .frame(maxWidth: .infinity)
            .background(Color.white)
        }
        .listRowBackground(Color.gray)
        .frame(maxWidth: .infinity)
    }
}

And this is the result:

Why is each element in the list not spanning the entire screen? Where is the padding coming from?

Answer 1

You need list row background instead

var body: some View {
    List {
        ForEach(fetcher.articles) { article in       // << needs ForEach !!
            VStack (alignment: .leading) {
                Text(article.section)
                    .foregroundColor(.red)
                    .textCase(.uppercase)
                Text(article.title)
                    .font(.system(size: 20))
                    .fontWeight(.semibold)
                UrlImageView(article.image)
                    .padding(EdgeInsets(top: 10, leading: 0, bottom: 10, trailing: 0))
                Text(article.author)
                    .font(.system(size: 11))
                    .foregroundColor(Color.gray)
            }
            .frame(maxWidth: .infinity)
        }.listRowBackground(Color.red)        // << here !!
    }
}