SwiftUI -- 取消List的分割线

iOS 13 List 的底层是 UITableView,可以直接设置 UITableView 的 separatorStyle 为 none 来去除分割线
在 iOS 14中 List 的实现不在是 UITableView 了,可以设置 .listStyle(SidebarListStyle()),但会有很大的边距。也可以用 Scrollview + LazyVStack 替代 List,

The stack is "lazy," in that the stack view doesn't create items until it needs to render them onscreen.

类似的还有 LazyHStack、LazyVGrid、LazyHGrid

struct PokemonList: View {
    
    var body: some View {
        if #available(iOS 14.0, *) {
            ScrollView {
                LazyVStack(content: {
                    ForEach(PokemonViewModel.all) { pokemon in
                        PokemonInfoRow(model: pokemon, expanded: true)
                    }
                })
            }
//            List(PokemonViewModel.all){ pokemon in
//                PokemonInfoRow(model: pokemon, expanded: true)
//            }.listStyle(SidebarListStyle())
        } else {
            List(PokemonViewModel.all){ pokemon in
                PokemonInfoRow(model: pokemon, expanded: true)
            }.modifier(ListRemoveSeparator())
        }
    }
}

struct ListRemoveSeparator: ViewModifier {
    func body(content: Content) -> some View {
        content
            .onAppear(perform: {
                UITableView.appearance().tableFooterView = UIView()
                UITableView.appearance().separatorStyle = .none
            })
            .onDisappear(perform: {
                UITableView.appearance().tableFooterView = nil
                UITableView.appearance().separatorStyle = .singleLine
            })
    }
}

参照: stackoverflow

你可能感兴趣的:(SwiftUI -- 取消List的分割线)