如何在没有列表的情况下使用滑动操作并使用索引 swiftui

Question

我正在制作一个待办事项应用程序，并希望通过滑动来删除每个任务。

ScrollView { 
    ForEach(tasks.indices, id: \.self) { index in
       TextField("Activity here", text: $tasks[index]) 
           .cornerRadius(20)
           .foregroundColor(textColor)
           .background(backgroundColor)
           .padding(.leading, 10)
           .padding(.trailing, 10)
           .padding(.top, 5)
       }
    }.frame(height: 600, alignment: .topLeading)

我尝试过 .onDelete 和 .swipeactions，但不知道如何在没有列表的情况下做到这一点。

Answer 1

我认为你必须使用 SwiftUI 的 List 并且你可以使用 onDelete 来删除你的任务 你的代码将是这样的：

  var body: some View {
    ScrollView {
        List{
            
            ForEach(tasks.indices, id: \.self) { index in
                
                TextField("Activity here", text: $tasks[index])
                
                    .cornerRadius(20)
                    .foregroundColor(Color.white)
                    .background(Color.black)
                    .padding(.leading, 10)
                    .padding(.trailing, 10)
                    .padding(.top, 5)
            }
            .onDelete{_ in self.tasks.remove(at: 0)}
        }.frame(height: 600, alignment: .topLeading)
    }
}

但是，如果您决定创建此应用程序，但不是在 SwiftUI 中，我可以为您推荐“SwipeCellKit”cocoapod。 https://github.com/SwipeCellKit/SwipeCellKit/blob/develop/Guides/Advanced.md 使用表格视图，您可以创建这个很酷的应用程序。祝你好运。

Answer 2

.swipeactions()

仅适用于

List

，并且直接嵌入

List

中的

ScrollView

不起作用，因为

List

已经可滚动。

当我遇到与您相同的问题时，我需要使用

.swipeactions()

但需要

ScrollView

，因为我还有其他内容要放在

List

之上，我遇到了这个非常有用的 解决方案。

它基本上归结为在

VStack

和

ScrollView

之间添加一个

List

层，并为

List

设置一个足够大的框架，以便只有一个滚动操作：

ScrollView {
    VStack(spacing: 0) {
        
        VStack {
            // Elements you need to show above your List
        }
        
        List {
            // List content here
            ForEach(tasks.indices, id: \.self) { index in
                TextField("Activity here", text: $tasks[index])
                    .cornerRadius(20)
                    .foregroundColor(textColor)
                    .background(backgroundColor)
                    .padding(.leading, 10)
                    .padding(.trailing, 10)
                    .padding(.top, 5)
                    .swipeActions(edge: .leading) {
                        Button(role: .destructive) {
                            // Delete item
                        } label: {
                            Label("Delete", systemImage: "trash")
                        }
                    }
            }
        }
        .frame(height: CGFloat((tasks.count * 75) + (tasks.count < 4 ? 200 : 0)), alignment: .top)
    }
}

如果需要，您可以调整框架的大小以更有效地适应您的内容。

如果您不需要

List

以上的内容，那么您也可以这样做：

List {
    ForEach(tasks.indices, id: \.self) { index in
        TextField("Activity here", text: $tasks[index])
            .cornerRadius(20)
            .foregroundColor(textColor)
            .background(backgroundColor)
            .padding(.leading, 10)
            .padding(.trailing, 10)
            .padding(.top, 5)
            .swipeActions(edge: .leading) {
                Button(role: .destructive) {
                    // Delete item
                } label: {
                    Label("Delete", systemImage: "trash")
                }
            }
    }
}

希望这有帮助