How to Store Data Locally in Flutter: Simple Guide

To store data locally in Flutter, use the shared_preferences package which saves simple key-value pairs on the device. This lets your app remember small data like user settings or login status even after closing the app.

Syntax

The shared_preferences package provides methods to save and read data using keys. You first get an instance of SharedPreferences, then use methods like setString(key, value) to save and getString(key) to read data.

Common data types supported include String, int, bool, double, and List<String>.

dart

final prefs = await SharedPreferences.getInstance();
await prefs.setString('username', 'Alice');
String? name = prefs.getString('username');

Example

This example shows a Flutter app that saves a username locally and retrieves it when the app starts. It uses a button to save the name and displays the saved name on screen.

dart

import 'package:flutter/material.dart';
import 'package:shared_preferences/shared_preferences.dart';

void main() => runApp(MyApp());

class MyApp extends StatefulWidget {
  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  String _savedName = '';

  @override
  void initState() {
    super.initState();
    _loadName();
  }

  Future<void> _loadName() async {
    final prefs = await SharedPreferences.getInstance();
    setState(() {
      _savedName = prefs.getString('username') ?? 'No name saved';
    });
  }

  Future<void> _saveName() async {
    final prefs = await SharedPreferences.getInstance();
    await prefs.setString('username', 'Alice');
    _loadName();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Local Storage Example')),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text('Saved Name: $_savedName'),
              SizedBox(height: 20),
              ElevatedButton(
                onPressed: _saveName,
                child: Text('Save Name'),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

Output

App screen shows: "Saved Name: No name saved" initially. After pressing 'Save Name' button, it updates to "Saved Name: Alice".

Common Pitfalls

Common mistakes when using shared_preferences include:

• Not awaiting SharedPreferences.getInstance() before use, causing null or errors.
• Trying to store complex objects directly instead of simple types.
• Forgetting to call setState() after loading data, so UI does not update.

Always store only supported simple types and reload data properly to update UI.

dart

/* Wrong way: Not awaiting instance */
final prefs = SharedPreferences.getInstance(); // Missing await
await prefs.setString('key', 'value'); // Error

/* Right way: */
final prefs = await SharedPreferences.getInstance();
await prefs.setString('key', 'value');

Quick Reference

Here is a quick summary of key methods in shared_preferences:

Method	Description
getInstance()	Gets the shared preferences instance asynchronously
setString(key, value)	Saves a string value with the given key
getString(key)	Retrieves a string value by key, or null if not found
setInt(key, value)	Saves an integer value
getInt(key)	Retrieves an integer value
setBool(key, value)	Saves a boolean value
getBool(key)	Retrieves a boolean value
remove(key)	Deletes the value for the given key

Key Takeaways

Use the shared_preferences package to store simple key-value data locally in Flutter.

Always await SharedPreferences.getInstance() before reading or writing data.

Store only simple data types like String, int, bool, double, or List.

Call setState() after loading data to update the UI with stored values.

Avoid storing complex objects directly; convert them to strings if needed.