How to Display SharePoint List Items in PowerApps Gallery?

    Do you want to know how to display SharePoint list items in the Power Apps gallery? This Power Apps tutorial provides all the information about displaying SharePoint list items in a Power Apps Gallery control.

    Here, we will discuss how to get the SharePoint list items and display them on the blank Power Apps gallery control and display these SharePoint list items on a customized vertical gallery control.

    Additionally, we will learn how to display all SharePoint list items on a gallery control based on the condition.

    Display SharePoint List Items in PowerApps Gallery

    Using the two examples below, let’s see how to display SharePoint list items in the Power Apps gallery control. Such as:

    1. How to display all SharePoint list items on Power Apps blank gallery control
    2. Display all SharePoint list items on Power Apps Vertical gallery control

    Display All SharePoint List Items on Power Apps Blank Gallery Control

    Let’s take a simple scenario: I have a SharePoint Online list, i.e., [Order Details], with columns with various data types. Such as:

    Column NameData Type
    Product NameDefault single line of text
    Order DateDate and time
    Delivery DateDate and time
    QuantityNumber
    PriceCurrency

    After adding some items to the SharePoint list, the list looks like the following:

    How to display SharePoint list items in PowerApps gallery

    Now, I want to display these SharePoint list items on a Power Apps blank gallery control, as in the screenshot below.

    display SharePoint list items in PowerApps gallery

    To achieve the above example, follow the below steps. Such as:

    1. Go to the Power Apps Canvas app -> Select Power Apps Screen -> Insert a Blank vertical gallery control -> Connect your respective SharePoint list as shown below.

    Items = 'Order Details'
    how to display all SharePoint list items in PowerApps gallery control

    2. To display the SharePoint list’s items -> Insert the required Text labels inside the gallery and set its Text property to retrieve all items.

    Text = ThisItem.Title
    
    Text = ThisItem.'Order Date'
    
    Text = ThisItem.'Delivery Date'
    
    Text = ThisItem.'Quantity'
    
    Text = ThisItem.Price
    how to display all SharePoint list items in PowerApps gallery

    3. Then, for SharePoint list column names -> Insert Text labels above the Gallery control, and set its Text property as:

    Text = "Product Name:"
    
    Text = "Order Date:"
    
    Text = "Delivery Date:"
    
    Text = "Quantity:"
    
    Text = "Price"
    display all SharePoint list items in PowerApps gallery control

    4. In the last, if you want to display the “Total Amount” from the Price column, then, set its Text property using the sum() function like below.

    Text = "Total Amount =  " & Sum(
        gal_Products.AllItems,
        Price
    )

    Where,

    • gal_Products = Power Apps Gallery Name
    • Price = SharePoint Currency Field
    display all SharePoint list items in PowerApps gallery

    5. Save, Publish, and Preview the app. The gallery will display all SharePoint list items as in the screenshot below.

    display all SharePoint list items in a PowerApps gallery control

    This is how to display SharePoint list items on a Power Apps blank gallery control.

    Display SharePoint List Items on Power Apps Vertical Gallery Control

    Next, we will see how to display Sharepoint list items on a Power Apps vertical gallery control.

    Example:

    I have a SharePoint list named [Monthly Budget Traker]. This list contains the below fields.

    • Item = Default single line of text
    • ExpenseType = Choice
    • Budget = Choice
    • Amount = Currency
    • Month = Choice, etc…
    display SharePoint list items in PowerApps gallery control

    In Power Apps, I have added a Vertical gallery control that is connected to the SharePoint list. Now, I want to display all SharePoint list items using different list layout options as shown below.

    display SharePoint list items on a PowerApps gallery control

    To do so, follow the below-mentioned steps. Such as:

    1. On the Power Apps Screen -> Insert a Vertical gallery control -> Choose the respective “Layout” option under the Properties pane -> Connect to the SharePoint list as shown below.

    Items = 'Monthly Budget Expenses
    display SharePoint list items in a PowerApps gallery control

    2. Also, you can change the other properties of the gallery control, i.e., [Font size, Positions, Border, etc…] as per the needs.

    display SharePoint list items in the PowerApps gallery

    3. Save, Publish, and Preview the app. The Power Apps vertical gallery will display all SharePoint list items with respective columns, as shown below.

    how to display SharePoint list items on a PowerApps gallery

    This is how to display SharePoint list items in the Power Apps gallery control.

    Display SharePoint List Items in Power Apps Gallery Based on Condition

    Last, we will learn how to display SharePoint list items in the Power Apps gallery based on condition with a simple scenario.

    Scenario:

    Here, I will also take the above SharePoint list for this example. I want to display the SharePoint list items on a Power Apps gallery control based on the Budget [Either Over budget Or Within Budget].

    Refer to the below screenshot:

    display SharePoint list items on PowerApps Gallery

    To achieve it, follow the below steps.

    1. On the Power Apps Screen -> Insert a Radio button control and set its Items property as:

    Items = Distinct(
        'Monthly Budget Expenses',
        Budget.Value
    )

    Where,

    • ‘Monthly Budget Expenses’ = SharePoint Online List
    • Budget = SharePoint Choice Field
    how to display SharePoint list items on PowerApps gallery

    2. Insert a Gallery control and set its Items property to the code below.

    Items = Filter(
        'Monthly Budget Expenses',
        Budget.Value = Radio_Budget.Selected.Value
    )

    Where,

    • Filter() = This function can be used to find a set of records that matches one or more criteria
    • Radio_Budget = Radio Button Name
    display SharePoint list items on PowerApps gallery control

    3. Save, Publish, and Preview the app. The gallery will filter and display each item from the SharePoint list based on the Radio button selected value as shown below.

    display SharePoint list items on a PowerApps Gallery

    This is how to display SharePoint list items in a Power Apps gallery control based on the condition.

    Conclusion

    I trust this Power Apps tutorial taught in detail information about how to display SharePoint list items in a Power Apps gallery control.

    Here, we learned how to retrieve the SharePoint list items and display them on the blank gallery control and display the SharePoint items on a customized [Vertical] gallery control.

    Last, we covered how to display all SharePoint list items on a gallery control based on the condition.

    You may also like:

    >