SwiftUI-清单:在iOS 13+中隐藏分隔线

时间:2020-11-07 18:12:02

标签: ios swiftui ios13

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

要进行聊天,我将元素List与ForEach一起使用。 问题是列表显示分隔线,我需要隐藏它们:

enter image description here

我试图隐藏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())
            }
        }
    }
}

我将不胜感激:)

2 个答案:

答案 0 :(得分: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分隔符:

答案 1 :(得分:0)

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

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