Swiftui 如何在快捷界面模式中放置表单?

Swiftui 如何在快捷界面模式中放置表单?,swiftui,swiftui-form,Swiftui,Swiftui Form,我试图在SwiftUI中创建一个包含表单的模式。我宁愿不使用行动表,而使用类似于下图的模式。似乎SwiftUI模式和警报还不能使用这样的模式,有可能的解决方案吗 两种方法 下面是创建自定义模态的两个示例。 1.使用.overlay() 2.用ZStack 也许第二种方法更好。有了这个,我也得到了动画的一种工作 import SwiftUI struct ContentView: View { @State var flag = false var body: some Vi

我试图在SwiftUI中创建一个包含表单的模式。我宁愿不使用行动表,而使用类似于下图的模式。似乎SwiftUI模式和警报还不能使用这样的模式,有可能的解决方案吗

两种方法 下面是创建自定义模态的两个示例。

1.使用
.overlay()

2.用ZStack 也许第二种方法更好。有了这个,我也得到了动画的一种工作

import SwiftUI

struct ContentView: View {
    @State var flag = false
    var body: some View {
        ZStack {
            VStack {
                Text("Title").font(.largeTitle)
                Toggle(isOn: $flag) {
                    Text("Show Moda' on")
                }.padding(100)
                Spacer()
            }.disabled(flag)

            if flag {
                Color.gray.opacity(0.4).edgesIgnoringSafeArea(.all)
                VStack {
                    Text("label")
                    Button(action: {
                        self.flag.toggle()
                    }) {
                        Text("Close")
                    }
                }
                .frame(width: 300, height: 200, alignment: .center)
                .background(Color.primary.colorInvert()).cornerRadius(50)

            }
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

您不能使用ZStack并在当前视图的顶部显示表单吗?可以使用半透明的深色背景和ZStack吗?
struct ContentView: View {
    @State var showModal: Bool = false

    var body: some View {
        NavigationView {
            ZStack {
                Button(action: {
                    withAnimation {
                        self.showModal.toggle()
                    }
                }) {
                    HStack {
                        Image(systemName: "plus.circle.fill")
                            .imageScale(.large)
                        Text("Show Modal")
                    }
                }

                if showModal {
                    Rectangle() // the semi-transparent overlay
                        .foregroundColor(Color.black.opacity(0.5))
                        .edgesIgnoringSafeArea(.all)

                    GeometryReader { geometry in // the modal container
                        RoundedRectangle(cornerRadius: 16)
                            .foregroundColor(.white)
                            .frame(width: min(geometry.size.width - 100, 300), height: min(geometry.size.height - 100, 200))
                            .overlay(ModalContentView(showModal: self.$showModal))
                    }
                    .transition(.move(edge: .bottom))

                }
            }
            .navigationBarTitle("Welcome")

        }
        .navigationViewStyle(StackNavigationViewStyle())
    }
}

struct ModalContentView: View {
    @Binding var showModal: Bool

    var body: some View {
        VStack {
            Text("Modal Content")

            Button(action: {
                withAnimation {
                    self.showModal.toggle()
                }
            }) {
                HStack {
                    Image(systemName: "xmark.circle.fill")
                        .imageScale(.large)
                    Text("Close Modal")
                }
            }
        }
    }
}
import SwiftUI

struct ContentView: View {
    @State var flag = false
    var body: some View {
        ZStack {
            VStack {
                Text("Title").font(.largeTitle)
                Toggle(isOn: $flag) {
                    Text("Show Moda' on")
                }.padding(100)
                Spacer()
            }.disabled(flag)

            if flag {
                Color.gray.opacity(0.4).edgesIgnoringSafeArea(.all)
                VStack {
                    Text("label")
                    Button(action: {
                        self.flag.toggle()
                    }) {
                        Text("Close")
                    }
                }
                .frame(width: 300, height: 200, alignment: .center)
                .background(Color.primary.colorInvert()).cornerRadius(50)

            }
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}