Create a Customized Welcome Screen in PowerApps

Give your PowerApps app a bespoke feel with a customized Welcome Screen. Don’t let this concept fool you. The Welcome Screen can do a lot more than say “hello”!

Consider adding in some information about the current user for more thoughtful functionality.

Add a New Screen

  1. On the Home tab, click New Screen.
  2. Select a blank or scrollable screen. This example uses a scrollable screen.
  3. Move the screen up to appear as the first screen by clicking the ellipsis adjacent to the screen name.
    undefined
  4. Then click, Move Up.
  5. Repeat steps 4 and 5 until the new screen is the first screen.
  6. Rename the screen.

Add Content

The scrollable screen is created with a Data Card present. Include some content to the 1st Data Card and resize the data card so that it takes up no more than one quarter of the screen. In this example, the current user’s name is used to personalize the screen.

  1. Select the Data Card in the Tree View.
  2. Insert a Label and rename the label to something relevant.
  3. In the label’s text property type the code:

    User().FullName & ” Stats”

  4. Format the font, font-size and colors of the label as needed.

Add Another Data Card

  1. Click +Add Section to add another Data Card.
  2. Give the new Data Card a height of 250, at least.

Add Content to the New Data Card

  1. This time, we want to display some information about the current user’s records. We’ll display the Count of the records for the current user.
  2. Insert two labels and position the labels so that one is up higher than the other. In the first label’s text property, type “Claimed Incidents”.
  3. In the second label’s text property, type the following code:

    CountIf(‘Support Service Portal’,User().FullName in ‘Claimed By’)

    In this example, Support Service Portal is the data source, and ‘Claimed By’ is the field where the user’s name may appear. Make this code yours by swapping in your datasource and field name.

    Screen Shot 2020-02-01 at 1.13.01 PM
    The current user’s claimed incidents

Extra Credit

In the spirit of continuous improvement, add some information about how the user is performing compared to the entire team.

  1. First, add another data card as mentioned above.
  2. Then, add two new labels to the new data card and position the labels similarly to the last data card.
  3. Make the first label display the words Percentage Claimed Incidents.
  4. In the second label’s text property type the following code:

    CountIf(‘Support Service Portal’,User().FullName in ‘Claimed By’)/CountIf(‘Support Service Portal’,Not(IsEmpty(ID)))

    Screen Shot 2020-02-01 at 1.16.30 PM
    The percentage of incidents claimed by the current user

Format the number

Make the percentage of incidents claimed for the current user look like a percentage.

    1. First, let’s multiply the number by 100 by adding *100 after the existing code as shown below:

      CountIf(‘Support Service Portal’,User().FullName in ‘Claimed By’)/CountIf(‘Support Service Portal’,Not(IsEmpty(ID)))*100

    2. Then, wrap all of that code inside a Text function, like this:

      Text(CountIf(‘Support Service Portal’,User().FullName in ‘Claimed By’)/CountIf(‘Support Service Portal’,Not(IsEmpty(ID)))*100, “[$-en-US]####.##” )

      The Text() function can convert and format a number or date. In our example, we use this format Text(any number, “[$-en-US]####.##”). In this case, we could literally type in a number for ‘any number’ but we put in our long formula for finding the percentage of claimed incidents. “[$-en-US]####.##” is the format for decimal number in English in the USA. For more information about the text function, check out this handy article from Microsoft: https://docs.microsoft.com/en-us/powerapps/maker/canvas-apps/functions/function-text.

    3. Lastly, tack on a percent sign at the end, like this:

      Text(CountIf(‘Support Service Portal’,User().FullName in ‘Claimed By’)/CountIf(‘Support Service Portal’,Not(IsEmpty(ID)))*100, “[$-en-US]####.##” ) & “%”

      Screen Shot 2020-02-01 at 1.32.14 PM
      Formatted number as decimal percentage

Additional Functionality

The Welcome screen can and should hold useful information for users. Since this is the first screen in the app, be sure to include buttons on this screen or some other method to navigate to other parts of the app.

1 thought on “Create a Customized Welcome Screen in PowerApps

Comments are closed.