Saving the users icon input to shared preferences

Question

I am still struggling to save an iconData to the devices storage for my to-do app, I get this error:

Converting object to an encodable object failed: Instance of 'IconData'

in the debug console while adding the to-do item.

If I take out the iconData, the To-Do item is saving correctly, and when I put it back in, I get that error.

import 'package:flutter/foundation.dart';

class ToDo{
  final String id;
  final String title;
 
 
  final IconData icon;
  

  const ToDo({
    @required this.id, 
    @required this.title,
    @required this.icon,
    
  });

  Category.fromMap(
    Map map,
  )   :
      
        this.id = map['id'],
        this.title = map['title'],
        this.icon = map['icon'],
       

  Map toMap() {
    return {  
      'id': this.id,
      'title': this.title,
      'icon': this.icon,
      
    };
  }
  
}

and in my main script I have

  List<ToDo> _userToDo = List<ToDO>();

  SharedPreferences sharedPreferences;
  @override
  void initState() {
    initSharedPreferences();
    super.initState();
  }

  initSharedPreferences() async {
    sharedPreferences = await SharedPreferences.getInstance();
    loadDataTodo();
    
  }

  void saveDataTodo() {
    List<String> spList = _userTodo
        .map((todo) => json.encode(todo.toMap()))
        .toList();
    sharedPreferences.setStringList(todo, spList);
  }

  void loadDataTodo() {
    List<String> spList = sharedPreferences.getStringList(todo);
    _userTodo = spList
        .map((todo) => todo.fromMap(json.decode(todo)))
        .toList();
    setState(() {});
  }

Please help me - I am new to flutter

Solution

IconData needs

• int codePoint;
• String fontFamily;
• String fontPackage;
• bool matchTextDirection;

You can save those to your storage and use them to (re)create your IconData.

Like this:

Category.fromMap(
    Map map,
  )   :
      
        this.id = map['id'],
        this.title = map['title'],
        this.icon = IconData(icon: map['codePoint'],
                      fontFamily: map['fontFamily'],
                      fontPackage: map['fontPackage'],
                      matchTextDirection: map['matchTextDirection'],
                    ),
),
       

  Map toMap() {
    return {  
      'id': this.id,
      'title': this.title,
      'codePoint': this.icon.codePoint,
      'fontFamily': this.icon.fontFamily,
      'fontPackage': this.icon.fontPackage,
      'matchTextDirection': this.icon.matchTextDirection,
      
    };
  }

Comments

[Tipu Sultan]

Do you use only materiel Icon or Coustom Icon?

[Chad]

only material Icon

[Er1]

You can do that for color the same way in fromMap this.color = Color(map['colorValue']) and in toMap 'colorValue': this.color.value,