Flutter — Data Persistence with SharedPreferences (in JSON)
So you want to save your data permanently on your Flutter App but you don’t want to use a database?
That’s where the SharedPreferences package comes in. You can save key pair values in String format, but that’s not the only thing you can do. You can save data in JSON format, which is a lot more useful. How can I do that, you ask? Well, let’s find out.
Interested in more Flutter articles? https://morthor.medium.com/flutter-animatedlist-sizetransition-dismissible-dce49c11200d
Installing the package
Visit pub.dev to find the latest version of the SharedPreferences package and copy it into your pubspec.yaml. Don’t forget to run flutter pub get to install your new package. If you already had your app running, you may need to rebuild it:
Importing the package
Once you have it installed, you should make sure it’s imported in the file that you need it in:
Using the package
You need to declare and instantiate SharedPreferences in the class you need to use it in. I would advise you to use a StatefulWidget to be able to instantiate it only once in the initState override and re-use it as needed.
Because SharedPreferences needs an async call to get it’s instance, you need use a separate method and call it from initState:
Setting and getting Strings into SharedPreferences
To keep your code properly separated, lets write a couple of methods to set and get strings from SharedPreferences.
Our first method, to save a String into SharedPreferences, will require two strings, key and value. It checks if those strings are not empty, and if so, call the setString method of SharedPreferences to save it permanently:
Our second method, to load a String from SharedPreferences, will only require the key of the value we want to retrieve, but we will do several checks to make sure we aren’t returning any null values:
Using JSON with SharedPreferences
Now that we know how to set and get Strings in SharedPreferences, let’s use JSON to save some more complex data. To do so, we will use jsonencode from the dart:convert library that comes in the Flutter SDK as part of Dart. We will be converting Dart Maps into Strings with jsonencode.
You can learn more about JSON serialization in Dart here.
To save a Map in SharedPreferences we just need to convert the Map into a String with jsonencode. Our method will take the Map we want to save and the String as the key we want to save it under:
Now let’s load JSON data from SharedPreferences. Out method will take int the key we save our data under, retrieve it from SharedPreferences, check if the String is not null or empty, decode it from a String to a Map, and return it:
Take the following code in a theoretical Widget with text fields and a button as an example of how you can save data in JSON format in SharedPreferences. We are taking the first and last name from two TextFormFields, putting them in Map format, and saving them with our saveMapToSP method:
Full code
You can find all the code in this article on a GitHub gist: https://gist.github.com/Morthor/6f33ab8b7a2aac808ebf89181206dae3
