Implementing Offline Capabilities in Microsoft Power Apps

Spyglass recently helped a large manufacturer of medical devices to create a solution for their urology products. The solution is developed using Microsoft Power Apps and SharePoint Online. The Power app developed for urology devices is meant to be used by medical professionals on their mobile devices.

The offline capability of this app makes medical professionals productive even when they have limited or no connectivity to the internet.

Following are the key functions of this Power App:

• On very first use, open Power Apps Mobile and run app when online.
• On subsequent usage, Open Power Apps Mobile and run app when online or offline.
• Determine when an app is online or offline by using the “Connection” signal object.
• Use collections and leverage the LoadData and SaveData functions for basic data storage when offline.

When we designed offline scenarios, we first considered how the app work with data which is stored in SharePoint online lists. This Power App primarily access the data through a connector to SharePoint Online. In other scenarios, the connectors could be any of over 100 connectors available in Power Apps such as Office 365, Microsoft Dataverse, and custom connectors that enables the apps to access any services that provides a RESTful endpoint.

On the first use, as per the requirements, this app needs to read the data from SharePoint online lists hence the user must be online either on WIFI or on cellular data. On subsequent usage, the user can go offline, and the app would still function as expected through the use of Power App collections for offline capabilities. If there is any change in the SharePoint lists data, the user must go online again for the app to refresh the data.

To determine when an app is online or offline, the “Connection” signal object is used. In following two snapshots, the online and offline status is shown by the signal indicator image

In Power Apps, we can filter, search, sort, aggregate, and manipulate data in a consistent way regardless of the data source. For offline scenarios, we use local collections for data management with almost no changes to the app's logic. In fact, local collections are the primary mechanism for handling offline data.

As far as the offline aspects of app development is concerned, following screenshots shows a simple scenario of collecting the data from the data source. And then save the data to local collections and then load data back to collection for offline use.

At a high level, the app performs these tasks:

• When the user opens the app:
  • If the device is online (required for first use), the app fetches data through SharePoint connector and populates a local collection with that data using SaveData function.
  • If then device goes offline, the app loads the data from a local collection and perform the operations by using the LoadData
• When data modified at source:
  • The app needs to go online again to refresh the data
  • The app refreshes the local cache and saves it by using the SaveData function again.

When the app starts, it shows a spinner while it connects to SharePoint online and loads all the data. To make the loading process faster, the concurrent loading is used.

Test the app

1. Open the app using Power Apps Mobile on a mobile device that's connected to the Internet. You will see a spinner while app is connecting to SharePoint and loading the data. The online status will be shown by this image – 
   
   
2. Disconnect the device from the Internet by enabling the device's airplane mode and disabling wi-fi.

The online status image will switch to Offline.    

3. Test all the features of the app in Offline mode and everything should work as intended.
4. Reconnect the device to the Internet by disabling the device's airplane mode and enabling wi-fi. Any changes to data source at this point would reflect in the app on subsequent use.

If you have any questions about this offline capability or others that we can help you with, contact us today!