進(jìn)入 Flutter 開(kāi)發(fā)時(shí)我遇到的最大問(wèn)題就是如何管理我的代碼婿滓。原生 Android 開(kāi)發(fā)通過(guò) XML 文件和 Java(或 Kotlin)文件分割 UI 代碼和邏輯代碼忠聚,但如果你不小心的話棱貌,F(xiàn)lutter 代碼會(huì)變得很混亂蔓涧。在使用 Flutter 一年多之后耸峭,我將自己的經(jīng)驗(yàn)編寫(xiě)成一個(gè)簡(jiǎn)單的指南隘谣,來(lái)幫助你以最佳方式搭建應(yīng)用程序瞒斩,以期達(dá)到可讀性和未來(lái)可重構(gòu)的可能性挚赊。
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:exampleapp/blocprovs/example-bloc-prov.dart';
import 'package:exampleapp/blocs/example-bloc.dart';
import 'package:exampleapp/theme/style.dart';
import 'package:exampleapp/screens/example1/examplescreen1.dart';
import 'package:exampleapp/screens/example2/examplescreen2.dart';
void main() {
runApp(ExampleApp());
}
class ExampleApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return ExampleProvider(
bloc: ExampleBloc(),
child: MaterialApp(
title: 'ExampleApp',
theme: appTheme(),
initialRoute: '/',
routes: <String, WidgetBuilder>{
"/": (BuildContext context) => ExScreen1(),
"/ExScreen2": (BuildContext context) => ExScreen2(),
},
),
);
}
}
關(guān)于 main.dart
任何 Flutter App 的基礎(chǔ)入口(main.dart 文件),都只應(yīng)該包含很少的代碼济瓢,且只作為應(yīng)用程序的概述荠割。
由 runApp
運(yùn)行的 Widget
應(yīng)該是 StatelessWidget
,而且它本身應(yīng)該不比包裝在 BLoC(Business Logic Component) Provider 中的 MaterialApp
更復(fù)雜旺矾。
MaterialApp
本身不應(yīng)該有繁重的代碼蔑鹦,而是從其它文件中獲取 Theme 和 Widget 。
子目錄
- theme 只包含一個(gè)描述 App 主題的 style.dart箕宙,可以在 main.dart 中訪問(wèn)它嚎朽;
- services 文件夾包含一些 Web API 與原生交互的代碼;
- components 文件夾有多個(gè)不同尺寸屏幕下使用的自定義 widget柬帕;
- models 文件夾中的每個(gè)文件都有一個(gè)在 App 中廣泛使用的自定義模型類哟忍;
- bloc 和 blocprovs 文件夾都很簡(jiǎn)單狡门,每個(gè)里面分別包含一個(gè) BLoC 和 BLoC Provider;
- screen 文件夾包括許多不同的子文件夾锅很,每個(gè)文件夾對(duì)應(yīng)不同尺寸的屏幕其馏,它包含兩個(gè)東西:一個(gè)用于組織每個(gè)組件的主 screen 文件,和一個(gè)將每個(gè)組件保存為單獨(dú)文件的 “components” 文件夾爆安。屏幕上任何一塊比幾個(gè) widget 更復(fù)雜的的部件都應(yīng)該是它自己的組件叛复。
擴(kuò)展閱讀
在經(jīng)歷了許多不太理想的代碼組織后,我設(shè)計(jì)了這個(gè)組織形式扔仓,它將用于我之后所有的應(yīng)用程序褐奥,同時(shí)也建議你這么做。這里有一個(gè)比較詳細(xì)的示例可以參考翘簇。
原文: https://medium.com/flutter-community/flutter-code-organization-de3a4c219149
作者:Conner Aldrich
編譯:碼王爺