SwiftUI - 列表：在 iOS 13+ 中隐藏分隔线答案

【问题标题】：SwiftUI - List: Hide divider in iOS 13+SwiftUI - 列表：在 iOS 13+ 中隐藏分隔线
【发布时间】：2021-02-20 03:31:51
【问题描述】：

我使用 SwiftUI 开发了一个聊天屏幕。当前最低 iOS 版本为 13.0。

为了进行聊天，我将元素 List 与 ForEach 结合使用。问题是列表显示了分隔符，我需要隐藏它们：

我试图隐藏 TableView 的样式，但没有任何效果。代码如下：

struct MessagesView: View {

    var messages: [MessageModel] = []

    init() {
        // To remove only extra separators below the list:
        UITableView.appearance().tableFooterView = UIView()
        // To remove all separators including the actual ones:
        UITableView.appearance().separatorStyle = .none
    }
    
    var body: some View {
        List {
            ForEach(messages, id: \.messageId) { message in
                Group {
                    if(messPack.user != nil) {
                        ReceivedMessageView(
                            message: message.message,
                            name: message.user?.name,
                            color: message.user?.color)
                    } else {
                        SentMessageView(message: messPack.message)
                    }
                }.listRowInsets(EdgeInsets())
            }
        }
    }
}

如果有任何帮助，我将不胜感激：)

【问题讨论】：

最低 iOS 版本是 13.0 - 但你在哪个版本上运行它？
有什么理由需要它在列表中吗？如果没有分隔线，ScrollView 不会完成同样的事情吗？ List 应该有分隔线，其中 ScrollView 是普通的。
这是否回答了您的问题stackoverflow.com/a/62598818/12299030？
考虑使用github.com/siteline/SwiftUI-Introspect
感谢您的所有回答。我是 SwiftUi 的新手。我认为当列表很长（延迟加载等）时，List 可以很好地管理内存。 ScrollView 做同样的事情吗？

标签： ios swiftui ios13

【解决方案1】：

将最低 iOS 版本设置为 iOS 13 并不意味着您的代码无法在 iOS 14 上运行（并且用于移除列表分隔符的 iOS 13 解决方案在 iOS 14 上不起作用）。

您需要使用if #available(iOS 14, *)指定哪个代码用于哪个iOS版本：

struct MessagesView: View {
    var messages: [MessageModel] = []

    init() {
        UITableView.appearance().tableFooterView = UIView()
        UITableView.appearance().separatorStyle = .none
    }

    var body: some View {
        List {
            ForEach(messages, id: \.messageId) { message in
                Group {
                    if #available(iOS 14, *) {
                        messageView(for: message)
                            .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .leading)
                            .listRowInsets(EdgeInsets())
                            .background(Color.white)
                    } else {
                        messageView(for: message)
                    }
                }
            }
        }
    }

    @ViewBuilder
    func messageView(for message: MessageModel) -> some View {
        if messPack.user != nil {
            ReceivedMessageView(
                message: message.message,
                name: message.user?.name,
                color: message.user?.color
            )
        } else {
            SentMessageView(message: messPack.message)
        }
    }
}

删除List 分隔符：

【讨论】：

【解决方案2】：

您可以使用一些 ListView 样式。我认为 SidebarListStyle 没有任何线条。否则，您可能不得不使用 ScrollView 和/或 VStack 而不是 List。

    List {
        Text("ONE")
        Text("TWO")
        Text("THREE")
    }
    .listStyle(SidebarListStyle())

【讨论】：

您好，谢谢您的回答。遗憾的是，此选项仅适用于 iOS 14+。