UPGRADE YOUR SKILLS: Learn advanced Swift and SwiftUI on Hacking with Swift+! >>

SOLVED: Color Button Switch State

Forums > SwiftUI
@pblacklock1  

Hi

I'm trying to change the state for the color of a button/shape/rectangle on a main view after an event is triggered.

For example, i have an invisible button/rectangle/shape on the screen, when a correct or invalid response is given, i want the button/rectangle/shape to change color

i can update TEXT (words of success or failure) for the viewer but i'm stuck on how to program this

Any help would be awesome

Thanks Paul

2      

@Hatsushira  HWS+

Tenary operator. You have a State variable which is a Bool in your view. When the event is triggered the color changes. Just an example and the modifiers in my example could be not the right one for your case.

opacity( yourVariableName == true ? 1.0 : 0.0) or .foregroundColor( yourVariableName == true ? .red : .black)

2      

@pblacklock1  

Thanks for the reply

I came up with this,

var answerFill = Color.green

in some view Circle() .fill(answerFill) .frame(width: 20, height: 20)

in function

if number == correctAnswer {
scoreTitle = "CORRECT" scorePlayer += 5

    } else {     
 answerFill = Color.red  This doesn't work at all

How would i use your example in context, do i need to make a Let statement? a @State

so wrapped up in this, i'm confusing myself

2      

@TheTwoNotes  

For your situation, I'd use a computed property. You have your State item like:

@State var yourCondition: Int = 1  // updated however you require

Add a computed property for the color to be used:

    var colorToShow: Color {
        switch yourCondition {
            case 1:
                return .red
            case 2:
                return .green
            case 3:
                return .blue
            case 4:
                return Color(UIColor(red: 0.5, green: 0.2, blue: 0.8, alpha: 0.5))
            default:
                return .clear
        }
    }

In your view, some other "view" (i.e. Button, shape, etc...) that you want to affect the color of based on a condition:

  Button(action: { print("hello")}, label: {
    Text("Button")
  })
  .foregroundColor(colorToShow)

Now you can have any number of conditons and any number of colors to display. You can use the same approach for a String to display or a Font to use, etc...

2      

@pblacklock1  

Thank you both for your input

@TheTwoNotes

Worked like a charm

Does the happy dance

Thanks again

Cheers Paul

3      

@NigelGee  HWS+

Paul

If the solution worked for you can you click the "checkmark" under the correct so people can see that it SOLVED. It would help to see if a problem is sovled or still working on.

Happy coding (and dancing 😂)

Nigel

2      

BUILD THE ULTIMATE PORTFOLIO APP Most Swift tutorials help you solve one specific problem, but in my Ultimate Portfolio App series I show you how to get all the best practices into a single app: architecture, testing, performance, accessibility, localization, project organization, and so much more, all while building a SwiftUI app that works on iOS, macOS and watchOS.

Get it on Hacking with Swift+

Sponsor Hacking with Swift and reach the world's largest Swift community!

Archived topic

This topic has been closed due to inactivity, so you can't reply. Please create a new topic if you need to.

All interactions here are governed by our code of conduct.

Swift breaks down barriers between ideas and apps, and I want to break down barriers to learning it. I’m proud to make hundreds of tutorials that are free to access, and I’ll keep doing that whatever happens. But if that’s a mission that resonates with you, please support it by becoming a HWS+ member. It’ll bring you lots of benefits personally, but it also means you’ll directly help people all over the world to learn Swift by freeing me up to share more of my knowledge, passion, and experience for free! Become Hacking with Swift+ member.
Click here to visit the Hacking with Swift store >>
 
Unknown user

You are not logged in

Log in or create account
 

Link copied to your pasteboard.