3

我有一个视图 ( Form)，基本上，它有一个选择器和一个可由用户重新排列的项目列表。我希望该列表始终是可编辑的，因此用户不必点击“编辑”按钮（对我来说，拥有只影响表单的一小部分的“编辑”按钮似乎是不自然的）。

在此处输入图像描述

editMode我通过设置环境变量:成功完成了上述始终在线编辑.environment(\.editMode, .constant(.active))。

问题是虽然表单是可编辑的，但选择器停止工作（即，当您点击它时它不会切换到选项列表）。

这是重现我的问题的 MCVE：

import SwiftUI

struct SampleView: View {
  enum SortBy: String, CaseIterable {
    case FirstName
    case LastName

    var name: String {
      switch (self) {
      case .FirstName:
        return "First name"
      case .LastName:
        return "Last name"
      }
    }
  }
  @State var sortBy = SortBy.FirstName

  var body: some View {
    Form {
      Section(header: Text("General")) {
        Picker("Sort by", selection: $sortBy) {
          ForEach(SortBy.allCases, id: \.self) { sortBy in
            Text(sortBy.name).tag(sortBy)
          }
        }
      }

      Section(header: Text("Phone order")) {
        ForEach(1..<10) { number in
          Text("\(number)")
        }
        .onMove(perform: onMove)
        .padding(.leading, -39) // remove space dedicated to delete button
      }
    }
    .environment(\.editMode, .constant(.active)) // <--
    .navigationBarTitle(Text("Sample View"))
  }

  private func onMove(source: IndexSet, destination: Int) {
    // ...
  }
}

struct SampleView_Previews: PreviewProvider {
  static var previews: some View {
    NavigationView {
      SampleView()
    }
  }
}

显然我可以吃掉我的话并带回编辑按钮，但我想知道是否有任何方法可以保持列表可编辑并使选择器正常工作。

我已经看过this other question，但它并没有解决问题。

我知道这个问题与编辑导航链接时被禁用的事实有关。

由于editMode是表单的一个属性，我尝试的一个选项是VStack使用两个单独的表单创建一个，因此只有一个带有列表的表单是可编辑的。问题是我无法获得正确的布局，更不用说我以两个可滚动区域结束了。

另一个想法是使用 手动导航到选择器的列表onTapGesture，但我还没有找到如何使用 SwiftUI 来做到这一点。

到目前为止，我唯一的解决方案是将选择器的样式更改为SegmentedPickerStyle，但是当排序选项（枚举）增长时它不会很有用。

4

1 回答 1

2

看起来这样的组合现在是不可能的......在下面找到替代解决方案的建议变体 - 想法是使用节内按钮来激活重新排序

演示2

    @State private var reorderMode: EditMode = .inactive
    var body: some View {
        Form {
            Section(header: Text("General")) {
                Picker("Sort by", selection: $sortBy) {
                    ForEach(SortBy.allCases, id: \.self) { sortBy in
                        Text(sortBy.name).tag(sortBy)
                    }
                }
            }

            Section(header:
                HStack {
                    Text("Phone order")
                    Spacer()
                    Button(self.reorderMode == .inactive ? "Reorder" : "Done") {
                        self.reorderMode = self.reorderMode == .active ? .inactive : .active
                    }
                }
            ) {
                ForEach(1..<10) { number in
                    Text("\(number)")
                }
                .onMove(perform: onMove)
                    .padding(.leading, self.reorderMode == .active ? -39 : 0) // remove space dedicated to delete button
            }
        }
        .environment(\.editMode, $reorderMode)
        .navigationBarTitle(Text("Sample View"))
    }
于 2020-08-21T07:34:27.960 回答