Saturday, 19 February 2022

Conditional formatting in Power Apps Gallery Control

Text Color:

I have label control that displays the Status of each issue, and the status is choice column in SharePoint list. Here I am trying to display different statuses in different colors.

Select Status label in the first row of the gallery, and at the top of the screen, select the Color property to type in the function box.

If the status is completed, show green, otherwise black.

If(
    ThisItem.Status.Value = "Completed",
    Color.Green,
    Color.Black
)

If you have multiple statuses wher you need to set up multiple colors: use Switch which is similar to IF.

In my scenario, if it’s completed show green, if In progress, purple, if Blocked, Red, otherwise if none of those are the case, the color will be black.

Switch(
    ThisItem.Status.Value,
    "Completed",
    Color.Green,
    "Blocked",
    Color.Red,
    "In Progress",
    Color.Purple,
    Color.Black
)


     When the record is selected:

If you want to fill the color for the selected record in gallery, please select the gallery control, and write the below function in TemplateFill property
If(
    ThisItem.IsSelected,
    ColorFade(
        RGBA(208,235,242,1
        ),
        -30%
    ),
    RGBA(0,0,0,0
    )
)



Bold Font:

If the task is assigned to the current user, the user’s name will be displayed in a bold font weight.

Click to select the label in the first row, that shows the “Assigned To” person’s name (It's a SharePoint People picker field). Select the FontWeight property.
If(
    ThisItem.'Assigned To'.Email = User().Email,
    FontWeight.Bold,
    FontWeight.Normal
)



Switch Icons:

If you would like to display a different icons for each of the 3 different priority levels. 

Select the first row of the gallery and Insert any icon from the Icons. There is a property called Icon on the icon, which tells you its name.

In my scenario, if the priority is High, show warning icon, if Medium, Information, if none of those are the case, Icon will be low/download.

Switch(
    ThisItem.Priority,
    "High",
    Icon.Warning,
    "Medium",
    Icon.Information,
    Icon.Download
)

Fill Color:

In Power App all the controls will have a Fill property, for the fill color. Here I want to show as a different color depending on the priority for a Icon. If it’s high priority, Red, if Medium, Orange, otherwise Aquamarine.

Switch(
    ThisItem.Priority,
    "High",
    Color.Red,
    "Medium",
    Color.Orange,
    Color.Aquamarine
)



Bow background Color:

If the status is equal to "In progress" show as Light yellow, otherwise white. To set the row’s background color, select the gallery, and go to the property called TemplateFill.

If(
    ThisItem.Status.Value = "In Progress",
    Color.LightYellow,
    Color.White
)



Disable a Icon or Button:

You can change the DisplayMode of any control, based on a condition. When you disable a button, by default it will show as grey, so that the button is still there, but clearly not clickable. In this example, I’ll use a Edit Icon, and I’ll disable it if the task has been completed. Select the Icon, go to the DisplayMode property:

If(
    ThisItem.Status.Value = "Completed",
    DisplayMode.Disabled,
    DisplayMode.Edit
)

No comments:

Post a Comment