Flutter 目录结构 ​

项目目录 ​

拿到一个项目肯定要先熟悉和了解一下整体的项目构架，为后面写入代码、本地资源引用、项目配置等，做准备

图上，标注了几个重点区域，现在来一起看一下吧

lib ​

当我们创建好 flutter 项目后，在 lib 文件夹下，只有一个 main.dart 文件。这里就是整个项目启动的入口处。就例如 vue 中的 main.js，以及 java 中的 main 函数。

除了 main.dart 文件之外，这里还列举了在整个项目渐渐成型之后，会用到的一些文件存放位置。

├── common： 一些工具类，如通用方法类、网络接口类、保存全局变量的静态类等
├── models： Json文件对应的Dart Model类会在此目录下
├── states： 保存APP中需要跨组件共享的状态类
├── routes： 存放所有路由页面类
├── widgets： APP内封装的一些Widgets组件都在该目录下
└── main.dart： flutter的入口文件

引入本地图片 ​

一个项目开发，肯定少不了本地图片的引入（外链图片/接入接口，另说）

这里主要是写一下，静态资源的存放处，和引入方法

创建文件夹 ​

在 根目录 下，创建 assets 文件夹，用于存放静态资源

配置 ​

flutter 引入静态资源有一些特殊，如果是前端正常写页面引入图片时，直接写入图片地址路径即可。但是，这里划重点，flutter 还需要在配置文件中，另外引入一次图片路径

配置文件路径：根目录下的 pubspec.yaml 文件

flutter:
  assets:
    # 写法一 避免每张图片都要引入一次 ( 推荐
    # 这里是引入相对路径 ，使用的时候 Image.asset('images/img.jpg')，不用加 asstes
    - assets/images/
    # 写法二
    # 这里是引入相对路径 ，使用的时候 Image.asset('images/img.jpg')，不用加 asstes
    - assets/images/img.jpg

使用 ​

Image.asset('images/img.jpg')