SwiftUI - EditMode和PresentationMode环境

Question

如何在EditMode和PresentationMode环境中显示表单？

示例：

当用户点击EditButton时，它应该在EditMode中显示表单，输入文本文件，并更改导航标题

import SwiftUI

struct FormView: View {

    var body: some View {

        NavigationView {


        Form {


            Text("Placeholder")

            // On EditMode it should show this
            // TextField("Placeholder", text: Value)

           }

        .navigationBarTitle("Presentation Mode")
        // On EditMode it should show this
        // .navigationBarTitle("Edit Mode")

        .navigationBarItems(trailing: EditButton())






 }


    }
}

struct FormView_Previews: PreviewProvider {
    static var previews: some View {

        FormView()
    }
}

​

​

Answer 1

在这种情况下，当使用editMode环境变量时，由于某种原因，EditButton()不能独立工作。然而，当使用自定义按钮时，editMode被正确地切换。

有趣的是，如果将EditButton()与自定义按钮一起添加(出于测试目的)，则在使用自定义按钮至少切换一次该值之后，EditButton()也会活跃起来并提供预期的行为。

下面的代码片段很适合我：

import SwiftUI

struct TempView2: View {
    @Environment(\.editMode) var editMode

    @State var textValue : String = "abc"

    var body: some View {
        NavigationView {
            Form {
                TextField("Placeholder", text: $textValue)
                    .disabled(.inactive == self.editMode?.wrappedValue)
                    .textFieldStyle(RoundedBorderTextFieldStyle())
                    .foregroundColor((.active == self.editMode?.wrappedValue) ? Color.red : Color.green)
                    .navigationBarTitle(.inactive == self.editMode?.wrappedValue ? "Presentation Mode" : "Edit Mode")
                    .navigationBarItems(trailing:
                        HStack {
                            //Spacer()
                            //EditButton()
                            Spacer()
                            Button(action: {
                                self.editMode?.wrappedValue = .active == self.editMode?.wrappedValue ? .inactive : .active
                            }) {
                                Text(.active == self.editMode?.wrappedValue ? "Done" : "Edit")
                            }
                            Spacer()
                    })
            }
        }
    }
}

Answer 2

这是实现可编辑表单的一种方式：

struct FormView: View {

    @State private var isEditing = false
    @State private var text = ""

    var body: some View {
        NavigationView {
            Form {
                TextField("Placeholder",
                          text: $text)
                    .disabled(!isEditing)
            }
            .navigationBarTitle(isEditing ? "Edit Mode" : "Presentation Mode")
            .navigationBarItems(trailing: Button(isEditing ? "Save" : "Edit") {
                self.isEditing.toggle()
            })
        }
    }
}