Flutter数据类生成插件data_class_plugin的使用

发布于 1周前 作者 yuanlaile 来自 Flutter

Flutter数据类生成插件 data_class_plugin 的使用

概述

Data Class Plugin 是一个由 Tachyon 驱动的代码生成工具,用于快速生成数据类、联合类型和枚举类的样板代码。它通过分析器系统解析源代码并提供代码操作(Code Actions),从而减少手动编写重复代码的工作量。

安装步骤

1. 在 pubspec.yaml 中添加依赖

dependencies:
  data_class_plugin: any

dev_dependencies:
  tachyon: any

2. 创建 tachyon_config.yaml 文件

在项目根目录下创建 tachyon_config.yaml 文件,配置文件生成路径和其他选项:

file_generation_paths: # 要包含的文件/路径
  - "lib/models"  # 示例路径
generated_file_line_length: 80  # 默认行长度

plugins:
  - data_class_plugin  # 注册 data_class_plugin

3. 更新 analysis_options.yaml

为了启用代码操作(Code Actions),需要在 analysis_options.yaml 中注册插件:

include: package:lints/recommended.yaml

analyzer:
  plugins:
    - data_class_plugin

4. 重启分析服务器

VSCode:

  1. 打开命令面板:
    • Windows/Linux: Ctrl + Shift + P
    • MacOS: ⌘ + Shift + P
  2. 输入并选择 “Dart: Restart Analysis Server”

IntelliJ/Android Studio:

  1. 打开查找操作:
    • Windows/Linux: Ctrl + Shift + A
    • MacOS: ⌘ + Shift + A
  2. 输入并选择 “Restart Dart Analysis Server”

生成代码

使用 @DataClass 注解

  1. 创建一个简单的类,并使用 @DataClass() 注解:
import 'package:data_class_plugin/data_class_plugin.dart';

@DataClass()
class User {
  String get id;
  String get username;
}

生成的代码如下:

class _$UserImpl extends User {
  _$UserImpl({
    required this.id,
    required this.username,
  }) : super.ctor();

  @override
  final String id;

  @override
  final String username;

  @override
  bool operator ==(Object? other) {
    return identical(this, other) ||
        other is User &&
            runtimeType == other.runtimeType &&
            id == other.id &&
            username == other.username;
  }

  @override
  int get hashCode {
    return Object.hashAll(<Object?>[
      runtimeType,
      id,
      username,
    ]);
  }

  @override
  String toString() {
    String toStringOutput = 'User{<optimized out>}';
    assert(() {
      toStringOutput = 'User@<$hexIdentity>{id: $id, username: $username}';
      return true;
    }());
    return toStringOutput;
  }

  @override
  Type get runtimeType => User;
}
  1. 运行 IDE 的代码操作:
  • VSCode: Ctrl + . (Windows/Linux) 或 ⌘ + . (MacOS)
  • IntelliJ: Alt + Enter (Windows/Linux) 或 ⌘ + Enter (MacOS)
  1. 选择 “Generate data/union classes” 来生成代码。

使用 @Enum 注解

  1. 创建一个枚举并使用 @Enum() 注解:
@Enum()
enum Category {
  science,
  sports;
}
  1. 运行代码操作并选择 “Generate enum” 来生成方法。

使用 @Union 注解

  1. 创建一个联合类型并使用 @Union() 注解:
@Union()
abstract class Result<T> {
  const factory Result.success(T value) = Success<T>;
  const factory Result.failure(String message) = Failure;
}

class Success<T> extends Result<T> {
  final T value;

  Success(this.value);
}

class Failure extends Result {
  final String message;

  Failure(this.message);
}
  1. 运行代码操作并选择 “Generate union classes” 来生成代码。

配置

可以通过创建 data_class_plugin_options.yaml 文件来自定义生成的代码。以下是配置示例:

auto_delete_code_from_annotation: true  # 是否自动删除注解生成的代码

json:
  key_name_convention: snake_case  # 设置默认的 JSON 键命名约定

  key_name_conventions:
    snake_case:
      - "lib/models/**"  # 应用到特定路径

data_class:
  options_config:
    copy_with:
      default: true
      enabled:
        - "lib/models/**"
      disabled:
        - "lib/models/exclude/**"

示例 Demo

以下是一个完整的示例,展示如何使用 data_class_plugin 来生成数据类、枚举和联合类型的代码。

示例代码

数据类 (User)

import 'package:data_class_plugin/data_class_plugin.dart';

