深度解析Flutter开发大厂App（强烈推荐，值得收藏）

以下博文会分为3个部分概述：

• 项目结构分析

• 项目功能详细概述（所用知识点）

• 小技巧积累总结

项目结构分析

---

其次，梳理下项目的目录结构，理解每个文件都是干什么的，我们先来看看一级目录，如下：

├── README.md # 描述文件

├── android # android 宿主环境

├── build # 项目构建目录，由flutter自动完成

├── flutter_ctrip.iml

├── fonts # 自己创建的目录，用于存放字体

├── images # 自己创建的目录，用于存放图片

├── ios # iOS 宿主环境

├── lib # flutter 执行文件，自己写的代码都在这

├── pubspec.lock # 用来记录锁定插件版本

├── pubspec.yaml # 插件及资源配置文件

└── test # 测试目录

这个就不用多解释，大多是 flutter 生成及管理的，我们需要关注的是 lib 目录。

我们再来看看二级目录，如下 (重点关注下lib目录)

├── README.md

├── android

│ ├── android.iml

…

│ └── settings.gradle

├── build

│ ├── app

…

│ └── snapshot_blob.bin.d.fingerprint

├── flutter_ctrip.iml

├── fonts

│ ├── PingFang-Italic.ttf

│ ├── PingFang-Regular.ttf

│ └── PingFang_Bold.ttf

├── images

│ ├── grid-nav-items-dingzhi.png

…

│ └── yuyin.png

├── iOS

│ ├── Flutter

…

│ └── ServiceDefinitions.json

├── lib

│ ├── dao # 请求接口的类

│ ├── main.dart # flutter 入口文件

│ ├── model # 实体类，把服务器返回的 json 数据，转换成 dart 类

│ ├── navigator # bottom bar 首页底部导航路由

│ ├── pages # 所以的页面

│ ├── plugin # 封装的插件

│ ├── util # 工具类，避免重复代码，封装成工具类以便各个 page 调用

│ └── widget # 封装的组件

├── pubspec.lock

├── pubspec.yaml

└── test

└── widget_test.dart

再来看看，lib 目录下二级目录，看看整个项目创建了多少个文件，写了多少代码，如下 （其实，并不是很多）

├── dao/

│ ├── destination_dao.dart*

│ ├── destination_search_dao.dart*

│ ├── home_dao.dart

│ ├── search_dao.dart*

│ ├── trave_hot_keyword_dao.dart*

│ ├── trave_search_dao.dart*

│ ├── trave_search_hot_dao.dart*

│ ├── travel_dao.dart*

│ ├── travel_params_dao.dart*

│ └── travel_tab_dao.dart*

├── main.dart

├── model/

│ ├── common_model.dart

│ ├── config_model.dart

│ ├── destination_model.dart

│ ├── destination_search_model.dart

│ ├── grid_nav_model.dart

│ ├── home_model.dart

│ ├── sales_box_model.dart

│ ├── seach_model.dart*

│ ├── travel_hot_keyword_model.dart

│ ├── travel_model.dart*

│ ├── travel_params_model.dart*

│ ├── travel_search_hot_model.dart

│ ├── travel_search_model.dart

│ └── travel_tab_model.dart

├── navigator/

│ └── tab_navigater.dart

├── pages/

│ ├── destination_page.dart

│ ├── destination_search_page.dart

│ ├── home_page.dart

│ ├── my_page.dart

│ ├── search_page.dart

│ ├── speak_page.dart*

│ ├── test_page.dart

│ ├── travel_page.dart

│ ├── travel_search_page.dart

│ └── travel_tab_page.dart*

├── plugin/

│ ├── asr_manager.dart*

│ ├── side_page_view.dart

│ ├── square_swiper_pagination.dart

<