Flutter - lesson 5 | HackIndia Skills

Flutter - lesson 5 | HackIndia Skills | HackIndia

Example

Save a favourite

This example stores one saved item id. Use it inside a StatefulWidget screen. Replace item42 with your API item id.

The important part is the flow: load once, show current value, save when the user taps.

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

class FavouriteButton extends StatefulWidget {
  const FavouriteButton({super.key});

  @override
  State<FavouriteButton> createState() => _FavouriteButtonState();
}

class _FavouriteButtonState extends State<FavouriteButton> {
  static const String savedKey = 'saved_item_id';
  static const String itemId = 'item42';

  bool isSaved = false;

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

  Future<void> loadSavedState() async {
    final prefs = await SharedPreferences.getInstance();
    final savedId = prefs.getString(savedKey);

    setState(() {
      isSaved = savedId == itemId;
    });
  }

  Future<void> toggleSaved() async {
    final prefs = await SharedPreferences.getInstance();

    if (isSaved) {
      await prefs.remove(savedKey);
    } else {
      await prefs.setString(savedKey, itemId);
    }

    setState(() {
      isSaved = !isSaved;
    });
  }

  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      onPressed: toggleSaved,
      child: Text(isSaved ? 'Saved' : 'Save'),
    );
  }
}

Store data on the device

Remember this

What to store

Add persistence

Save a favourite

Avoid this

Make it testable

Do this now

Quick check