Custom Power Apps Notification

Normally you will use push notification to send notification to users in Power Apps mobile application but what happens when majority of your users are using desktop browser for Power Apps!

In this post, I will explain how you can use your data source to push notifications to your Power Apps. I will use SharePoint online as data source but you can use any other data source for the notification.

1- Configure SharePoint List

Create a SharePoint custom list that contains at least three columns as shown on the screenshot below.

Go to your Power Apps details and copy the App ID

Insert a new item into the list with the App ID copied from previous step

For the Notifications field you can put an html something list this:

<html>
<body>
<h1 style="background-color: red; color: white">Very Important Notification</h1>
<h3>Click on the link below to watch the instruction video of the new procedure</h3><br>
<div style="display: flex;">
<a href="https://hikmatune.sharepoint.com/Shared%20Documents/Aerial%20Shot%20Of%20Seacoast.mp4">Watch Video</a>
<hr>
<img src="https://hikmatune.sharepoint.com/Shared%20Documents/faces.jfif" width="300" height="200" />
</div>
</body>
</html>

Make sure your sources are readable by all users i.e. everyone has permission to see the image and video

2- Configure Power Apps

Add SharePoint List as Data Source into your Power Apps.

Then use the list to lookup the notification and set a variable in Power Apps OnStart action:

Set(glbNotification, If(Len(LookUp(PowerApps, PowerAppID = "29e3aff6-badf-43bc-89ed-fccb3725cacf",Notifications))>10, true, false));

Notice, only set the globe notification variable to true if the the notification length is greater than 10, i.e. if the there is no notification the variable will be false.

On your Power Apps screen add a HTML Text control and set the visible property to “glbNotification”

The HTMLText Control should do another lookup to show the notification.

LookUp(PowerApps, PowerAppID = "29e3aff6-badf-43bc-89ed-fccb3725cacf",Notifications)

This is how the message will show up for the users regardless of desktop browser and Power Apps on mobile or tablet.

You can embed any html, the exit button sets the glbNotification to false i.e. Set(glbNotification,false). This way the message only shows up on the start up not when user navigate to other screens and come back to home.