Building Offline PowerApps

[darogael]

Introduction
This blog focuses on the on offline capability of PowerApps. Here you'll see the key features you need to add to your PowerApp in order to take input when there is no internet connection available and automatically upload it to your data connection. This written blog explains the features and the formulas/expressions used. The video deep-dives in the entire process. A copy of this app is attached to this blog.

Description
Following are the three key features that makes the offline features of PowerApps success.

 1. Online or offline connection by using the Connection signal object.
 2. Using SaveData and LoadData for basic data storage while offline.
 3. Collections to store data temporarily

Scenario
This mobile app is used to store a contact information of the user in Azure SQL database. The user should be able to simply enter the data and close the app.

Key features

SQL table columns
Here is a screenshot of the columns used in the SQL table and the column types. If you plan copying and pasting the below formulas then match the column names and types. Attached a text file that has the SQL query you can run to create the table. Instead of SQL you use a SharePoint list as well, however, the column names and types will change.

Formulas
This section covers the important formulas you will need for the app to work.

HomeScreen OnStart

Screenshot

Text

LoadData(TempCollect,"temporary",true);
If(!IsEmpty(TempCollect.ColFullName),
    "If the connection returns and there are records to be written, then perform these actions:";
    ForAll(TempCollect,
            "For each of the records in the temporary collection, save their data to a new row in the connected datasource.
        If writing was successful, copy it to 'success' to identify it.";
        Collect(Success,
            {id: Colid,
                Record:                    
Patch('[dbo].[OfflineOnlineTest]',Defaults('[dbo].[OfflineOnlineTest]'),
{
FullName:ColFullName,Street:ColStatus,City:ColCity,State:ColState,Status:"Online",Notes:ColNotes
}
                    )
            }
        )
    )
);
If(IsEmpty(Errors('[dbo].[OfflineOnlineTest]')),Clear(TempCollect));SaveData(TempCollect,"temporary")

AddScreen OnSelect for yes button

Screenshot

Text

If(Connection.Connected,
Patch('[dbo].[OfflineOnlineTest]',Defaults('[dbo].[OfflineOnlineTest]'),{
FullName:FullNameTxt.Text,Street:StreetTxt.Text,City:CityTxt.Text,State:StateTxt.Text,Status:"Online",Notes:NotesTxt.Text
}),
Collect(TempCollect,{
Colid: Max(TempCollect,Colid)+1,
ColFullName:FullNameTxt.Text,ColStreet:StreetTxt.Text,ColCity:CityTxt.Text,ColState:StateTxt.Text,ColStatus:"Offline",ColNotes:NotesTxt.Text
}
);
SaveData(TempCollect,"temporary")
);
Reset(FullNameTxt);Reset(StreetTxt);Reset(CityTxt);Reset(StateTxt);Reset(NotesTxt);Set(SubmitVar,false);
Navigate(HomeScreen,ScreenTransition.Cover)

Video

 
Conclusion

The attached zipped file has a copy of the MSAPP file and the SQL query you can use. It is important to note that the cached data will be lost every time an updated app is published. Also the size of the PowerApps app on your mobile device will increase as more cached data is stored.

Links

Develop Offline-Capable Canvas Apps

Build offline apps with new PowerApps capabilities

OfflineOnlineTest.zip

[sajarac]

Hi there, I was wondering if you can help me out adding offline capability to my app? I am willing to pay, my app has around 13 collections.

[Anastasiia]

Hello. Can we in the function SaveData save picture Url in to the cash, when there is no connection?

Thank you

[APICHE]

Very good post! How would I go editing some records?

Lest say i select an item from the gallery to edit it while I lose my connection?

I have seen some approches that use Timers.... 

Do I use the same collection?