pop.swift

import SwiftUI

struct CodeTesting: View {
    @State private var presentView:Bool = false
    @State private var date: Date = .init()
    var body: some View {

        VStack(alignment: .center) {
            Button {
                withAnimation(.easeOut) {
                    presentView.toggle()
                }
            } label: {

                HStack {
                    Text(date.formatted(date: .complete, time: .omitted))
                    Spacer()
                    Text("Pick a date")
                        .foregroundColor(.white)
                        .padding()
                        .background(Color.cyan.gradient)
                        .cornerRadius(10)
                }.padding()
            }

        }
        .verticalAlignment(.center)
        .popUpNavigation(present: $presentView) {
            NavigationStack {
                ScrollView {
                    VStack {
                        DatePicker("",selection: $date)
                            .datePickerStyle(.graphical)
                    }
                    .padding()
                    .toolbar {
                        ToolbarItem(placement: .navigationBarLeading) {
                            Button{
                                withAnimation(.easeOut) {
                                    presentView = false
                                }
                            } label: {
                                Image(systemName: "xmark")
                            }
                        }
                    }
                }
            }
        }
    }
}

extension View {
    // MARK: Vertical Allignment
    func verticalAlignment(_ alignment:Alignment)-> some View {
        self.frame(maxHeight: .infinity,alignment: alignment)
    }

    // MARK: Custom Modifier Popup View
    func popUpNavigation<Content: View>(transition:AnyTransition = .opacity.animation(.easeInOut),_ horizontalPadding: CGFloat = 40,present: Binding<Bool>,@ViewBuilder content: @escaping ()->Content)->some View{

        return self
            .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .center)
            .overlay {
                if present.wrappedValue {
                    // MARK: Geometry Reader for reading Container Frame
                    GeometryReader{proxy in

                        Color.primary
                            .opacity(0.15)
                            .ignoresSafeArea()

                        let size = proxy.size

                        NavigationStack{
                            content()
                        }
                        .frame(width: size.width - horizontalPadding, height: size.height / 1.7, alignment: .center)
                        .cornerRadius(15)
                        .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .center)
                    } .transition(transition)
                }
            }

    }

}


struct CodeTesting_Previews: PreviewProvider {
    static var previews: some View {
        CodeTesting()
    }
}