Search code examples
iosswiftiphoneswiftuiapplescript

Swift UI - I am trying to change the background. It is giving me an error under the function buttonPressed()


This is a project that I am working on that basically will allow me to have a welcome page. Once you click on 'click here' the button pressed should make the a new background filled with a new color(Creating a new scene)... which I will hopefully add more to later.

import SwiftUI

struct ContentView: View {
    
    // defined global variables in a function
    @State var backgroundColor: Color = Color.red
    
    var body: some View {
        ZStack {
            // background called
            backgroundColor
                .edgesIgnoringSafeArea(.all)

            // content
            contentLayer
            }
        }

    var contentLayer: some View {
            // content
        VStack {
            Text("Welcome to newsapptest!")
                .font(.largeTitle)
                
                Button(action: {
                    buttonPressed()
                }, label: {
                    Text("Click here to continue to the app!")
                        .font(.headline)
                        .foregroundColor(.white)
                        .padding()
                        .background(Color.black)
                        .cornerRadius(10)
                })
            }
        }
    }
    
    func buttonPressed() {
        backgroundColor = .blue

backgroundColor = .blue is giving me an issue saying that it is not in my scope. How can I fix this?

}

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

Solution

  • If you format your code (select and use ctrl-i), you'll see that your buttonPressed function is actually outside of your ContentView struct. Move it inside, and it will compile correctly:

    struct ContentView: View {
        
        // defined global variables in a function
        @State var backgroundColor: Color = Color.red
        
        var body: some View {
            ZStack {
                // background called
                backgroundColor
                    .edgesIgnoringSafeArea(.all)
                
                // content
                contentLayer
            }
        }
        
        var contentLayer: some View {
            // content
            VStack {
                Text("Welcome to newsapptest!")
                    .font(.largeTitle)
                
                Button(action: {
                    buttonPressed()
                }, label: {
                    Text("Click here to continue to the app!")
                        .font(.headline)
                        .foregroundColor(.white)
                        .padding()
                        .background(Color.black)
                        .cornerRadius(10)
                })
            }
        }
        
        func buttonPressed() {
            backgroundColor = .blue
        }
    }