前言
本文主要将图片的加载，加载方式包括本地和网络，同时引用第三方图片缓存框架档案里，顺便介绍三方框架的引入
demo地址(内容在loadImage文件夹中，可以替换main中注释尝试效果)
本地图片加载
本地图片的加载，加载之前，先介绍图片的导入与路径配置工作
第一步：创建一个存放图片的目录，放到与 ios、android同级目录即可，一般为 images 或 assets
第二步：打开pubspec.yaml文件，在 assets取消注释在下面，按照下面格式导入路径名称(可以通过拖拽到终端截取)，配置如下所示（看了下图可能已经知道怎么加载android、ios中的资源图片了）
如果运行失败,可以尝试点击pubspec.yaml文件内容的右上方 Pub get 或者 Pub upgrade
使用 Image.asset 加载本地图片，代码如下所示
//推荐
Image.asset("images/WechatIMG21002.jpeg")
//加载方式2
Image(image: AssetImage('images/WechatIMG21002.jpeg'))
复制代码加载android和ios中的资源文件
和普通的本地资源文件加载方式一样，只不过先找到他们的资源路径位置
android的资源位置: android/app/src/main/res
ios的资源位置: ios/Runner/Assets.xcassets
然后配置到 pubspec.yaml文件中，如下所示(可能看了前面的图片配置大家就猜到了)
然后使用 Image.asset 加载，实现如下所示
//加载android的资源图片
Image.asset("android/app/src/main/res/mipmap-mdpi/ic_launcher.png")
//加载一个ios的资源图片
Image.asset("ios/Runner/Assets.xcassets/logo.imageset/logo.png")
复制代码网络图片加载
网络图片加载则省去了本地图片的加载步骤，直接使用 Image.network 加载，如下所示
Image.network("https://img0.baidu.com/it/u=2907855715,3034528164&fm=253&fmt=auto&app=138&f=JPEG?w=890&h=500")
复制代码顺便介绍下FadeInImage，其为渐变式显示网络图片，即：下载完毕后，采用渐变的方式显示图片，可以李继伟为透明度改变的方式显示图片，使图片显示没那么突兀了（个人感觉也就那样吧，还是直接显示来的爽快）
FadeInImage.assetNetwork(
placeholder: "images/WechatIMG21002.png", //预览图
fit: BoxFit.fitWidth, //自适应宽度
height: 140, //可以设置高度
image: "https://img0.baidu.com/it/u=2907855715,3034528164&fm=253&fmt=auto&app=138&f=JPEG?w=890&h=500",
),
复制代码三方安装以及图片缓存控件使用
图片的缓存框架我们使用 cached_network_image框架，并以它的导入步骤作为案例演示
执行下面命令即可导入，导入后的依赖也会被放到 pubspec.yaml中
flutter pub add cached_network_image
复制代码导入后的依赖也会被放到 pubspec.yaml中，可以在 pubspec.yaml文件中，更改自己想要的版本号，如果提示运行问题，可以在该文件上面点击 Pub get 或 Pub upgrade 更新环境
pubspec.yaml中的依赖如下所示，可以根据情况更改版本号，然后点击右上角 Pub upgrade即可
dependencies:
cached_network_image: ^3.2.0
复制代码导入到工程后，项目文件 import 如下所示（使用系统提示导入更便捷）
import 'package:cached_network_image/cached_network_image.dart';
复制代码注意：如果项目运行到 ios 模拟器或者iphone，卡到了 pod install命令，如果 pod 本身没什么问题，那么可以打开podfile文件，将platform 将前面的#去掉，在尝试即可
最后
这里将三方的导入，fluter社区的地址也贴上了，快来尝试开发吧