SwiftUI 自定义列表单元 - 在 EditMode 中禁用水平填充/收缩

Question

我正在尝试在 SwiftUI 中创建一个自定义列表单元格，其中编辑模式下的拖动图标保留在单元格内。

默认情况下，一旦列表进入编辑模式，单元格就会水平收缩，为拖动手柄和删除按钮腾出空间。

实际上添加 listRowBackground 可以解决这个问题，但是我无法再添加cornerRadius和padding。

现在发生了什么：

期望的行为：

有谁知道如何实现这一点的技巧或解决方案？

示例代码：

struct ListInList: View {

    @State var datas = ["Row 1", "Row 2", "Row 3"]

    var body: some View {
        NavigationView{
            List{
            
                ForEach(datas, id: \.self) { data in
                    HStack{
                        Text(data)
                            .frame(maxWidth: .infinity)
                            .padding()
                    }
                    .listRowSeparator(.hidden)
                    .listRowInsets(EdgeInsets())
                    .listRowBackground(Color.clear)
                    .ignoresSafeArea(edges: .horizontal)
                    .background(Color.gray.opacity(0.3))
                    .cornerRadius(10)
                    .deleteDisabled(true)
                    .padding(EdgeInsets(top: 8, leading: 16, bottom: 8, trailing: 16))
                }
                .onMove(perform: move)
            }
            .listStyle(.plain)
            .toolbar{
                ToolbarItem(placement: .navigationBarTrailing){
                    EditButton()
                }
            }
        }
    }

    func move(from source: IndexSet, to destination: Int) {
        datas.move(fromOffsets: source, toOffset: destination)
    }
}

Answer 1

好吧，我自己想出来了。我完全忘记了，.listRowBackground() 可以接收视图。

所以对于每个面临同样问题的人来说：

    List{
        ForEach(datas, id: \.self) { data in
            HStack{
                Text(data)
                    .padding(.vertical,20)
            }
            .listRowSeparator(.hidden)
            .listRowBackground(
                Color.gray.opacity(0.3)
                    .cornerRadius(10)
                    .padding(.vertical, 8)
                )
        }
        .onMove(perform: move)
    }
    .padding(.horizontal)
    .listStyle(.plain)