PowerApps – sample formulas to implement offline support in your app

Implementing offline support in a PowerApp isn’t necessarily the simplest thing. Currently there is no magic setting which enables this (unfortunately). Instead, you have to write the behaviour you need into your formulas – but it isn’t the most complex thing either. I linked to some sample formulas in a previous post, but today I want to go through them in a bit more detail and walk through the offline behaviour I chose and the corresponding formulas.

I'm speaking about this at the SharePoint Conference 2019!

If you want to hear more about this, I have a session at SPC 2019 on the topic. The conference happens 21-23 May in Las Vegas - see https://sharepointna.com for more details. And use code 'OBRIEN' while you're at it! ;)

The upside of having to implement offline support yourself is that you’re in full control of the user experience. I chose to implement a couple of simple screens in the app to show appropriate messages, with the following behaviour (excuse the quick and dirty Visio here):

So that’s the behaviour. You might also decide to make it very clear to the user whether they currently have a connection – I added a “connection bar” to the home screen of my app for this, which is really just a Label control with the text and fill colour set appropriately:

The formulas are simply:

Text:

Fill:

If the user is offline when they submit the form, they are taken to the “pending” screen with this message:

 

..but if the user is online when they submit, OR he/she returns to the app later after initially being offline, then the record is submitted and they are navigated to the confirmation screen:

As you can see from the messages, we’re telling the user that they must return to the app if they initially submit their request at a time when they don’t have a connection. PowerApps cannot talk to the data source at this point, but we can store the data locally until a connection is re-established.

If you didn’t want to redirect the user to entirely different screens in the app, you could do something else like use the Notify() function:

In my case, however, I felt that the thin notification bar at the top wasn’t obvious enough - but it’s up to you.

Formulas

Here are the formulas I used for the behaviour to save data locally/navigate to the appropriate screens:

Formula 1:

• Where: submit button of my form
• Description: submits the record to SharePoint if there is a connection, otherwise saves it locally to the device – this is done by creating a local collection with ClearCollect() and then calling SaveData().The user is then taken to the "pending" screen.

Formula 2:

• Where: timer control added to pending screen
• Description: looks to see if a saved collection named 'LocalRecord' exists, and if so submits the record to SharePoint. The collection is then cleared, and the user is then taken to the "confirmation" screen.

When using this approach, I decided to add a timer control to both the "pending" screen and the home screen of my app - this seems to work well in terms of ensuring the data is submitted as soon as the user comes back to the app with a connection, regardless of whether they resume where they left off (usually the pending screen), or the app has to restart (perhaps because the device was restarted). Importantly, it *is* necessary that the user comes back into the app once a connection has been re-established though - with PowerApps, it isn't possible to "fire and forget" a request to a data source unfortunately (i.e. for the record to be auto-submitted when the device comes back online *without* coming back into the app). I'm assuming only certain apps with low-level OS integration which can perform tasks like this whilst running in the background are able to do this, and PowerApps and the Nintex mobile app (for example) are the same in this regard.

Summary

Offline support in PowerApps isn’t a simple flick of a switch, but once you know the recipe it’s not too hard. Essentially it’s a question of detecting if the device has a connection, and if not using Collect() or ClearCollect() to create a local collection and then calling SaveData() to ensure it is properly saved to the device. A PowerApps Timer control can be useful way of “auto-submitting” the data, although equally you could choose to provide users a button to explicitly click – in either case, you pick up the data from the local collection and then submit it to the data source using something like Patch() to add a database record or SharePoint list item, or Update() to update. Happy app building!