Initialize Alert Outside Body View - SwiftUI

Question

Been trying to figure this out for a few days now and it's time I ask for help. I know how to do this with normal Swift but SwiftUI is still a bit different to me at the moment. I have a function that checks if something is true. It goes through 3 if statements, if one is true then it returns a bool I created as true. Once one of the 3 is true, I want a certain Alert to pop up. I have pasted all 3 Alert in the body: some View with the correct variable but it doesn't show any. If I comment out 2 and leave 1 Alert uncommented then it works. So I know my if statements are right. It's just how I'm representing it to the body is where I'm stuck at. See below and if you got an alternative.

    func showTip() {
            if (stepFive <= Float(18)) {
                under = true
            }

           else if (stepFive >= Float(18) && stepFive <= Float(18.5)) {
                thin = true
            }


           else if (stepFive >= 18.6) && (stepFive <= 24.9) {
                healthy = true
            }
    }

var body: some View {
        ZStack {
            Color.blue
            .edgesIgnoringSafeArea(.all)

            .alert(isPresented: $under) {
                Alert(title: Text("Results"), message: Text("A of less than 18 means you are under weight. "), dismissButton: .default(Text("OK")))
            }

            .alert(isPresented: $thin) {
                Alert(title: Text("Results"), message: Text("A of less than 18.5 indicates you are thin"), dismissButton: .default(Text("OK")))
            }

            .alert(isPresented: $healthy) {
                Alert(title: Text("Results"), message: Text("A between 18.6 and 24.9 indicates you are at a healthy"), dismissButton: .default(Text("OK")))
            }
}

Александр Грабовский Александр Грабовский · Accepted Answer · 2020-03-05T04:15:08

UPDATE for showing solution with showTip function:

struct ComplexAlertWith3Variables: View {

    @State var under = false
    @State var thin = false
    @State var healthy = false
    @State var stepFive: Float = 18.3 // I don't know how it changes. From somewhere. and it doesn't matter now

    private var messageText: String {
        return thin ? "A of less than 18.5 indicates you are thin" : "" // compute other variants
    }

    var body: some View {

        let needToShowAlert: Binding<Bool> = Binding<Bool>(
        get: { self.under || self.thin || self.healthy },
        set: { if $0 == false { self.under = $0; self.thin = $0; self.healthy = $0 } })

        return Text("Fire show tip function, because I don't know from where it fires in your code")
            .onTapGesture { self.showTip() } // fire your function. so you see, it doesn't matter from where you change variables
            .alert(isPresented: needToShowAlert) {
                Alert(title: Text("Results"), message: Text(self.messageText), dismissButton: .default(Text("OK")))
        }

    }

    // your function (makes it shorter to fit more lines of code)
    func showTip() {
        if (stepFive <= Float(18)) { under = true } 
        else if (stepFive >= Float(18) && stepFive <= Float(18.5)) { thin = true }
        else if (stepFive >= 18.6) && (stepFive <= 24.9) { healthy = true }
    }
}

result when you tap on text OR fires function from some other place:

I played with this a little and I think I can propose you one solution. It's about making custom Binding variable and using it in body. Besides in first variant I wrote decision with enum, but you can find solution with 3 variables in code snippet too:

struct ComplexAlert: View {

    @State private var option: SomeOption = .unselected

    var body: some View {
        // DISCLAIMER: I wrote in a such a way to fit more lines of code on the page
        // the main here is an idea, not code style =)
        let needToShowAlert: Binding<Bool> = Binding<Bool>(
            get: { self.option != .unselected },
            set: { if $0 == false { self.option = .unselected } })

        return VStack {
            Button(action: { self.option = .under }) { Text("make under") }
            Button(action: { self.option = .thin }) { Text("make thin") }
            Button(action: { self.option = .healthy }) { Text("make healthy") }
        }
            .alert(isPresented: needToShowAlert) {
                Alert(title: Text("Results"), message: Text(self.option.getAlertMessage()), dismissButton: .default(Text("OK")))
        }
    }
}

// MARK: if you need to use 3 variables:
struct ComplexAlertWith3Variables: View {

    @State var under = false
    @State var thin = false
    @State var healthy = false

    private var messageText: String {
        return under ? "under" : "" // compute other varianst
    }

    var body: some View {

        let needToShowAlert: Binding<Bool> = Binding<Bool>(
        get: { self.under || self.thin || self.healthy },
        set: { if $0 == false { self.under = $0; self.thin = $0; self.healthy = $0 } })

        return Text("Hello")
            .onTapGesture { self.under = true }
            .alert(isPresented: needToShowAlert) {
                Alert(title: Text("Results"), message: Text(self.messageText), dismissButton: .default(Text("OK")))
        }

    }
}

// MARK: enum which was used in the first solution:
enum SomeOption {

    case unselected
    case under
    case thin
    case healthy

    func getAlertMessage() -> String {
        switch self {
        case .unselected:
            return ""
        case .under:
            return "A of less than 18 means you are under weight. "
        case .thin:
            return "A of less than 18.5 indicates you are thin"
        case .healthy:
            return "A between 18.6 and 24.9 indicates you are at a healthy"
        }
    }

}

the result for ComplexAlert will be:

Initialize Alert Outside Body View - SwiftUI

1 Answers