SwiftUI List

前言

xcode 13.2.1
iOS 15.0

1、初始化list

List(0 ..< 5) {
    
     _ in
    Text("666")
}

或者使用 forEach

List {
    
    
    ForEach(0 ..< 5) {
    
     _ in
        Text("666")
    }
} 

2 list方法使用

2.1 去掉分割线

cell 中设置listRowSeparator 方法为hidden

List {
    
    
    ForEach(0 ..< 5) {
    
     _ in
        Text("666")
        	.listRowSeparator(.hidden)
    }
} 

2.2 禁止滚动

list 设置 .disabled(true)， 此处只发现这个是否禁止交互的方法，使用的话就不能进行交互，变相禁止滚动
不建议使用，如果禁止滚动，可以使用 ForEach 方法来实现功能
此处暂未找到更好方法，后续找到方法会补充上来

List {
    
    
    ForEach(0 ..< 5) {
    
     _ in
        Text("666")
    }
} 
.disabled(true)

2.3 设置row 的背景色

row 设置.listRowBackground(Color.orange)就可以了

List {
    
    
    ForEach(0 ..< 5) {
    
     _ in
        Text("666")
            .listRowBackground(Color.orange)
    }
}  

3. list row 的设置

3.1 row 的背景色的设置

通过list 没有方法设置背景色，background完全没用
这个需要在你的body 同等级添加个init 设置一下UITableView 的背景色，然后就可以再 background 设置背景色、背景图片这些东西了

init() {
    
    
    UITableView.appearance().backgroundColor = .clear
}

var body: some View {
    
    
    List {
    
    
        ForEach(0 ..< 5) {
    
     _ in
            Text("666")
                .listRowSeparator(.hidden)
        }
    }
    .background(
        Color.blue
    )
}

3.2 row 滑动删除

/// - Parameters:
/// - edge: The edge of the view to associate the swipe actions with.
/// The default is HorizontalEdge/trailing.
/// - allowsFullSwipe: A Boolean value that indicates whether a full swipe
/// automatically performs the first action. The default is true.
/// - content: The content of the swipe actions.
public func swipeActions(edge: HorizontalEdge = .trailing, allowsFullSwipe: Bool = true, @ViewBuilder content: () -> T) -> some View where T : View
///- 参数：
///- edge：与滑动操作关联的视图边缘。默认设置为 “水平边缘 / 尾随”。
///-allowsFullSwipe：一个布尔值，指示完全滑动是否自动执行第一个操作。默认值为 “true”。
///- content：滑动操作的内容。

swipeActions 滑动删除, content 里面只能放置 Button

List {
    
    
    ForEach(models.indices, id: \.self) {
    
     index in
        YLMySettingRow(model: models[index])
            .swipeActions(edge: .leading, allowsFullSwipe: true) {
    
    
                Button {
    
    

                } label: {
    
    
                    Label("删除", systemImage: "trash")
                }
                .tint(.red)
            }
    }
    .listRowBackground(Color.white)
}
.listStyle(.plain)