Manage Screens In PowerApps

Introduction

We know that Screens are a necessary part of any PowerApps canvas application, and we cannot build any PowerApps canvas application without screens, so let’s look into screens and it’s all possible operations that we can do in PowerApps in this article.

Creating new screen in PowerApps

To create a new screen, first of all, open the app in edit mode in which you want to create a new screen.

Now you have two options to create a new screen.

Option-1

From the top navigation bar, click on "New screen" option and you will see option to create a blank screen, or you can select it from the templates available.

Option-2

From the left navigation under Tree View, we have Screens Option, under screen we have "New screen" button. Click on "New screen" button and then it will give you a list of screens and option to browse from the templates of screens.

Just select and click on the screen type, and a new screen will be added to your canvas app with the default naming conventions "screenN" (N is the number of existing screens plus 1. For example, your canvas app has 10 screen, new screen will have name "Screen11")

You can create your new screen by using either way you want.

Duplicating a screen in PowerApps

Consider a case where you have designed a screen that has 10-15 controls, and all are aligned properly. And now you want to create one more screen which is identical to the existing current screen. So here you have again 2 options.

First option is to create a blank screen and copy paste the controls from the existing screen to the newly created screen.

Second option is you can simply create a copy of the existing screen using Duplicate functionality.

For example, below is the screen which we need to replicate (Screen3)

To create a copy of the screen simply click on the ellipsis icon of the screen for which copy is to be created and then click on "Duplicate screen". In our case, it is Screen3, so right click on Screen3 or click on ellipsis icon of Screen3 and then click on "Duplicate screen".

Once you have done this, it will create a new screen with the same name and append additional characters just to keep names unique.

In this way, we can create a copy of the screen.

Deleting screen in PowerApps

To delete the screen, right-click on the screen which you want to delete and click the option "Delete" and the screen will be deleted.

Renaming Screen in PowerApps

Renaming screen is the same as deleting the screen. Just right-click on the screen you want to rename and then click on "Rename" option and then type the new name and hit enter, the screen will be renamed.

Note that, if you have already used the screen name in your PowerApps code such as Navigation, and then you are renaming your screen, then in that case, it will update at all places where you have used this screen name. You do not have to go and manually update the names.

Reordering the screens in PowerApps

When we add a new screen, it automatically adds at the last of the existing screen, but sometimes we need to have some specific screen order. In that case, we have to re-order the screen. To reorder the screen, we have an option "Move up" and "Move down".

If you have only one screen, then in that case these options won’t be available.

If you have two screens, then first screen will have option to "Move down" and second screen will have option to "Move up".

If you have 3 or more screens, then in that case you will see "Move up" and "Move down" options for the screens.

To re-order, we can simply right-click on the screen and choose your options from "Move up" and "Move down" accordingly.

Expand all & Collapse all

As soon as we add any control into the screen, the screen start showing the right arrow in front of the screen which we can expand or collapse.

Here you can see that "Screen1" does not have any control, so it won’t have any "right arrow" icon in front of screen name, while Screen3 and Screen have the controls added into the screens so that have "right arrow" enabled in front of the screen names.

Using "Expand all" we can just expand this screen to display a list of controls that screen has.

Using "Collapse all" we can collapse this screen to hide the controls and display only screen name.

Here "Screen3" is in collapsed all mode, and "Screen" is in expand all mode.

Comments in screens in PowerApps

Consider a scenario where two or more developers are working on PowerApps in different time zones. In that case, if one developer wants to give some feedback on the screen or he wants to update another developer about his changes to the specific screens, or else he wants to report some issue with the screen, he can now directly add comments to the specific screen using commenting feature of the PowerApps screen.

To add a comment, just right-click on the screen in which you want to add the comment and click on "New comment" option

As soon as "New comment" is clicked, a new comment window will appear in the right-hand side where you can add the comments.

And once the user has added the comment, the screen will now have a comment icon on the right side of the screen name.

Now, another developer can open the comments by clicking on the comment icon and he can resolve the comments.

User can also delete or edit the comments made. Once the comment is resolved, comment will be marked as Resolved.

And the comment icon will disappear from the screen name

FAQ

Do we have any limit to adding screens to the app?

No, there is no such hard limit set for number of screens in the app. This is just a logical consideration that as the number of the screens will increase, the app size will increase, app size will increase then performance of the app may be affected. Number of screens may be a factor in app performance. But again, it depends on how many controls you are adding to the screens.

Do we have any limit to adding controls on the screen?

Again No, there is no limit is defined for the controls to add to the screen. You can add as many as control you want, but just keep in mind that controls will make your app a little bit bulky in size and performance may be affected due to that.

Summary

In this article, we have seen how we can create, duplicate, rename, and delete screens in PowerApps. We have also seen how we can add comments to the screens and how we can reorder the screens to move the screens up and down. Also, we saw how we can perform expand and collapse into the screens. And also, we discovered how we can collaborate on screen using Comment feature at screen level. If you have any questions or suggestion regarding this article, please post into the comment box.