On our journey to understanding the SwiftUI framework, we will be solving some problems in the great and splendid Mangoville, a small town that doesn’t have access to Xcode. I already got tons of requests from Mangopolitans!

We absolutely need help! The talented zookeeper, Furry Wool, is in great peril. Until yesterday, Mr. Wool had the ability to speak to animals. Since yesterday was also his 1,687th birthday, our scholars think it may be because his cells are aging, but no one really knows why. However, we need to do something, otherwise he won’t be able to tell his favorite animal, Stripes the tiger, to not eat his delicious but only snack. 

Unfortunately, generosity is not really in Mr. Furry Wool’s vocabulary. The first and only time that his snack got stolen was a long time ago and it did not end well. In fact, it started the Dark Ages! Anyways, the scientists said that an app with a toggle switch to make his cells younger would help a lot. 

Well, let’s get going before Stripes eats Mr. Furry’s snack and starts WWIII!

Start by making a new app. Click on File > New > Project. Make sure to select “Swift” as your language and “SwiftUI” as your User Interface. Then, press the little plus icon in the top right and you will see this.

Start by deleting everything in the struct’s body, and then drag the toggle switch into the content view’s body. Also, just to keep things clean, add “.padding()” after your toggle switch’s closing brace, and don’t forget to replace the Label parameter with something like Text(“Howdie, Mr. Fury Wool!”). This is what your struct should look like now, but don’t worry if you get an error:

struct ContentView: View { 
    var body: some View {           
        Toggle(isOn: ) {                 
            Text("Howdie, Mr. Fury Wool!")   
        } .padding()     
    }
} 

Now, paste in that @State variable at the top (before the body but still in the struct): 

@State var isAnimalModeActivated = false

This boolean will take care of telling the toggle switch when Fury wants to start speaking “Animal” or not. Next, we need to put our variable to use. Right after “isOn:” in your toggle switch, write “$isAnimalModeActivated”. We put the dollar sign right before our @State variable to give the toggle switch the right to edit our variable (this is called a Binding). However, we’re still forgetting two things; a Text view that says when animal mode is activated (just because it looks nice) and most importantly, a VStack! First, embed your toggle switch in a VStack, then paste the code below right after your toggle switch:

Text("Animal Mode \(isAnimalModeActivated ? "Activated" : "Deactivated")")
    .padding()                
    .foregroundColor(isAnimalModeActivated ? .red : .green)

What we do here may look a bit complicated but it’s actually fairly simple once you dive in. We basically make an in-line if by using the ternary operator: we say, “if the animal mode is activated, let the text be ‘Activated’ and if not, let it be ‘Deactivated’.” We do the same thing with the color, and the rest is what makes the Text look good. 

Your file should now look like this:

import SwiftUI  
struct ContentView: View {    
    @State var isAnimalModeActivated = false
   
    var body: some View {    
        VStack {         
            Toggle(isOn: $isAnimalModeActivated) {           
                Text("Howdie, Mr. Fury Wool!")       
            } .padding()
                      
            Text("Animal Mode \(isAnimalModeActivated ? "Activated" : "Deactivated")") 
                .padding()               
                .foregroundColor(isAnimalModeActivated ? .red : .green)
        }    
    } 
} 
  
struct ContentView_Previews: PreviewProvider {   
    static var previews: some View {  
        ContentView()    
    }
}

If you tap the toggle switch, you’ll see the text automatically updates (thanks to our @State variable). Once your app looks like the picture below, you should be good to go!

Thanks to this app, Mr. Wool got his ability back and everybody is safe.

Update: If you want to test out the final result, you can download the project from my GitHub page here.