3

我有一个简单List的部分，这些部分存储在ObservableObject. 我想从另一个角度重新排列它们。

这是我的代码：

class ViewModel: ObservableObject {
    @Published var sections = ["S1", "S2", "S3", "S4"]
    
    func move(from source: IndexSet, to destination: Int) {
        sections.move(fromOffsets: source, toOffset: destination)
    }
}

struct ContentView: View {
    @ObservedObject var viewModel = ViewModel()
    @State var showOrderingView = false

    var body: some View {
        VStack {
            Button("Reorder sections") {
                self.showOrderingView = true
            }
            list
        }
        .sheet(isPresented: $showOrderingView) {
            OrderingView(viewModel: self.viewModel)
        }
    }

    var list: some View {
        List {
            ForEach(viewModel.sections, id: \.self) { section in
                Section(header: Text(section)) {
                    ForEach(0 ..< 3, id: \.self) { _ in
                        Text("Item")
                    }
                }
            }
        }
    }
}

struct OrderingView: View {
    @ObservedObject var viewModel: ViewModel

    var body: some View {
        NavigationView {
            List {
                ForEach(viewModel.sections, id: \.self) { section in
                    Text(section)
                }
                .onMove(perform: viewModel.move)
            }
            .navigationBarItems(trailing: EditButton())
        }
    }
}

但是在OrderingView尝试移动部分时，我收到此错误：“尝试为单元格创建两个动画”。可能是因为部分的顺序发生了变化。

如何更改部分的顺序？

4

2 回答 2

2

这种情况的问题被多次重现ViewModel，因此在工作表中所做的修改就丢失了。（奇怪的是，在带有 StateObject 的 SwiftUI 2.0 中，这些更改也丢失了，并且 EditButton 根本不起作用。）

反正。看起来这是一个找到的解决方法。这个想法是打破采访依赖（绑定）并使用纯数据将它们显式传递到工作表中并从中显式返回它们。

使用 Xcode 12 / iOS 14 测试和工作，但我尽量避免使用 SwiftUI 2.0 功能。

class ViewModel: ObservableObject {
    @Published var sections = ["S1", "S2", "S3", "S4"]

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

struct ContentView: View {
    @ObservedObject var viewModel = ViewModel()
    @State var showOrderingView = false

    var body: some View {
        VStack {
            Button("Reorder sections") {
                self.showOrderingView = true
            }

            list
        }
        .sheet(isPresented: $showOrderingView) {
            OrderingView(sections: viewModel.sections) {
                self.viewModel.sections = $0
            }
        }
    }

    var list: some View {
        List {
            ForEach(viewModel.sections, id: \.self) { section in
                Section(header: Text(section)) {
                    ForEach(0 ..< 3, id: \.self) { _ in
                        Text("Item")
                    }
                }
            }
        }
    }
}

struct OrderingView: View {
    @State private var sections: [String]
    let callback: ([String]) -> ()

    init(sections: [String], callback: @escaping ([String]) -> ())
    {
        self._sections = State(initialValue: sections)
        self.callback = callback
    }

    var body: some View {
        NavigationView {
            List {
                ForEach(sections, id: \.self) { section in
                    Text(section)
                }
                .onMove {
                    self.sections.move(fromOffsets: $0, toOffset: $1)
                }
            }
            .navigationBarItems(trailing: EditButton())
        }
        .onDisappear {
            self.callback(self.sections)
        }
    }
}
于 2020-07-20T15:37:46.110 回答
0

SwiftUI 1.0 的一种可能的解决方案

我找到了一种解决方法来禁用动画，方法List是添加.id(UUID())：

var list: some View {
    List {
        ...
    }
    .id(UUID())
}

然而，这会弄乱使用以下方法创建的 NavigationLinks 的过渡动画NavigationLink(destination:tag:selection:)：在 SwiftUI 中呈现 NavigationLink 时，过渡动画消失了。

并且所有其他动画（如onDelete）也丢失了。

更 hacky 的解决方案是有条件地禁用列表动画：

class ViewModel: ObservableObject {
    ...
    @Published var isReorderingSections = false
    ...
}

struct OrderingView: View {
    @ObservedObject var viewModel: ViewModel

    var body: some View {
        NavigationView {
            ...
        }
        .onAppear {
            self.viewModel.isReorderingSections = true
        }
        .onDisappear {
            self.viewModel.isReorderingSections = false
        }
    }
}

struct ContentView: View {
    ...
    var list: some View {
        List {
            ...
        }
        .id(viewModel.isReorderingSections ? UUID().hashValue : 1)
    }
}
于 2020-07-20T15:37:28.257 回答