无法在 SwiftUI 中全屏查看

Question

我正在尝试在 SwiftUI 中构建一个非常简单的应用程序。我想要的第一件事是我的视图是全屏的，边缘到边缘。应用程序在某处添加了一些填充，我无法弄清楚。

这是我的代码：

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)
    }
}

结果如下：

为什么列表中的每个元素都没有跨越整个屏幕？填充从哪里来？

Answer 1

你需要列表行背景

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 !!
    }
}