功能

---

基本使用（读取并展示）

image.png image.png image.png image.png image.png image.png image.png
image.png

修改默认配置

image.png image.png image.png image.png

Image源码学习记录

---

flutter_svg的设计和Image源码的设计基础如出一辙（除了名字从Image修改为Picture，其他的代码超级超级一样，可以结合着一块看，但不可否认的是人家的功劳和功底还是很赞的，值得学习）,下面是在遇到flutter_svg不支持动图的情况下，学习Image widget是如何支持的时候，记录的一点笔记，供后续翻阅。

• Image Widget持有一个ImageProvider，通过ImageProvider来获取图片；
• ImageProvider的resolve中调用了load方法，从而构建出一个ImageStreamCompleter，之后就给了ImageStream；
• _ImageState只有上面创建出来的ImageStream（ImageProvider的resolve方法中创建并返回给_ImageState）；
• 不同于flutter_svg，Image组件采用的是MultiFrameImageStreamCompleter，当然也有OneFrameImageStreamCompleter，但flutter_svg目前只设计了一个OneFramePictureStreamCompleter，这也是flutter_svg不支持动图的原因（Image组件肯定支持了）；

MultiFrameImageStreamCompleter

• 想要创建MultiFrameImageStreamCompleter，必须传入一个Future<ui.Codec>参数；
• codec ready之后，调用_handleCodecReady，如果有listener的话，就会调用_decodeNextFrameAndSchedule()函数来获取图片的一帧数据，如果_codec.frameCount等于1的话，说明是单帧图片（静态图），直接回调出去就结束了；
  • _codec.frameCount：当前图片一共有多少帧
  • _nextFrame.duration：该帧的播放时长

• 算了，还是用一张图来说明MultiFrameImageStreamCompleter的运转流程吧：

  
  image.png