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

Question

我使用 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())
            }
        }
    }
}

我将不胜感激任何帮助:)

Answer 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分隔符：

• iOS 13 -如何在不使用 ForEach 的情况下从 SwiftUI 的列表中删除行分隔符？
• iOS 14 -如何在 iOS 14 中删除 SwiftUI 2.0 中的列表分隔符行

Answer 2

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

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