In this Power Apps tutorial, I will explain how to create a canvas app in Power Apps from a SharePoint list.
If you are new to Power Apps, you can either sign up for a Microsoft 365 developer tenant or a free Power Apps trial and continue following this tutorial.
Create a Canvas App in Power Apps From a SharePoint List
We can build an app from a canvas in Power Apps without using any code or programming language like C#. Simply, by drag and drop controls to a canvas, we can develop a business app in Power Apps, known as the Canvas App. This app can be connected with various business data sources, including Microsoft and 3rd party data sources. Finally, you can share the canvas app with users, where they can run it in a browser or mobile and tablet devices.
Here is the SharePoint Online list I created on my SharePoint site. It has three columns like below:
|Employee ID||Single Line of Text||Default Title Column (Just renamed)|
|Full Name||Single Line of Text|
|Gender||Choice Column||Choice Values: Female, Male and Others|
And the SharePoint Online list looks like below:
Now, let us see how to create a canvas app from the above SharePoint list.
- Open the SharePoint Online list, then click on Integrate -> Power Apps -> Create an app from the command bar like below:
- Then it will ask you to provide the App’s name, then click on the Create button. It will check if the App name already exists or not. If there is no app with the same name, it will allow creation.
- Once you click the Create button, it will open the Power Apps studio, where you can customize the app if you want any customization.
- Now, it will open the Power Apps studio, and you can see full-fledged working Apps will be created with the 3 below screens.
- BrowseScreen: You can see that all the items in the list will appear here.
- DetailScreen: It will display all the properties of a single item.
- EditScreen: This screen will be used to Add or Edit an item.
- Here, you can see what the app looks like.
- You can save, publish, and run this Power Apps canvas app without changing anything. From the top right corner, you can click on the Save icon to Save the Power Apps app, or you can click on the Publish icon to Publish the Power Apps app to the cloud.
- Once you click on the Publish button, it will open the Publish dialog box. Here, you can provide a Description and click on the Publish this version button to publish the Power Apps canvas app to the cloud.
- Power Apps also allows us to Edit details about the App, which you can do by clicking the Edit details button. Then, it will open the Settings dialog box, from where you can change the Name and description of the app, and it also allows you to set an icon for the app.
- From the Display tab, you can change the Orientation, like you can change from Portrait to Landscape mode. You can “on” the Scale to fit option to scale the app to fit available space.
- Another important setting you can do is the Lock orientation, where if you “On” this option, the app or the screen will be in the current orientation even when the device is rotated.
- In the Support tab, you will be able to see a few important options like:
- Authoring version
- Session ID, etc.
These are a few settings you can change in the Publish window.
- Once the App is published, the app will be available on the Power Apps home page. To view and run the app, navigate to (https://make.powerapps.com/). Then click on Apps from the left navigation, which will open the Apps page where you can see all the apps.
- To play or run the Power Apps canvas app, select the particular app, then from the command bar click on the Play button, otherwise you can also click on the […] and then click on the Play button in the ECB menu.
- Then the app will be opened on the browser and the Display screen will open where you can see all the list items. You can click on a single item to view details about that particular item. Also, you can click on the Plus item to add a new item to the SharePoint list from Power Apps Add new item screen.
- From the Add New item screen, you can fill the details and click on the Save icon to Save the item to the SharePoint Online list. Once the item has been added it will navigate to the Display screen.
- In the same way, you can click on the Delete icon to delete an item from the SharePoint list in the Details screen.
You can also check out my video tutorial which I have uploaded to the YouTube channel for the step-by-step guide.
I hope you get a complete idea of how to create a canvas app in Power Apps from a SharePoint list. With a few clicks, we can easily create a canvas app from a SharePoint list and start using it.
You may also like the following tutorials:
- How to Add a Time Picker in the Power Apps Canvas App?
- Power Apps Barcode Reader Control
- Power Apps Form field validation on submit
- Save camera image to SharePoint list attachment in Power Apps
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.