Flutter Как использовать заморозку

Здравствуйте, прежде чем мы начнем, эта статья является продолжением предыдущего поста, посвященного flutter mvvm с использованием provider, injectable и freeze.
MVVM Часть 1
MVVM часть 2
Код проекта здесь…

Эта статья будет посвящена тому, как реализовать заморозку шаг за шагом.

Содержание

Итак, как использовать заморозку.
Посмотрите, как построен класс
Посмотрите на импорт
Давайте сгенерируем код.

Итак, как использовать заморозку.

Во-первых… в вашем pubspec.yaml в секции dependencies нужно установить (пожалуйста, не обращайте внимания на версию, используйте последнюю)

dependencies:
  flutter:
    sdk: flutter
  freezed: ^2.1.0+1
  freezed_annotation: ^2.1.0

Войдите в полноэкранный режим Выйти из полноэкранного режима

и в разделах dev_dependencies, которые вы должны установить

dev_dependencies:
  build_runner: ^2.2.0 //Generating implementation code
  flutter_test:
    sdk: flutter
  json_serializable: ^6.3.1 //Make serializable object(to/from) json

Войдите в полноэкранный режим Выйти из полноэкранного режима

и вот пример кода

import 'package:freezed_annotation/freezed_annotation.dart';
part 'task_model.freezed.dart';
part 'task_model.g.dart';

@freezed
class TaskModel with _$TaskModel {
  factory TaskModel({
    required final String title,
    required final String description,
    @Default(false) bool isDone,
  }) = _TaskModel;

  factory TaskModel.fromJson(Map<String, dynamic> json) =>
      _$TaskModelFromJson(json);
}

Войти в полноэкранный режим Выйти из полноэкранного режима

Теперь давайте разобьем его на части,

Посмотрите, как построен класс

@freezed
//This _$TaskModel is not autoGenerated you have to construct
//it manually using this format _${{ClassName}}
class TaskModel with _$TaskModel {
//for this section, you just have to follow these line
/* using this format
  factory {{ClassName}}({
   Declare all the fields here..
  }) = _{{ClassName}}
*/
  factory TaskModel({
    required final String title,
    required final String description,
    @Default(false) bool isDone,
  }) = _TaskModel;

//Allow your object to be serializable. can do mutation
//fromJson or toJson.
  factory TaskModel.fromJson(Map<String, dynamic> json) =>
      _$TaskModelFromJson(json);
//this Factory fromJson method is not autogenerated
// so you have to declare it manually with thisFormat
//  factory {{ClassName}}.fromJson(Map<String, dynamic> json) =>
//      _${{ClassName}}FromJson(json);


}

Вход в полноэкранный режим Выход из полноэкранного режима

до этого момента… ваш код будет везде КРАСНЫМ… хаха не волнуйтесь посмотрите на импорт

Посмотрите на импорт

Чтобы иметь возможность использовать @freezed или @unfreezed вы должны импортировать это

import 'package:freezed_annotation/freezed_annotation.dart';

Вход в полноэкранный режим Выйти из полноэкранного режима

и затем вы должны импортировать следующее

part 'task_model.freezed.dart';
//this import can be very depend on the class name
//so the format will be
//part '{{className}}.freezed.dart';

Войти в полноэкранный режим Выйти из полноэкранного режима

этот импорт позволит вам иметь immutable или mutable способность этой модели.

переходим к следующему.
Вы должны импортировать следующее

part 'task_model.g.dart';
//this import are important because it makes your object are serializable.
//see the fromJson method in code above. without this import it will not run

Войти в полноэкранный режим Выйти из полноэкранного режима

до этого момента… ваш код будет везде КРАСНЫМ… хаха не волнуйтесь посмотрите на генерацию кода…

Давайте сгенерируем код.

Прежде чем мы начнем, убедитесь, что вы уже настроили свой pubspec.yaml, как уже упоминалось в первом разделе этой статьи.

Теперь попросим бегунок сборки создать класс реализации нашей модели…

убедитесь, что вы уже выполнили flutter pub get для установки pubspec.yaml

затем выполните эту команду

flutter pub run build_runner build --delete-conflicting-outputs

Войти в полноэкранный режим Выйти из полноэкранного режима

и после ее выполнения она должна сгенерировать файл реализации следующим образом.

и вот так… теперь вы можете взглянуть на свой класс модели, там больше не будет красного цвета.

хаха спасибо!!!.