如何制作一个全宽的 SwiftUI 列表？

Posted 2023-02-23

【中文标题】如何制作一个全宽的 SwiftUI 列表？

【英文标题】：How can I made a SwiftUI List full width?

【发布时间】：2021-10-12 19:10:50

【问题描述】：

我希望我的List 是全宽的。填充是自动添加的，出于我的目的，我不希望这样。这只是示例代码。

这是我的代码：

struct ViewModel: Identifiable 
    let title: String
    let id = UUID()


struct ContentView: View 
    
    let models = [
        ViewModel(title: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.")
        ]
    
    var body: some View 
        List(models, id: \.id)  model in
            Text(model.title)
                .frame( maxWidth: .infinity)
        .frame( maxWidth: .infinity).edgesIgnoringSafeArea(.all)
    


struct ContentView_Previews: PreviewProvider 
    static var previews: some View 
        ContentView()
    

【问题讨论】：

添加.listStyle(PlainListStyle()) 或.listStyle(GroupedListStyle()) 有效吗？也就是说，我不记得 InsetGroupedListStyle 是默认列表样式...

样式 .plain 和 .inset 似乎都可以正常工作。

@Sweeper 谢谢你。在 UIKit 方面有经验，但现在正在学习 SwiftUI。那解决了它。我快疯了，哈哈。请提交作为答案，我会接受！

【参考方案1】：

您看到的列表样式称为InsetGroupedListStyle。请注意“插图”一词。您可以添加 .listStyle 修饰符将其更改为没有插入的样式：

List(models, id: \.id)  model in
    Text(model.title)
        .frame( maxWidth: .infinity)

.frame( maxWidth: .infinity)
.edgesIgnoringSafeArea(.all)
.listStyle(GroupedListStyle()) // or PlainListStyle()