Monday, June 29, 2026
HomeiOS Developmentios - How one can go single Buttons into customized ConfirmationDialog

ios – How one can go single Buttons into customized ConfirmationDialog

[ad_1]

I am engaged on a customized ConfirmationDialog with icons, which works fantastic. The draw back is that within the view modifier I can solely entry all buttons as one content material container, so I can not put a divider between them, and in addition cannot disable the overlay on button motion (I’ve to do that within the calling closure).

Any concepts how I can go the only buttons with their actions down into the modifier?

I used to be taking part in round with a number of TupleView inits however I am unsure the best way to apply them to the modifier and View extension, not to mention the button motion.

enter image description here

struct ContentView: View {
    
    @State non-public var showConfirmationDialog = false
    @State non-public var showModifierDialog = false
    
    var physique: some View {
        VStack {
            Button("Present Dialog") { showConfirmationDialog = true }
            Button("Present ViewMod Dialog") {
                withAnimation {
                    showModifierDialog = true
                }
            }
            .padding()
        }
        .padding()
        
        // customary confirmationDialog
        .confirmationDialog("Take a look at", isPresented: $showConfirmationDialog) {
            Button { } label: {
                Label("Add completion", systemImage: "checkmark.circle")
            }
            Button { } label: {
                Label("Add Notice", systemImage: "notice.textual content.badge.plus")
            }
            Button("Cancel", position: .cancel) {}
        }
        
        // customized confirmationDialog with Icons, Cancel added robotically
        .customConfirmDialog(isPresented: $showModifierDialog) {
            Button {
                // motion
                showModifierDialog = false
            } label: {
                Label("Add completion", systemImage: "checkmark.circle")
            }
            Divider() // sadly that is nonetheless mandatory
            Button {
                // motion
                showModifierDialog = false
            } label: {
                Label("Add Notice", systemImage: "notice.textual content.badge.plus")
            }
        }
    }
}


// *** Customized ConfirmDialog Modifier and View extension

extension View {
    func customConfirmDialog<A: View>(isPresented: Binding<Bool>, @ViewBuilder actions: @escaping () -> A) -> some View {
        return self.modifier(MyCustomModifier(isPresented: isPresented, actions: actions))
    }
}

struct MyCustomModifier<A>: ViewModifier the place A: View {
    
    @Binding var isPresented: Bool
    @ViewBuilder let actions: () -> A
    
    func physique(content material: Content material) -> some View {
        ZStack {
            content material
                .body(maxWidth: .infinity, maxHeight: .infinity)
            
            ZStack(alignment: .backside) {
                if isPresented {
                    Colour.main.opacity(0.2)
                        .ignoresSafeArea()
                        .onTapGesture {
                                isPresented = false
                        }
                        .transition(.opacity)
                }
                
                if isPresented {
                    VStack {
                        GroupBox {
                            actions()
                                .body(maxWidth: .infinity, alignment: .main)
                        }
                        
                        GroupBox {
                            Button("Cancel", position: .cancel) {
                                    isPresented = false
                            }
                            .daring()
                            .body(maxWidth: .infinity, alignment: .heart)
                        }
                    }
                    .font(.title3)
                    .padding(8)
                    .transition(.transfer(edge: .backside))
                }
            }
        }
        .animation(.easeInOut, worth: isPresented)
   }
}

[ad_2]

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Most Popular

Recent Comments