web
You’re offline. This is a read only version of the page.
close
Skip to main content
Community site session details

Community site session details

Session Id :
Power Apps - Building Power Apps
Unanswered

changing button color after being pressed

(0) ShareShare
ReportReport
Posted on by 120
I have 4 buttons that I am using to filter out a gallery. the filter is working, i used a variable depending on what the user clicks on.
 
I am trying to change the color once it has been pressed down, and can't seem to get that to work. 
Do I changed the Fill with a variable depending if it was pressed?
If another was pressed, how do I change the color? do if, else variable?
 
Keeping it simple, it's default blue, want to change it to Green.
Categories:
I have the same question (0)
  • RobElliott Profile Picture
    10,286 Super User 2025 Season 2 on at
    changing button color after being pressed
    Set your OnVisible property for the screen and  the App OnStart property to 
    Set(varSelected,Color.Blue).
     
    Add a button to your app. Set the OnSelect property to 
    Set(varSelected, Color.Green)
     
    and the Fill property to varSelected.
     
    Rob
    Los Gallardos
    Microsoft Power Automate Community Super User.
    Principal Consultant, SharePoint and Power Platform WSP Global (and classic 1967 Morris Traveller driver)
  • nerdyplayer Profile Picture
    120 on at
    changing button color after being pressed
    Thx Rob, it did change the color, but i have 4 buttons to work as the filter. If a user selects one of the others, i want the color to change back.
     
    Right now, if i click on one, all the others will change color too and cannot revert back.
  • Ytalo Silva Profile Picture
    171 Super User 2025 Season 2 on at
    changing button color after being pressed

    Hello, in cases like this, I usually use a gallery of buttons. Basically, I create a collection in this format:

    ClearCollection(
    colMenuButtons,
    {label: "Button1", action: "", defaultColor: ColorValue("myColorHex"), selectedColor: ColorValue("myColorHex")},
    {label: "Button2", action: "", defaultColor: ColorValue("myColorHex"), selectedColor: ColorValue("myColorHex")},
    {label: "Button3", action: "", defaultColor: ColorValue("myColorHex"), selectedColor: ColorValue("myColorHex")}
    )

    This can be done in the OnStart of the application. Then, I create a gallery and add a button. In the Items property of the gallery, I set colMenuButtons. In the button’s label, I use ThisItem.Label, and for the Fill property, I set:

    If(ThisItem.isSelected, ThisItem.selectedColor, ThisItem.defaultColor)

    This way, I can change the color of the selected item.

    To define the actions for each button, in the OnSelect property of the button, I use a Switch statement.

    This is just one way to do it. Another way would be to create 4 color-specific variables for each button. In the Fill property of each button, you would use:

    If(varButton1 = true And Or(varButton2,varButton3,varButton4) = false,ColorValue("colorSelectedHex"), ColorValue("colorDefaultHex"))

    Make sure to reset the variables for the other buttons when one is selected.

    I hope this helps!

  • CU05010146-0 Profile Picture
    13 on at
    changing button color after being pressed
    I have used the following when creating different buttons within an app recently.  I set the OnSelect and Fill properties as below:
     
    For Button1:
    OnSelect property setting:
    Set(SelectedButton, "Button1")
     
    Fill property:
    If(SelectedButton = "Button1", Green, Blue)
     
    For Button2:
    OnSelect property setting:
    Set(SelectedButton, "Button2")
     
    Fill property:
    If(SelectedButton = "Button2", Green, Blue)
     
    Substitute the name of your buttons for "Button1," Button2," etc. 
     
  • WarrenBelz Profile Picture
    151,903 Most Valuable Professional on at
    changing button color after being pressed
    I posted before I noticed that @RobElliott's post at the bottom is the direction I would take - I might as well continue, but please mark Rob's as the solution. You simply need multiple Variables and you can use UpdateContext
    UpdateContext(
       {
          varColor1: Color.Blue,
          varColor2: Color.Blue
    varColor3: Color.Blue
    varColor4: Color.Blue } )

    then change whichever you need.

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

Quick Links

Responsible AI policies

As AI tools become more common, we’re introducing a Responsible AI Use…

Chiara Carbone – Community Spotlight

We are honored to recognize Chiara Carbone as our Community Spotlight for November…

Leaderboard > Power Apps

#1
WarrenBelz Profile Picture

WarrenBelz 624 Most Valuable Professional

#2
Michael E. Gernaey Profile Picture

Michael E. Gernaey 384 Super User 2025 Season 2

#3
developerAJ Profile Picture

developerAJ 246

Last 30 days Overall leaderboard