@DataClass()
class User {
  String get id;
  String get username;
}

运行代码操作后,生成的实现类将包含构造函数、等式运算符、哈希值、字符串表示等。

枚举 (Category)

@Enum()
enum Category {
  science,
  sports;
}

运行代码操作后,生成的方法包括 fromJsontoJson 等。

联合类型 (Result)

@Union()
abstract class Result<T> {
  const factory Result.success(T value) = Success<T>;
  const factory Result.failure(String message) = Failure;
}

class Success<T> extends Result<T> {
  final T value;

  Success(this.value);
}

class Failure extends Result {
  final String message;

  Failure(this.message);
}

运行代码操作后,生成的方法包括 when 方法等。

总结

data_class_plugin 是一个强大的代码生成工具,能够帮助开发者减少重复代码的编写工作,提高开发效率。通过合理配置和使用,可以显著提升项目的可维护性和扩展性。


更多关于Flutter数据类生成插件data_class_plugin的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter数据类生成插件data_class_plugin的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,以下是一个关于如何在Flutter项目中使用data_class_plugin插件来生成数据类的示例。这个插件可以自动化生成Dart的数据类代码,从而节省开发时间并减少手动编码错误。

步骤 1: 添加依赖

首先,你需要在pubspec.yaml文件中添加data_class_generator依赖(注意,实际插件名称可能会有所不同,因为data_class_plugin不是一个广泛认可的插件名。这里我们假设有一个名为data_class_generator的插件):

dependencies:
  flutter:
    sdk: flutter
  # 其他依赖...

dev_dependencies:
  build_runner: ^2.1.4
  data_class_generator: ^x.y.z  # 替换为实际的版本号

步骤 2: 创建数据模型JSON文件

在你的项目根目录或assets文件夹中创建一个JSON文件,比如data_model.json,定义你的数据模型结构:

{
  "name": "User",
  "fields": [
    {"name": "id", "type": "int"},
    {"name": "name", "type": "String"},
    {"name": "email", "type": "String", "nullable": true}
  ]
}

步骤 3: 生成数据类

在你的项目根目录下,运行以下命令来生成数据类:

flutter pub run build_runner build

这个命令会根据你提供的JSON文件生成相应的Dart数据类文件。假设生成的类文件名为user.dart,其内容可能类似于:

// 这个文件是自动生成的,不要手动编辑
part of 'data_models.dart';

class User {
  final int id;
  final String name;
  final String? email;

  User({
    required this.id,
    required this.name,
    this.email,
  });

  factory User.fromJson(Map<String, dynamic> json) {
    return User(
      id: json['id'] as int,
      name: json['name'] as String,
      email: json['email'] as String?,
    );
  }

  Map<String, dynamic> toJson() {
    return {
      'id': id,
      'name': name,
      'email': email,
    };
  }
}

注意:实际生成的代码可能会根据插件版本和配置有所不同。

步骤 4: 使用生成的数据类

现在你可以在你的Flutter项目中使用这个生成的数据类了。例如,在一个假设的user_service.dart文件中:

import 'package:flutter/material.dart';
import 'user.dart'; // 导入生成的数据类

class UserService {
  Future<User?> fetchUser(int userId) async {
    // 模拟一个网络请求
    await Future.delayed(Duration(seconds: 1));
    return User(
      id: userId,
      name: 'John Doe',
      email: 'john.doe@example.com',
    );
  }
}

在你的UI组件中使用这个服务:

import 'package:flutter/material.dart';
import 'user_service.dart';
import 'user.dart'; // 导入生成的数据类

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: UserScreen(),
    );
  }
}

class UserScreen extends StatefulWidget {
  @override
  _UserScreenState createState() => _UserScreenState();
}

class _UserScreenState extends State<UserScreen> {
  User? user;

  @override
  void initState() {
    super.initState();
    final userService = UserService();
    userService.fetchUser(1).then((u) => setState(() => user = u));
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('User Info')),
      body: Center(
        child: user == null
            ? CircularProgressIndicator()
            : Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text('ID: ${user!.id}'),
                  Text('Name: ${user!.name}'),
                  Text('Email: ${user!.email ?? 'N/A'}'),
                ],
              ),
      ),
    );
  }
}

以上就是一个完整的示例,展示了如何在Flutter项目中使用data_class_generator(或类似插件)来自动生成数据类,并在应用中使用这些数据类。请确保根据实际的插件文档和配置调整代码。

回到顶部