Create a canvas app from scratch using Microsoft Dataverse

Build a canvas app to manage data that's stored in Dataverse, using standard tables (which are built in), custom tables (which your organization creates), or both.

When you build an app from Dataverse, you don't need to create a connection from Power Apps, as you do with data sources such as SharePoint, Dynamics 365, or Salesforce. You need only to specify the tables that you want to show or manage in the app.

Prerequisites

• Before you create an app from scratch, familiarize yourself with Power Apps basics by generating an app and then customizing that app's gallery, forms, and cards.
• Switch to an environment in which a database has been created with sample data. If you have an appropriate license, you can create an environment to meet this need.
• To create an app, you must be assigned to the Environment Maker security role.

Open a blank app

To create an app from scratch that uses data from Dataverse, the first step is to create a blank app. For this exercise, when you create the blank app, ensure you choose Phone format.

Specify a table

1. In the middle of the screen, select connect to data.

2. In the app authoring menu, select Data. If this is your first time, you're prompted to create a connection to Dataverse. Select Create this connection.

3. Select Add data and in the search box enter, Accounts > Connect.

4. Close the Data pane by selecting the close icon in the upper-right corner.

Add a list screen

1. On the command bar, select New screen > Templates tab > List.

2. In the left navigation bar, select BrowseGallery1, and then set the value of the Items property to this formula:

   SortByColumns(Search(Accounts, TextSearchBox1.Text, "name"), "name", If(SortDescending1, SortOrder.Descending, SortOrder.Ascending))

   This formula specifies that:

   • The gallery should show data from the Accounts table.

   • The data should be sorted in ascending order until a user selects the sort button to toggle the sort order.

   • If a user types or pastes one or more characters into the search bar (TextSearchBox1), the list will show only those accounts for which the name field contains the characters that the user specified.

     You can use these and many other functions to specify how your app appears and behaves.

     

3. Set the gallery's layout to show only the name of each account, and configure the title bar to show the word Browse, as Customize a gallery describes.

   

4. In the left app authoring pane, hover over Screen1, select the ellipsis icon (...), and then select Delete.

5. In the left app authoring pane, hover over Screen2, select the ellipsis icon (...), and then select Rename.

6. Type or paste BrowseScreen, and then rename the gallery in that screen as BrowseGallery.

   

Add a form screen

1. Repeat the first step of the previous procedure, except add a Form screen instead of a List screen.

2. Set the form's DataSource property to Accounts and its Item property to BrowseGallery.Selected, as the Advanced tab of the right-hand pane shows.

3. On the Properties tab of the right-hand pane, select Edit Fields to open the Fields pane.

4. Select Add field, and then select the check boxes for these fields:

   • Account Name
   • Address 1: Street 1
   • Address 1: City
   • Address 1: ZIP/Postal code
   • Number of Employees
   • Annual Revenue

   Note

   Outside of this scenario, you can create a custom field by selecting New field, providing the required information, and then selecting Done. More information: Create a column.
   
   

5. Select Add.

6. Set the title bar's Text property to show Create/Edit.

   The screen reflects your changes.

   

7. Rename this screen FormScreen.

Configure icons

1. On the BrowseScreen, set the OnSelect property of the circular icon near the top of the screen to this formula:

   Refresh(Accounts)

   

2. Set the OnSelect property of the plus icon to this formula:

   NewForm(EditForm1); Navigate(FormScreen, ScreenTransition.None)

   

3. Set the OnSelect property of the first arrow pointing to the right to this formula:

   EditForm(EditForm1); Navigate(FormScreen, ScreenTransition.None)

   

4. On the FormScreen, set the OnSelect property of the cancel icon to this formula:

   ResetForm(EditForm1);Navigate(BrowseScreen, ScreenTransition.None)

   

5. Set the OnSelect property of the checkmark icon to this formula:

   SubmitForm(EditForm1); Navigate(BrowseScreen, ScreenTransition.None)

   

6. On the Insert tab, select Icons, and then select the Trash icon.

7. Set the Trash icon's Color property to White and its OnSelect property to this formula:

   Remove(Accounts, BrowseGallery.Selected); Navigate(BrowseScreen, ScreenTransition.None)

   

Test the app

1. On the actions menu, select Preview the app. More information: Preview an app

2. Toggle the list between ascending and descending sort orders, and filter the list by one or more characters in the account name.

3. Add an account, edit the account that you added, start to update the account but cancel your changes, and then delete the account.

Next steps

• Link this app to a solution so that you can, for example, deploy it to a different environment or publish it on AppSource.
• Open one or more sample apps, and explore different types of apps that you can create.