没有人比我更懂Flutter 第三方依赖鸿蒙化了

368 阅读3分钟

欢迎关注我的微信公众号:OpenFlutter,感恩

最近折腾了一下把flutter 项目迁移到鸿蒙上,总得上来说体验还可以,但也着实也让我掉了几根头发。首先是我发现有两个页面在模拟器上直接崩溃了,这两个页面有一个共同特点:都有FloatingActionButton,后来一查,果然FAB在模拟器上有问题,而在真机上是没有这个问题的。为此,我特地新购了一个鸿蒙手机,嘿,神了,果然在真机上没有崩溃。说的废话有点多,言归正传,今天记录一下如何更换第三方依赖。

众所周知,我们项目中一般会用到很多的依赖,如果是纯Flutter或者dart的第三方库,一般来说直接在鸿蒙上用大概率是没有问题的,只需要我们是确认相应库要的最小sdk版本即可:

image.png

但需要使用到原生代码的库就没这么简单了,幸运的话,一些库已经适配了鸿蒙,如果没有适配就需要自己写了。今天不讲如何开发鸿蒙Flutter插件,而是我们如何替换一些我们常用的flutter插件,比如:image_picker,这些库虽然没有被库作者官方支持鸿蒙,但openharmony-tpc已经为我们做好适配了,具体情况可以在Gitcode上查看。

我们以image_picker为例,原来我们是这样依赖的:

image_picker: ^1.1.2

我们可以使用Git的形式进行替换:

image_picker:
  git:
    url: https://gitcode.com/openharmony-tpc/flutter_packages.git
    path: packages/image_picker/image_picker
    ref: br_image_picker-v1.1.2_ohos

上面的代码都能看懂吧:

  • url: 仓库地址
  • path: 插件代码所在位置
  • ref :这里就是相对插件的版本,这里是一个分支的形式。

实际上这么做,总体就应该没有问题,但实际上这种方式只针对直接引用的库好用,像间接依赖的都不太好用。比如,cached_network_image并没有正确显示图片,因为cached_network_image依赖了path_provider, 但我们又不想直接魔改cached_network_image,这时候就需要dependency_overrides:,让项目覆盖掉某些直接或间接依赖的库:

dependency_overrides:
  path_provider:
    git:
      url: https://gitcode.com/openharmony-tpc/flutter_packages.git
      path: packages/path_provider/path_provider
      ref: br_path_provider-v2.1.4_ohos
  video_player:
    git:
      url: https://gitcode.com/openharmony-tpc/flutter_packages.git
      path: packages/video_player/video_player
      ref: br_video_player-v2.9.2_ohos

  image_picker:
    git:
      url: https://gitcode.com/openharmony-tpc/flutter_packages.git
      path: packages/image_picker/image_picker
      ref: br_image_picker-v1.1.2_ohos

到这里,一切看起来都挺美好的,是不?emm,现实还是给我上了一课,我这image_picker在鸿蒙上就是不好用,也不崩溃,就是打不开。我一度怀疑是权限或者image_picker的问题,但我的群友发来的视频证明了image_picker并没有问题。

我又一顿查,终于发现实际依赖中image_picker_platform_interface版本号为2.1.0,更重要的是依赖中并没有image_picker_ohos!

最后我把这两个强行加到pubspec.yaml中就好了:

image_picker_platform_interface:
  git:
    url: https://gitcode.com/openharmony-tpc/flutter_packages.git
    path: packages/image_picker/image_picker_platform_interface
    ref: br_image_picker-v1.1.2_ohos

image_picker_ohos:
  git:
    url: https://gitcode.com/openharmony-tpc/flutter_packages.git
    path: packages/image_picker/image_picker_ohos
    ref: br_image_picker-v1.1.2_ohos

Happy Ohos coding!