cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Anonymous
Not applicable

Dropdown item in different color : Canvas app

Hi,

 

I want to select different dropdown options filled with different colors (coming from sharepoint list) on a drop down button on Canvas app. Please suggest how to do it without gallery control.

 

Listname: 'Status'

--------------------

Title Values are : One, Off, Pause.

 

Red: On || Green: Off || Pause: Grey

 

Thank you in advance !

5 REPLIES 5
WarrenBelz
Super User
Super User

Hi @Anonymous ,

You cannot change the colours of individual items of a drop-down (or Combo Box) except the selected item.

You could do this in a gallery (which you do not want) that you can make look a lot like a drop-down.

 

Please click Accept as solution if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it Thumbs Up.

GarethPrisk
Resident Rockstar
Resident Rockstar

You can accomplish this using a Gallery, as you noted. To be clear (which I think you realize), there is no way to have a Drop Down have different color choices.

 

For the Gallery approach

  • Add a blank Gallery control
  • Add Status as your Items property
  • Add a label to the Gallery, and set the following properties
    • Text: ThisItem.Title
    • Fill: Switch (ThisItem.Title, "On", Red, "Off", Green, "Pause", Grey)

You can then tweak things as need - including sizing and whatnot. You can also optionally put that Switch function as the TemplateFill property of the Gallery, to have the entire gallery row's fill be the color.

Anonymous
Not applicable

@GarethPrisk  Thank you so much for your quick response.

 

I followed your steps and able to set it up. But I can find it as a dropdown: to select from the drop down. Could you please help me here ? I am grateful. 

 

I end up doing it like this, as attached.

Another cool suggestion might be - in my example a dropdown list for approving : 

on property "Fill"
If(
      DataCardValue46.Selected.Value = "Approved",
      Green, 
      DataCardValue46.Selected.Value = "Rejected",
      Red,
     White
)
and if you want it you can set it on "View" (displaymode property) if you want the dropdown value pre-filled.

 

I have a short .gif as well attached. Hope it is ok. (backup url: https://i.postimg.cc/gkjPY1FD/example.gif )

Dunc
Frequent Visitor

You could do this by manually creating a drop down.

  1. Place a text box on top for selected value or hint text, with a down arrow in a box to the right
  2. Add a small gallery that becomes visible when you click the down arrow
  3. The gallery has one label in the template, with datasource set to the table with the colour values
  4. The label gets its colour and text value from the datasource table
  5. when you click on the desired colour/label, hide the gallery

Helpful resources

Announcements
Microsoft 365 Conference – December 6-8, 2022

Microsoft 365 Conference – December 6-8, 2022

Join us in Las Vegas to experience community, incredible learning opportunities, and connections that will help grow skills, know-how, and more.

Power Apps Ideas

Check out the New Ideas Site

We are excited to announce a new way to share your ideas for Power Apps!

Top Solution Authors
Top Kudoed Authors
Users online (5,649)