{

Dart/Flutter: How to Convert Map to/from List of Objects


In Dart or Flutter Maps and List are predefined data structure types used to store collections.

The map contains key and value pairs of elements The list contains a collection of elements.

Automatic conversion is not possible from Map to List or List to Map.

We have to manually convert from Map to List or vice versa. How to Convert list and Map of objects key and values Dart and Flutter

There are multiple ways to convert from Map to List.

For example, Let’s create an Employee Class

class Employee {
  final int id;
  final String name;
  final int salary;
  final DateTime joinDate;

  Employee(this.id, this.name, this.salary, this.joinDate);
  @override
  String toString() {
    return '{id: ${id}, name: ${name}}';
  }

  Map<String, dynamic> toJson() =>
      {"id": id, "name": name, "salary": salary, "doj": joinDate.toString()};
}

Let’s create Map<int, Employee> and add some data to it.

import 'dart:convert';

class Employee {
  final int id;
  final String name;
  final int salary;
  final DateTime joinDate;

  Employee(this.id, this.name, this.salary, this.joinDate);
  @override
  String toString() {
    return '{id: ${id}, name: ${name}}';
  }

  Map<String, dynamic> toJson() =>
      {"id": id, "name": name, "salary": salary, "doj": joinDate.toString()};
}

void main() {
  final e1 =
      Employee(11, 'Erwin', 9000, DateTime.parse("2020-06-21 00:00:00.000"));
  final e2 =
      Employee(21, 'Andrew', 70000, DateTime.parse("2021-07-23 00:00:00.000"));
  final e3 =
      Employee(4, 'Mark', 8000, DateTime.parse("2017-08-24 00:00:00.000"));
  final e4 =
      Employee(12, 'Otroc', 5000, DateTime.parse("2022-12-05 00:00:00.000"));

  final Map<int, Employee> employees = {
    e1.id: e1,
    e2.id: e2,
    e3.id: e3,
    e4.id: e4
  };

  print(employees); 
}

Output:

{11: {id: 11, name: Erwin}, 21: {id: 21, name: Andrew}, 4: {id: 4, name: Mark}, 12: {id: 12, name: Otroc}}

Next, see how we can convert Map to a List of keys and values.

How to Convert Map of objects into List in Flutter and dart?

The map contains key and value pairs, So we can convert keys and values into a List.

Convert Map of values to List of objects example

Map.values property returns the Iterable class, Convert it to List using toList() Employees map contains values of Employee Type, hence it returns List<Employee> type

  var listValues = employees.values.toList();
  print(listValues);
  print(listValues.runtimeType);
[{id: 11, name: Erwin}, {id: 21, name: Andrew}, {id: 4, name: Mark}, {id: 12, name: Otroc}]
JSArray<Employee>

Convert Map of Key to List of elements example

Map.values property returns the Iterable class, Convert it to List using toList() Employees map contains keys of int Type, hence it returns int type

  var listKeys = employees.keys.toList();
  print(listKeys);
  print(listKeys.runtimeType);
[11, 21, 4, 12]
JSArray<int>

How to Convert List of objects into Map in Flutter and dart?

There are multiple ways we can convert to List from Map.

First way, Map.fromIterable() method iterates and creates a key and values from a list.

  var result = Map.fromIterable(employees,
      key: (element) => element.id, value: (element) => element);
  print(
      result); //{11: {id: 11, name: Erwin}, 21: {id: 21, name: Andrew}, 4: {id: 4, name: Mark}, 12: {id: 12, name: Otroc}}
  print(result.runtimeType); // JsLinkedHashMap<dynamic, dynamic>

It returns Map<dynamic, dynamic> and it is not recommended due to type safety.

The second way, using the collection for

  var result1 = {for (var value in employees) value.id: value};
  print(
      result1); //{11: {id: 11, name: Erwin}, 21: {id: 21, name: Andrew}, 4: {id: 4, name: Mark}, 12: {id: 12, name: Otroc}}

  print(result1.runtimeType); //JsLinkedHashMap<int, Employee> 

It returns the exact type Map<int, Employee> , Which is the recommended way to do it.

You can check more ways to convert List to Map

Here is a complete example code

import 'dart:convert';

class Employee {
  final int id;
  final String name;
  final int salary;
  final DateTime joinDate;

  Employee(this.id, this.name, this.salary, this.joinDate);
  @override
  String toString() {
    return '{id: ${id}, name: ${name}}';
  }

  Map<String, dynamic> toJson() =>
      {"id": id, "name": name, "salary": salary, "doj": joinDate.toString()};
}

void main() {
  final e1 =
      Employee(11, 'Erwin', 9000, DateTime.parse("2020-06-21 00:00:00.000"));
  final e2 =
      Employee(21, 'Andrew', 70000, DateTime.parse("2021-07-23 00:00:00.000"));
  final e3 =
      Employee(4, 'Mark', 8000, DateTime.parse("2017-08-24 00:00:00.000"));
  final e4 =
      Employee(12, 'Otroc', 5000, DateTime.parse("2022-12-05 00:00:00.000"));

  List<Employee> employees = [e1, e2, e3, e4];

  print(employees); //
  var result = Map.fromIterable(employees,
      key: (element) => element.id, value: (element) => element);
  print(
      result); //{11: {id: 11, name: Erwin}, 21: {id: 21, name: Andrew}, 4: {id: 4, name: Mark}, 12: {id: 12, name: Otroc}}

  print(result.runtimeType); // JsLinkedHashMap<dynamic, dynamic>

  var result1 = {for (var value in employees) value.id: value};
  print(
      result1); //{11: {id: 11, name: Erwin}, 21: {id: 21, name: Andrew}, 4: {id: 4, name: Mark}, 12: {id: 12, name: Otroc}}

  print(result1.runtimeType); //JsLinkedHashMap<int, Employee>
}

Conclusion

To summarize shows multiple ways to convert List to map and map to list with examples.

THE BEST NEWSLETTER ANYWHERE
Join 6,000 subscribers and get a daily digest of full stack tutorials delivered to your inbox directly.No spam ever. Unsubscribe any time.

Similar Posts
Subscribe
You'll get a notification every time a post gets published here.





Related posts

Dart| Flutter How to: Read pubspec.yaml attributes (version) with examples

How to Create and build a Singleton Class Dart or Flutter example| Dart By Example

What is the difference between var and dynamic and final in dart?| Flutter By Example

How to: Check if Phone number is valid or not in Dart| Flutter By Example

Dart| Flutter How to read an image from a disk and resize a file

Dart/Flutter: How to write setter and getter fields or members variables in a class with Example

Dart| Flutter How to get extension name and MIME type of a file with example