Flutter架构设计与命令行工具插件architecture_cli的使用
Flutter架构设计与命令行工具插件architecture_cli的使用
architecture_cli
是一个命令行界面工具,用于在Dart项目中生成不同软件架构模式的文件夹结构。它为每个文件夹提供了预期用途的指导,以促进良好的设计和关注点分离。
注意:如果存在`lib`目录,则架构将在`lib`目录内创建;否则,将在根目录创建。
支持的架构
architecture_cli
目前支持以下软件架构模式:
- MVC(模型-视图-控制器)
- MVVM(模型-视图-视图模型)
- MVP(模型-视图-展示器)
- 清洁架构
- 提供者架构
- GetX架构
- BLoC(业务逻辑组件)架构
- 仅BLoC结构
安装
您可以通过运行以下命令从 pub.dev
安装 architecture_cli
:
dart pub global activate architecture_cli
使用方法
要创建一个新的架构结构,请运行以下命令:
architecture_cli --create [name]
或者,您可以使用以下命令之一:
folder_cli --create [name]
arch_cli --create [name]
其中 [name]
是所需架构模式的名称。例如:
architecture_cli --create mvc
在生成架构结构后,您会在生成的文件夹结构中找到一个Markdown文件,该文件提供了每个文件夹的预期用途指南。
示例
以下是您可以使用的生成不同架构模式的命令的一些示例:
- 生成GetX架构结构:
architecture_cli --create getx
- 生成清洁架构结构:
architecture_cli --create clean_architecture
- 生成MVP架构结构:
architecture_cli --create mvp
- 生成提供者架构结构:
architecture_cli --create provider
- 生成BLoC结构:
architecture_cli --create bloc
- 生成BLoC应用结构:
architecture_cli --create bloc_app
支持
如果您觉得这个包对您有帮助,请考虑请我喝杯咖啡!
感谢您的支持!
— 马德·帕维兹
— 访问 devhammad.com
示例代码
示例/README.md
激活架构CLI
dart pub global activate architecture_cli
查看可用命令列表
architecture_cli --help
arch_cli --help
folder_cli --help
更多关于Flutter架构设计与命令行工具插件architecture_cli的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
更多关于Flutter架构设计与命令行工具插件architecture_cli的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
当然,下面是一个关于如何在Flutter项目中进行架构设计,并使用一个假想的命令行工具插件architecture_cli
来辅助这一过程的示例。由于architecture_cli
是一个假想的插件,我会基于常见的Flutter架构设计和命令行工具的使用方式来展示相关代码和流程。
Flutter 架构设计
Flutter应用通常遵循MVVM(Model-View-ViewModel)或BLoC(Business Logic Component)等架构模式。以下是一个简单的MVVM架构示例:
1. Model层
定义数据模型。
// models/user.dart
class User {
final String id;
final String name;
final String email;
User({required this.id, required this.name, required this.email});
factory User.fromJson(Map<String, dynamic> json) {
return User(
id: json['id'] as String,
name: json['name'] as String,
email: json['email'] as String,
);
}
Map<String, dynamic> toJson() {
return {
'id': id,
'name': name,
'email': email,
};
}
}
2. ViewModel层
处理业务逻辑和数据绑定。
// viewmodels/user_view_model.dart
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'models/user.dart';
class UserViewModel with ChangeNotifier {
List<User> _users = [];
List<User> get users => _users;
void fetchUsers() async {
// 模拟从API获取数据
final usersJson = [
{'id': '1', 'name': 'Alice', 'email': 'alice@example.com'},
{'id': '2', 'name': 'Bob', 'email': 'bob@example.com'},
];
final users = usersJson.map((json) => User.fromJson(json)).toList();
_users = users;
notifyListeners();
}
}
3. View层
定义用户界面。
// views/user_list.dart
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'viewmodels/user_view_model.dart';
import 'models/user.dart';
class UserList extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('User List')),
body: Consumer<UserViewModel>(
builder: (context, userViewModel, child) {
return userViewModel.users.isEmpty
? Center(child: CircularProgressIndicator())
: ListView.builder(
itemCount: userViewModel.users.length,
itemBuilder: (context, index) {
final user = userViewModel.users[index];
return ListTile(
title: Text(user.name),
subtitle: Text(user.email),
);
},
);
},
),
floatingActionButton: FloatingActionButton(
onPressed: () {
context.read<UserViewModel>().fetchUsers();
},
tooltip: 'Fetch Users',
child: Icon(Icons.refresh),
),
);
}
}
4. Main入口
将ViewModel提供给应用。
// main.dart
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'views/user_list.dart';
import 'viewmodels/user_view_model.dart';
void main() {
runApp(
MultiProvider(
providers: [
ChangeNotifierProvider(create: (_) => UserViewModel()),
],
child: MyApp(),
),
);
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: UserList(),
);
}
}
使用假想的architecture_cli
插件
假设architecture_cli
是一个命令行工具,它可以帮助我们生成Flutter项目的架构文件。虽然这不是一个真实存在的插件,但我们可以想象它的使用方式,并编写一个模拟的脚本(不是Flutter代码,而是命令行脚本)来展示如何使用它。
示例命令行脚本(假设使用Bash)
#!/bin/bash
# 定义一个函数来模拟 architecture_cli 的行为
architecture_cli() {
echo "architecture_cli: Generating Flutter architecture files..."
# 创建 model 文件
echo "class User {" > lib/models/user.dart
echo " final String id;" >> lib/models/user.dart
echo " final String name;" >> lib/models/user.dart
echo " final String email;" >> lib/models/user.dart
echo "" >> lib/models/user.dart
echo " User({required this.id, required this.name, required this.email});" >> lib/models/user.dart
echo "" >> lib/models/user.dart
echo " factory User.fromJson(Map<String, dynamic> json) {" >> lib/models/user.dart
echo " return User(" >> lib/models/user.dart
echo " id: json['id'] as String," >> lib/models/user.dart
echo " name: json['name'] as String," >> lib/models/user.dart
echo " email: json['email'] as String," >> lib/models/user.dart
echo " );" >> lib/models/user.dart
echo " }" >> lib/models/user.dart
echo "" >> lib/models/user.dart
echo " Map<String, dynamic> toJson() {" >> lib/models/user.dart
echo " return {" >> lib/models/user.dart
echo " 'id': id," >> lib/models/user.dart
echo " 'name': name," >> lib/models/user.dart
echo " 'email': email," >> lib/models/user.dart
echo " };" >> lib/models/user.dart
echo " }" >> lib/models/user.dart
echo "}" >> lib/models/user.dart
echo "" >> lib/models/user.dart
# 创建 ViewModel 文件
echo "import 'package:flutter/material.dart';" > lib/viewmodels/user_view_model.dart
echo "import 'package:provider/provider.dart';" >> lib/viewmodels/user_view_model.dart
echo "import 'package:your_app_name/models/user.dart';" >> lib/viewmodels/user_view_model.dart
echo "" >> lib/viewmodels/user_view_model.dart
echo "class UserViewModel with ChangeNotifier {" >> lib/viewmodels/user_view_model.dart
echo " List<User> _users = [];" >> lib/viewmodels/user_view_model.dart
echo " List<User> get users => _users;" >> lib/viewmodels/user_view_model.dart
echo "" >> lib/viewmodels/user_view_model.dart
echo " void fetchUsers() async {" >> lib/viewmodels/user_view_model.dart
echo " // 模拟从API获取数据" >> lib/viewmodels/user_view_model.dart
echo " final usersJson = [" >> lib/viewmodels/user_view_model.dart
echo " {'id': '1', 'name': 'Alice', 'email': 'alice@example.com'}," >> lib/viewmodels/user_view_model.dart
echo " {'id': '2', 'name': 'Bob', 'email': 'bob@example.com'}," >> lib/viewmodels/user_view_model.dart
echo " ];" >> lib/viewmodels/user_view_model.dart
echo " final users = usersJson.map((json) => User.fromJson(json)).toList();" >> lib/viewmodels/user_view_model.dart
echo " _users = users;" >> lib/viewmodels/user_view_model.dart
echo " notifyListeners();" >> lib/viewmodels/user_view_model.dart
echo " }" >> lib/viewmodels/user_view_model.dart
echo "}" >> lib/viewmodels/user_view_model.dart
echo "architecture_cli: Files generated successfully."