Local Data Storage with Shared Preferences Flutter

What You’ll Learn 📚

• Understanding what Shared Preferences are and why they’re useful
• How to implement Shared Preferences in a Flutter app
• Step-by-step examples from simple to complex
• Troubleshooting common issues

Introduction to Shared Preferences

Shared Preferences is a simple way to store data in key-value pairs on a device. It’s perfect for saving small amounts of data, like user settings or app preferences. Think of it like a tiny notepad your app can use to remember things! 📝

Key Terminology

• Key-Value Pair: A way to store data where each piece of data (value) is associated with a unique identifier (key).
• Local Storage: Data storage that happens on the user’s device, not on a server.

Getting Started: The Simplest Example

import 'package:flutter/material.dart';import 'package:shared_preferences/shared_preferences.dart';void main() {  runApp(MyApp());}class MyApp extends StatelessWidget {  @override  Widget build(BuildContext context) {    return MaterialApp(      home: Scaffold(        appBar: AppBar(title: Text('Shared Preferences Example')),        body: PreferenceDemo(),      ),    );  }}class PreferenceDemo extends StatefulWidget {  @override  _PreferenceDemoState createState() => _PreferenceDemoState();}class _PreferenceDemoState extends State {  String _savedValue = '';  @override  void initState() {    super.initState();    _loadSavedValue();  }  _loadSavedValue() async {    SharedPreferences prefs = await SharedPreferences.getInstance();    setState(() {      _savedValue = prefs.getString('my_key') ?? 'No value saved!';    });  }  _saveValue() async {    SharedPreferences prefs = await SharedPreferences.getInstance();    prefs.setString('my_key', 'Hello, Flutter!');    _loadSavedValue();  }  @override  Widget build(BuildContext context) {    return Center(      child: Column(        mainAxisAlignment: MainAxisAlignment.center,        children: [          Text('Saved Value: $_savedValue'),          ElevatedButton(            onPressed: _saveValue,            child: Text('Save Value'),          ),        ],      ),    );  }}

Progressively Complex Examples

Example 2: Saving and Retrieving Integers

// Similar setup as Example 1, but with integer values

Example 3: Using Shared Preferences for User Settings

// Example code for managing user settings

Example 4: Handling Multiple Data Types

// Example code for storing different data types

Common Questions and Answers

1. What is Shared Preferences used for? – It’s used for storing small amounts of data locally on the device.
2. Can I store complex objects? – Shared Preferences is best for simple data types like strings and numbers.
3. Is Shared Preferences secure? – It’s not encrypted, so avoid storing sensitive information.

Troubleshooting Common Issues

If you’re not seeing your saved data, ensure you’re calling setState to update the UI after loading data.

Remember, practice makes perfect! Try modifying the examples and see what happens. 😊

Practice Exercises

• Create a settings page that uses Shared Preferences to toggle dark mode.
• Store and retrieve a list of favorite items using Shared Preferences.

For more information, check out the official documentation.