In this Power Apps Tutorial, we will learn how to work with SharePoint within the Power Apps gallery. We will also discuss the following topics:
- powerapps gallery to sharepoint list
- powerapps gallery sharepoint image
- powerapps gallery sharepoint refresh
- powerapps gallery sharepoint with multiple data sources
- powerapps gallery sharepoint list view
- powerapps gallery sharepoint attachments
- powerapps gallery sharepoint list filter
- powerapps gallery sharepoint with headers
- powerapps gallery sharepoint remove duplicates
- powerapps gallery sharepoint multiple filters
- powerapps gallery sharepoint with checkbox
- powerapps gallery filter sharepoint list
- powerapps gallery sharepoint yes no field
- powerapps save or submit or update gallery to sharepoint
- Power Apps gallery sharepoint edit
- Power Apps gallery upload sharepoint attachment
Before working with SharePoint, first, we have to sign in to the Power Apps with our respective office365 user ID or Microsoft ID.
Once you have logged in to the Power Apps with your user ID, next, we need to create a canvas app where we will perform all the above examples as per various requirements. To create the canvas app within the Power Apps gallery, the following steps are:
- On the Home page of the Power Apps, click on Blank App.
- Navigate to the Blank canvas app.
- Click on Create.
- Give a name to the app.
- Select a format (Tablet or Mobile).
- Press Create.
Now, we can see a default screen on the Power Apps. Where we can build galleries, data tables, etc and connect to them with data sources such as SharePoint, Excel, etc.
Also Read: Power Apps Gallery Patch [With Various Examples]
Power Apps gallery SharePoint
Here, we will see how to add a gallery to the Power Apps screen. Then we will see how to connect the gallery with SharePoint.
Before that, we prepared a SharePoint list named Products, having some random columns such as:
- Title (default)
- Image (Image)
- OrderDate (date and time)
- DeliveryDate (date and time)
- Price (Currency)
- Delivered (Yes/No)
- ParentCompany (Choice)
- Address (Single line of text)
- ProductNumber (Number)
Now, we will move to the Power Apps and add a gallery to the Power Apps screen. Navigate to the Insert tab > Gallery > Select any gallery as per your requirement.
Suppose, we have selected a vertical gallery. It will appear as a blank vertical gallery on the screen like below:
Now, we will connect the above SharePoint list to the gallery. To do this, the following steps are:
- On the right side gallery’s properties panel, we can find the option ‘data source’.
- Click on that. Search Sharepoint.
- Select the SharePoint site address.
- Choose your site and SharePoint list i.e., Products.
- Create.
This is how to add SharePoint to the Power Apps gallery.
Also, Read: Power Apps Data Table [Complete Guide]
Power Apps gallery SharePoint image
Now we will see how to display the image column in the Power Apps gallery. This feature is recently released by Microsoft in October 2021. There is an Image control in Power Apps, by which we can able to display the images from the SharePoint list.
Power Apps images can be displayed in four different sizes such as:
- Small
- Medium
- Large
- Full
Also, we can customize the Image position such as:
- Center
- Fill
- Fit
- Stretch
- Tile
Now we will see how to display the SharePoint images on the Power Apps gallery. We are going to use the previous SharePoint list that contains an Image column. Next, we will build a horizontal gallery using the above SharePoint list as the data source.
As there is an image column inside the SharePoint list, so it displays those images without any expressions. This is how to display the SharePoint image within the Power Apps gallery.
Also check: Power Apps Dropdown Control with SharePoint
Power Apps gallery sharepoint refresh
Now we will see how to refresh a gallery within the Power Apps. We can refresh the data in the gallery manually and automatically.
To refresh the gallery manually, teh following steps are:
- On the Power Apps, go to the Data section.
- We can find the data source there.
- Click on the ellipses … of the data source which you want to refresh and Refresh.
In this manner, we can manually refresh the data source on the Power Apps, and the changes will be reflected in the Power Apps gallery.
Now, we will see how to refresh the gallery automatically. That means when the user opens the app, the gallery data will automatically refresh. To do this, we need to insert the below expression on the screen’s OnVisible property.
OnVisible = Refresh(<Data source>)
In our case, it will be:
OnVisible = Refresh(Products)
Where, Products is the name of the SharePoint data source.
Let’s add a new item to the SharePoint list.
Now, close the Power Apps and again open it. We can find the item has been added to the gallery as well as the list has been refreshed.
This is how to refresh the SharePoint list via the Power Apps gallery.
Check out: Power Apps Radio Button
Power Apps gallery SharePoint with multiple data sources
Yes, we can add multiple data sources such as SharePoint list within a single PowerApps gallery.
Let’s connect another Sharepoint list(ex– Bike Sales) to the Power Apps. Then build another another gallery to that exit screen.
We can see on the above screen that we have added 2 galleries with 2 different data sources.
Now, we want to refresh both galleries with one button click. That means when the user clicks on one button, it will refresh both the galleries at a time. To do this, the following steps are:
- Add a button control to the screen and insert the below expression to the button’s OnSelect property.
OnSelect = Refresh(Products); Refresh(BikeSales);
Where Products and BikeSales are the names of the data sources.
Next, we will add a new item to each data source or SharePoint list. Then return to the Power Apps environment, save, publish, and play the app. When we click on the button, we can see that both the galleries got refreshed at the same time.
This is how we can add multiple data sources to the Power Apps gallery.
Read: PowerApps stuck on getting your data
Power Apps gallery SharePoint list view
In Power Apps, we can view the gallery in different ways. Suppose, we have created a gallery using a SharePoint list like the below.
The above gallery only shows the title and the order date of each product. But we can change the view of the above gallery that will display the images, parent company, address of each item, and many more.
To do this, select the gallery and click on the layout that is presented in the right-side properties panel. In List layout, we can find different types of layouts or views that can be applied to the Power Apps gallery.
This is how to change the view of the SharePoint list within the Power Apps gallery.
Power Apps gallery SharePoint attachments
In our previous article, we have beautifully explained how to save attachments from the Power Apps gallery to SharePoint. We are referring you to visit that link to get the solution.
Power Apps gallery SharePoint list filter
In our previous article, we described how to filter a Power Apps gallery using a Sharepoint list and different types of scenarios. We recommend that you click on the provided link.
Power Apps gallery SharePoint with headers
Usually, when we are attaching a SharePoint list to the Power Apps, it displays the data without any headers. So in this section, we will see how to attach a SharePoint list with headers on the Power Apps gallery.
Suppose, we have prepared a Power Apps gallery like the below:
To add the headers to the gallery, the following steps are:
- Select the screen, and insert the below expression in the screen’s OnVisible property.
OnVisible = Collect(Column_Header,{Title: "", Qty:"", Color:"", PaymentMode:"",SoldDate:""})
Where,
- Column_Header – The name of the collection
- Title, Qty, Color, PaymentMethod, SoldDate – The name of the columns name.
Next, add a data table to the screen and place it above the gallery. In the data table’s items property, set the collection name.
Items = Column_Header
In the right-side properties panel, click on Edit Fields > Add Fields. Add all the fields. We can see all the fields will reflect in the data table.
This is how to show the SharePoint headers within the Power Apps gallery.
Check: Power Apps in SharePoint
Power Apps gallery SharePoint remove duplicates
In this section, we’ll look at how to remove duplicate data from a Power Apps gallery that contains a SharePoint list called ‘Projects,’ which contains some repeated or duplicate values, as shown below:
From the above gallery, now, we will remove all the duplicate items. To do this, we need to insert the following expression in the gallery’s items property.
Items = ForAll(Distinct(Projects,Title),LookUp(Projects,Title = Result))
Where,
- Projects– The name of the Sharepoint data source.
- Title– The name of the column.
Once the expression is applied, we can see the duplicate items are removed from the Power Apps gallery.
This is how to remove the duplicate items from the Power Apps gallery.
Power Apps gallery SharePoint multiple filters
Previously, we published an article where we described how to use multiple filters within a single Power Apps gallery with different types of scenarios. Kindly check out this link to get the solution.
Power Apps gallery SharePoint with checkbox
Here, we will see how to save SharePoint items from the Power Apps gallery via checkboxes. Suppose we have a SharePoint list named “Vendors” with 2 columns such as Title(Default) and Status(Choices i.e., Will Update Soon, Delivered, Declined).
Also, we have prepared a Power Apps gallery using the above SharePoint list. On that app, we have inserted a dropdown control and three check box controls for choices like the below:
As per the scenario, when the user selects any items from the dropdown list and checks any choices from the check box control, then the item with status value will be updated in the SharePoint list.
To do this, the following steps are:
- Select a checkbox (i.e., Will Update Soon Check box), and insert the below expression within the OnCheck property.
OnCheck = Patch(
vendors,
Defaults(vendors),
{
Title:VendorsDropdown.Selected.Value,
Status:{
'@odata.type':"#Microsoft.Azure.Connectors.SharePoint.SPListExpandedReference",
Value: WillUpdateSoonCheckbox.Text
}
}
)
Here,
- Vendors – The name of the SharePoint list
- Title, Status – The name of the SharePoint column
- VendorsDropdown – The name of the dropdown control
- WillUpdateSoonCheckbox – The name of the checkbox control.
Similarly, insert the below expression in another checkbox’s OnCheck property. Select the Delivered check box and insert the expression in the OnCheck property.
OnCheck = Patch(
vendors,
Defaults(vendors),
{
Title:VendorsDropdown.Selected.Value,
Status:{
'@odata.type':"#Microsoft.Azure.Connectors.SharePoint.SPListExpandedReference",
Value: DeliveredCheckbox.Text
}
}
)
Here, the DeliveredCheckbox is the name of the check box control.
Again, we will insert the following expression in the last checkbox’s OnCheck property. Select the Declined check box and insert the expression in the OnCheck property.
OnCheck = Patch(
vendors,
Defaults(vendors),
{
Title:VendorsDropdown.Selected.Value,
Status:{
'@odata.type':"#Microsoft.Azure.Connectors.SharePoint.SPListExpandedReference",
Value: DeclinedCheckbox.Text
}
}
)
Here, the DeclinedCheckbox is the name of the check box control.
Now, the app is ready to play. So save and publish it. Play the app in preview mode. We can see when we select any item from the dropdown and check any checkbox, it will save that item to teh SharePoint list.
Suppose, we have selected the item i.e., Gilli from the dropdown and checked the Delivered check box.
We can see the item is updated in both the SharePoint list as well as in the Power Apps gallery. This is how to update a SharePoint using the Power Apps gallery with checkboxes.
Also, read: Power Apps SharePoint Button
Power Apps gallery filter SharePoint list
Recently, we published an article where we described the Power Apps gallery filter using various types of examples. We recommend you follow the link to get the solutions.
Power Apps gallery Sharepoint yes no field
Now, we will see how to update SharePoint yes/no field via the Power Apps gallery. Suppose, we have a simple Sharepoint list named ‘Voters list’ having some random columns along with a ‘Yes/no’ column that is shown below:
Using the above SharePoint list, we have prepared a Power Apps gallery like the below:
Here, we have used a check box control on the above gallery. When the user checks the check box, the SharePoint list is updated as yes; otherwise, it is updated as no.
To do this, the following steps are:
- Select the check box control, and set the below expression within the OnCheck property.
OnCheck = Patch('Voters list',ThisItem,{IsEligibleForVoting:true})
Where IsEligibleForVoting is the name of the SharePoint yes/no column.
- Next, insert the below expression inside the checkbox’s OnUnCheck property.
OnUnCheck = Patch('Voters list',ThisItem,{IsEligibleForVoting:false})
- Make sure to set the default property of the checkbox as below:
Default = ThisItem.IsEligibleForVoting
That’s it! Now save, publish, and play the app in preview mode. We can see that when we check or uncheck an item in the Power Apps gallery, it will be updated in the SharePoint list. Suppose, we have checked the items like below:
We can see the items got updated in the SharePoint yes/no column.
Similarly, if we unchecked any item in Power Apps gallery, then it will be reflected in the SharePoint list. This is how to operate SharePoint yes/no column within the Power Apps gallery.
Read How to use Power Apps date picker
Power Apps save or submit gallery to sharepoint
In this section, we’ll look at how to save or submit a Power Apps gallery item to SharePoint.
There is a SharePoint list having some columns like Title, Age, Address like below:
Using the above SharePoint list, we have prepared a Power Apps gallery.
According to the scenario, we will insert three text inputs to insert data, namely Title, Age, and Address, as well as a button on that app. So that when the user clicks the button, the item is submitted or saved in both the gallery and the SharePoint list.
To work with this, the following steps are:
- First, we will insert 3 text inputs and a button control to the above app like below:
- To save the gallery items to SharePoint, insert the below expression within the button’s OnSelect Property:
OnSelect = Patch('Voters list', Defaults('Voters list'),{Title: 'Title Txt'.Text, Age: Value('Age Txt'.Text),Address:'Address Txt'.Text}); Reset('Title Txt');Reset('Age Txt');Reset('Address Txt');
Where,
- Voters list – The name of the SharePoint data source
- Title, Age, Address – The name of the SharePoint columns
- Title Txt, Age Txt, Address Txt – The name of the textinputs
We used Reset() in the above expression to reset each text input once the button is clicked. Save and publish the app now. In preview mode, run the app. Let’s enter some information into the text inputs shown below:
We can see teh item is updated in the SharePoint list as well as in the gallery, once we click on the Save button.
This is how to update SharePoint list using Power Apps gallery.
Check: How to use Power Apps Gallery Dropdown
Power Apps gallery sharepoint edit
According to the topic, when a user clicks on any gallery item, it will take them to an edit form. So that the user can edit the item and then re-save it to SharePoint.
We already published an article on how to edit Power Apps gallery items in SharePoint to work with this scenario. We recommend that you click on that link to get the solution.
Power Apps gallery upload sharepoint attachment
Recently, we have published an article where we have beautifully explained how to upload attachment(s) from Power Apps gallery to SharePoint list. We recommend you to follow this above link and get the solution as well.
Also, you may like some below Power Apps Tutorials:
- Power Apps Drop down Control [With Various Examples]
- Power Apps Gallery Group By [With Real Examples]
- Power Apps Navigate Function + 16 Examples
- Power Apps WeekNum and ISOWeekNum Function with Examples
- PowerApps nested gallery control example
- PowerApps Example – Create a Bank Account Statement
Conclusion
From this above Power Apps tutorial, we had learned all about Power Apps gallery with SharePoint and how to work with SharePoint via Power Apps gallery with different types of scenarios. Alos, we have covered below topics such as:
- How to attach the SharePoint list to the Power Apps gallery?
- How to show the SharePoint image fields in the Power Apps gallery?
- How to refresh SharePoint within the Power Apps gallery?
- How to work with multiple data sources within a single Power App?
- What are the different types of SharePoint list views available in Power Apps?
- How to save attachments from Power Apps to SharePoint list?
- How to filter a sharepoint list in powerapps gallery?
- How to add sharepoint with headers in powerapps gallery?
- How to remove sharepoint duplicates from powerapps gallery?
- How to perform sharepoint multiple filters within the powerapps gallery?
- How to update the sharepoint list via powerapps gallery with checkbox?
- How to filter sharepoint list within the powerapps gallery?
- How to update the sharepoint yes no field via powerapps gallery?
- How to save or update or submit a gallery item to SharePoint directly from the Power Apps?
- How to edit an item from the Power Apps gallery?
- How to upload an attachment(s) from Power Apps gallery to SharePoint?
After working for more than 15 years in Microsoft technologies like SharePoint, Office 365, and Power Platform (Power Apps, Power Automate, and Power BI), I thought will share my SharePoint expertise knowledge with the world. Our audiences are from the United States, Canada, the United Kingdom, Australia, New Zealand, etc. For my expertise knowledge and SharePoint tutorials, Microsoft has been awarded a Microsoft SharePoint MVP (9 times). I have also worked in companies like HP, TCS, KPIT, etc.