「这是我参与2022首次更文挑战的第3天，活动详情查看：2022首次更文挑战」。

前言

在之前的文章中，我尝试着将Android中的 Palette 移植到Flutter，当完成初步效果达成一个阶段的里程碑后，还兴冲冲的发了一篇文章；

但是在后续研究如何应用这个插件的过程中，我发现，其实这玩意早就有了…………

PaletteGenerator

事实再一次无情的证明了一个道理：

不要怀疑Github的能力，如果没搜到相应控件，那就换个语言换个关键字再来一次

不过至少能安慰一下自己，学到了如何计算主题色和相应的算法步骤，也不算功夫全废；

不过该收尾的工作还是要做的，既然主题色计算步骤在之前说过了，那么这篇就分析一下这个 ImageProvider 和 PaletteGenerator 是如何搭配完成主题色获取的；

palette_generator 的使用步骤：

使用 palette_generator 的方法非常非常简单，只需要调用fromImageProvider，传入提供图片的ImageProvider即可，包括AssetImage 、NetworkImage、FileImage之类的；

当然也可以传入一些配置参数，修改计算的图片和计算范围之类的；具体说明，在注释中也描述的很详细：

像size和region这种参数应该是很有用的，运用的好，可以大大减少计算耗时，毕竟主题色不需要太精确的图片，裁剪压缩什么都可以用起来；

当然如果你已经获得了Image对象本身，或者有一定的自定义需求需要对Image做些处理什么的，那么该使用的方法就是 fromImage ：

在这里就可以看到几个跟Android 的 Palette 一个性质的参数，比如说最大颜色数量，过滤器之类的；大体步骤，其实就是 Android 的 Palette 那套了；

那么该来到Image这块的部分，需要了解的有这么一个部分：

ImageProvider是什么，都干了啥

其实 ImageProvider 的注释都已经将ImageProvider的基本流程讲的很明白了：

简单的翻译一下：

1、 ImageProvider 通过构造一个ImageStream的流，当作图片解析加载完成时候的处理回调部分；使用者通过监听这个Stream来获取数据；

2、 提供了一个obtainKey的方法，可以根据配置信息来返回一个key值，这个key值的作用是当作图片流的身份标签，以供后续诸如解析和释放流程使用；在这里也提供了一个机制能让异步的错误返回到当前Zone，好让try catch 能抓错

PS ：嗯……可能有人不清楚这个突然冒出来的Zone是个什么东西，这里简单的总结下：

这个Zone可以理解为当前异步运行的环境，直接这么说有点抽象，不过确实我理解的，差不多就这个意思，总之每个异步操作都是不同的环境中；也因此，在一般流程中，try catch 这种操作抓不到异步错误的，因为调用着和异步操作处于不同的Zone，也就是不同的环境中；而 try catch 只管抓自己环境中的错误；

好吧，这个Zone机制和异步机制的问题，放在以后一起细说，这个东西，还不是一两句话感觉就能说明白的，这里就当环境理解；如果有做过Flutter的错误捕获上报工作的人，应该会比较熟悉这个东西，有兴趣的同学可以了解下；这里就不啰嗦了；

3、 如果上面的obtainKey 方法成功返回了key值，说明解析器可以上线，做图片的解析操作，在此过程中也会因为各种操作中断或者删除之类的丢失数据源，这时候同样使用上一步的那个抛错流程来处理；

4、 而做解析操作的方法，就是load方法，在load中对图片解码，并最终通过第一步中创建的那个流来返回出来；有错的话，也是通过上面的抛错流程抛出；

PaletteGenerator 是如何驱动ImageProvider，并获取解码后的数据的

来到调用ImageProvider的部分，可以看到，第一步就是创建并监听流：

嗯……第一步其实是创建流和创建Completer以供传递监听的结果，第二步才是开始监听；

之后就是静静等待图片解码完成：

还记得上一篇文章中提到的部分么？这样就拿到了解码后包含图片像素数据的Image；

之后的操作就是按部就班的解析，这里也不再赘述；

结语

又到了国际惯例的效果展示环节：

嗯，效果还是可以的，尤其是这个《最佳女婿》，提取出来的是呼伦贝尔的草原主题色，再结合这个小说名，不由得让人浮想翩翩；

不过缺点还是挺明显的，由于是偷懒直接用FutureBuilder做的……外加上初始默认背景色是黑色，感觉这个颜色变化是有些突兀，好像闪了一下的感觉……

或许应该用Animation+ colorTween 做下渐变比较好？