How to Sort Gallery in Power Apps?

Power Apps Gallery control is useful for displaying and organizing data visually.

In a Power Apps gallery, sorting data provides a better user experience. Users can arrange data in either ascending or descending order with just a few simple steps.

In this Power Apps tutorial, we will see how to sort gallery in Power Apps in ascending or descending order.

Additionally, I will tell you how to custom sort Power Apps gallery items with various examples.

How to Sort Gallery in Power Apps

Let’s check how to sort the Power Apps gallery items in ascending or descending order using the sort icon.

Example:

I have a SharePoint list [Power Platform Training] that has various columns like:

Column NameData type
User IDTitle
User NameSingle line of text
CourseChoice [“Power Apps,” “Power Automate,” “Power BI,” “Power Virtual Agent”
Course CostCurrency
Course Start DateDate and time
Course End DateDate and time
How to sort ascending and descending in PowerApps gallery control

In Power Apps, a Gallery control is connected to the above SharePoint list.

Additionally, a Sort icon has been added. When users click on the sort icon, the items in the Power Apps gallery will be sorted either in ascending or descending order, as shown below:

Sorting the Power Apps Gallery Ascending Descending

Follow the below steps to achieve it:

  • On the Power Apps screen, insert a Sort icon and set its OnSelect property to:
UpdateContext({gal_Sort: !gal_Sort})

Where,

  1. gal_Sort = Variable name
Power Apps Gallery Sort
  • Insert a Gallery control and set its Items property as:
SortByColumns(
    'Power Platform Training',
    "UserName",
    If(
        gal_Sort,
        SortOrder.Ascending,
        SortOrder.Descending
    )
)

Where,

  1. Power Platform Training = SharePoint list name
  2. User Name = SharePoint list column name
  3. gal_Sort = Variable name
Power Apps gallery sort ascending and descending
  • Once the app is ready, Save, Publish, and Preview it. Whenever a user clicks on the Sort icon, the Power Apps gallery is arranged in ascending or descending order based on the text column.
Power Apps Gallery Sort Ascending Descending

This is how to sort the Power Apps gallery items in ascending or descending order.

Power Apps Gallery Sort Items Based on Column

In this section, let us check how to sort the Power Apps gallery items directly based on the SharePoint column.

Example:

I have added a gallery control on my Power Apps screen and connected to the above SharePoint list.

The gallery items are displayed in ascending order according to the ‘Course Cost’ currency column, as shown below:

How to sort a Power Apps gallery

Follow the below steps to achieve this:

  • On the Power Apps screen, insert a Gallery control -> Set its Items property to:
Sort(
    'Power Platform Training',
    'Course Cost',
    SortOrder.Ascending
)

Where,

  1. Power Platform Training = Above SharePoint list name
  2. Course Cost = SharePoint list currency column name
Sort Power Apps gallery in an ascending order
  • Once the app is ready, Save, Publish and Preview the app. Now, the Power Apps gallery will be sorted in an ascending order based on the ‘Course Cost’ currency column, as shown below:
Sort a Power Apps gallery

This is how we can sort Power Apps gallery items directly.

Custom Sort Choice in Power Apps Gallery

Let’s check how to custom-sort choices in the Power Apps gallery.

Example:

I have a SharePoint list [ACGH Clients Details] that has a choice column as “Subscription Type,” with values [“Basic,” “Standard,” and “Premium.”]

Manually specify the sort order of Power Apps gallery

In my Power Apps, I need to sort a gallery control by a choice column in a specific sequence: First, “Premium” subscription users, followed by “Standard” subscription users, and finally, “Basic” subscription users, as shown below:

Custom Sort Choice in a Power Apps Gallery

Follow the below steps to achieve this:

  • On the App’s OnStart property -> Create a Power Apps collection for custom sort choice:
ClearCollect(
    col_SubscriptionType,
    {
        SubscriptionType: "Premium",
        SortOrder: 1
    },
    {
        SubscriptionType: "Standard",
        SortOrder: 2
    },
    {
        SubscriptionType: "Basic",
        SortOrder: 3
    }
)

Where,

  1. col_SubscriptionType = Provide the collection name
  2. SubscriptionType = Provide collection column name
Custom Sorting In a PowerApps Gallery Using Sort
  • Now, we will Run OnStart, to create a collection [On the App, click on the More options () -> Then select Run OnStart
Manually specify the sort order of a Power Apps gallery
  • Insert a Gallery control and set its Items property to:
Sort(
    'ACGH Clients Details',
    LookUp(
        col_SubscriptionType,
        'Subscription Type'.Value = ThisRecord.SubscriptionType,
        SortOrder
    )
)

Where,

  1. ACGH Clients Details = Above SharePoint list name
  2. col_SubscriptionType = Collection name
  3. Subscription Type = SharePoint list choice column name
Power Apps sort gallery by a column
  • Now, the Power Apps gallery will be sorted in a custom order according to my preferences. It will start with “Premium” subscription users, followed by “Standard” subscription users, and at last, “Basic” subscription users.
How to manually specify the sort order of Power Apps gallery

This is how we can achieve custom sorting in a Power Apps gallery control.

Conclusion

This Power Apps tutorial explained how to sort the Power Apps gallery either in ascending or descending order.

Last, I have covered how to sort the Power Apps gallery items directly and how to custom sort items in Power Apps gallery.

Also, you may like: