Power Apps Screen Templates [11 Screens With Examples]

Are you interested to know how to work with Power Apps Screen Templates? Then in this Power Apps tutorial, we will explain how to add and use Power Apps Canvas app screen templates with various examples.

Also, Check: How to Create a Canvas App in Power Apps

Power Apps Screen Templates

• Microsoft provided pre-built Layouts and templates for users that they can use directly while creating a canvas app in Power Apps.
• Using these Screen Layouts and templates, users can connect more than 200 data sources.
• When we create a new canvas app in PowerApps, by default blank screen will be created.

• There are different pre-built screen layouts are there in the PowerApps Canvas app, they are:
  • Blank
  • Split-screen
  • Sidebar
  • Header, main section, footer

This is the overview of Power Apps Screen Templates.

Various Screen Templates in Power Apps

There are different pre-built screen templates in the Power Apps Canvas app. Such as:

Screen	Description
Blank	A blank screen can be designed from scratch by inserting control buttons into the page.
Scrollable	A Scrollable screen, where users can scroll vertically to see different items.
List	A list screen can display a list of items, which we can directly connect to the Datasources.
Success	Users can use this Success screen when they need to display the notification as success.
Tutorial	The tutorial screen can be used to show information on starting page of the app.
Email	The email screen is used to display the Email box within the app, where employees or other users can send an email to others.
People	The people screen is used to display the person, who works in the organization.
Meeting	A meeting screen can be used to schedule a meeting using a calendar and invite a particular person to attend the meeting.
Calendar	A calendar screen can be used to check the Events or meetings in a particular organization.
Portrait print	A portrait print screen can be used to print a screen in portrait mode.
Landscape print	The landscape print screen is the same as the Portrait print screen, but it is used to print a screen in Landscape mode.

These are the screen templates in the Power Apps Canvas app.

Read: How to Filter Power Apps Gallery by Person

How to Add Power Apps Canvas App Screen Templates

After creating a Power Apps canvas app, users can use these pre-built Screen Layouts and templates when adding a new screen.

• There are two different ways to add a New screen in Power Apps as:
  • From the top Command bar
  • From Tree view

• Expand the New screen, and a user can find pre-built Screen Layouts and Templates. Choose Templates as shown below:

• Based on the business scenario, the user can use the pre-built screen templates in their Power Apps Canvas app.

Power Apps Screen Templates Examples

Now we will see some examples based on Power Apps Screen Templates.

Blank

• Users can use this Power Apps Blank screen when they need to customize or design their app from scratch.
• We can design this blank screen by inserting various Power Apps input controls into the page by dragging or dropping the components.
• Here, the user has complete control over the app design. Moreover, they can connect to data sources.

This is how to use the Blank screen in Power Apps Canvas App.

Scrollable

The Power Apps scrollable screen is used to show the different items vertically.

Example:

1. I added a Scrollable screen in the Power Apps Canvas app, it looks like the first image. This screen contains a +Add section where I can add the items vertically.
2. As shown in the 2nd image, I added three different sections.
3. Also, I customized the page by adding different input controls like the below-mentioned controls:
   • Text Input
   • Check box
   • Drop-down
   • Button

This is how to use the Scrollable screen in Power Apps Canvas App.

List

• A Power Apps list screen can display a list of items, which we can directly connect to the data sources like SharePoint, Excel, OneDrive, etc.
• This List screen comes up with many controls like the Next arrow button.
• Moreover, the user can add an Image to List items from their local device.

Example

1. When the user added a List screen in the Power Apps Canvas app, it will look like the first image. This screen contains a list, where they can connect to the data sources.
2. As shown in the 2nd image, I displayed the list of items by connecting to the data source (SharePoint List).
3. And when the user clicks on the > (arrow button), some action will appear according to the user’s need.

This is how to use the List screen in Power Apps Canvas App.

Check out: Power Apps Button Control [How to Use]

Success

Users can use this Power Apps Success screen when they need to display the success message.

Example

1. The success screen in the Power Apps Canvas app will look like the first image. This screen contains a checkmark icon and a successful message like “This was completed“.
2. After designing it, it looks like the 2nd image where I added a background image and Label control as “Your Request has been successfully submitted“.

This is how to use the Success screen in Power Apps Canvas App.

Tutorial

This Power Apps Tutorial screen can be used to show information on starting page of the app like tutorials, how to use the app, etc.

Example

1. The moment when I added a Tutorial screen in the Power Apps Canvas app, it looked like the first image.
2. This screen contains a related text, with an image and a next arrow button that can be navigated with three dots.
3. Later I customized the Power Apps Tutorial screen as shown in the second image.

This is how to use the Tutorial screen in Power Apps Canvas App.

Email

• The Power Apps Email screen is used to display the Email box within the app, where employees or other users can send an email to others.
• This Email screen provides:
  • Subject
  • Email body (message)
  • To (provide the name of the user to send an email), and send an email.

For Example

1. As shown in the 2nd image, I added the users to send an email with the subject and message.

This is how to use the Email screen in Power Apps Canvas App.

People

The Power Apps people screen is used to display the person, who works in the organization.

Example:

1. A People screen in the Power Apps Canvas app will look like the first image. This screen contains a People search bar where we can find users in our organization.
2. To search for any user or people, just type the name of the specific user and it will display the user name including the email address as shown in the second image.

Now select the user from the dropdown menu, then it displays the selected user name and email address.

This is how to use the People screen in Power Apps Canvas App.

Read: How to Show Hide Power Apps Label Control On Button Click

Meeting

A Power Apps meeting screen can be used to schedule a meeting using a calendar and invite a particular person to attend the meeting.

When we add the Meeting Screen to the Power Apps it will look like the below image:

There are two tabs in the Power Apps Meeting Screen:

1. Invite
2. Schedule

Example

When the user clicks on the Invite tab, where they can invite their team members to a meeting as shown in 1st image.

When the user clicks on the Schedule tab, they can schedule a meeting with a particular date, duration, and particular time as shown in the second image.

This is how to use the Meeting screen in Power Apps Canvas App.

Calendar

A Power Apps calendar screen can be used to check the Events or meetings in a particular organization.

Example

1. A Calendar screen in the Power Apps Canvas app will look like the first image. This screen contains a drop-down menu with a calendar.
2. When a user selects a particular date from a Calendar it displays the particular event as shown in the second image.

This is how to use the Calendar screen in Power Apps Canvas App.

Portrait print

A Power Apps portrait print screen can be used to print a screen in portrait mode.

Example

1. Once we add a Portrait print screen in the Power Apps Canvas app, it will look like the first image. This screen contains a plain page with a print function.
2. I customized the Portrait print screen by adding images to it. As shown in the second image.

If the user clicks on the Print function, it prints a screen with Gallery to your local device in pdf format.

This is how to use the Portrait print screen in Power Apps Canvas App.

Have a look: Power Apps Modern Date Picker Control [How to Use]

Landscape print

The Power Apps landscape print screen is the same as the Portrait print screen, but it is used to print a screen in Landscape mode.

Example

1. At the moment when we add a Landscape print screen in the Power Apps Canvas app, it will look like the first image. This screen contains a plain page with a print function.
2. I customized the Landscape print screen by adding charts to it. As shown in the second image.

If the user clicks on the Print function, it prints a screen with Graphical Representation to your local device in pdf format.

This is how we can use this Canvas App screen templates in Power Apps.

Additionally, you may like some more Power Apps & SharePoint tutorials:

• Power Apps Licensing And Pricing [Detailed Guide]
• Power Apps Modern Controls
• How to Filter Gallery by Current User in Power Apps
• SharePoint Online document library examples [12 Real Examples]
• How to Set Item-Level Permissions in SharePoint Online Document Library

Conclusion

This Power Apps tutorial has shared or given enough information on Power Apps Canvas app screen templates.

Moreover, we explained:

1. Various Screen Templates in Power Apps Canvas App
2. Add Screen templates in Power Apps Canvas app with their uses
   • Power Apps Blank Screen
   • Scrollable Screen in Power Apps
   • How to use Power Apps List Screen
   • Success Screen in Power Apps Canvas app
   • How to add Power Apps Tutorial Screen
   • Use of Power Apps Email Screen
   • How to utilize Power Apps People Screen
   • Power Apps Canvas app Meeting Screen
   • Add Power Apps Calendar Screen
   • Utilize the Power Apps Portrait print Screen
   • Power Apps Landscape print Screen