Flutter插件iOS端开发教程[亲测有效]

Ios (84) 2023-03-24 21:40

大家好,我是编程小6,很高兴遇见你,有问题可以及时留言哦。

学习flutter没多久,因为新的需求涉及到原生,所以需要制作插件,学习的过程中详细记录一下,本篇博客主要介绍的是iOS端详细步骤,不涉及Android

原理

个人理解,这种与原生通信的设计模式都差不多,flutter这边的叫Method Channel。跟之前搞的Cordova很像,都有一个plugin类来处理与原生的通信。

深入理解推荐阅读Flutter与iOS通信原理

步骤

创建插件工程

  1. Android Studio创建
    Flutter插件iOS端开发教程[亲测有效]_https://bianchenghao6.com/blog_Ios_第1张

    点击Next,修改Project名字继续Next,

    Flutter插件iOS端开发教程[亲测有效]_https://bianchenghao6.com/blog_Ios_第2张

    红框部分选择是否支持SwiftKotlin

  2. 终端创建
    flutter create --org com.example --template=plugin 插件名字

如果需要支持Swift或者Kotlin

flutter create --template=plugin -i swift -a kotlin 插件名字

到这里,插件工程就已经创建好了。

目录结构

Flutter插件iOS端开发教程[亲测有效]_https://bianchenghao6.com/blog_Ios_第3张

android:安卓插件代码添加的地方

example:插件示例工程

ios:iOS原生代码添加的地方

lib:插件的Dart代码

flutter与原生通信

Dart调用原生插件的地方:

Flutter插件iOS端开发教程[亲测有效]_https://bianchenghao6.com/blog_Ios_第4张

原生接收调用的插件类:

Flutter插件iOS端开发教程[亲测有效]_https://bianchenghao6.com/blog_Ios_第5张

通过method来区分不通的方法调用,传参在arguments中

Flutter插件iOS端开发教程[亲测有效]_https://bianchenghao6.com/blog_Ios_第6张

编写iOS原生代码

首先需要在example工程下,执行fLutter build ios,主要是需要pod install,生成xxx.workspace. 然后如下图所示打开Xcode,

Flutter插件iOS端开发教程[亲测有效]_https://bianchenghao6.com/blog_Ios_第7张

使用
example目录下的
ios目录打开也一样。
Xcode工程打开后,在如下图所示位置添加编写原生代码。

Flutter插件iOS端开发教程[亲测有效]_https://bianchenghao6.com/blog_Ios_第8张

添加文件或者本地库

Flutter插件iOS端开发教程[亲测有效]_https://bianchenghao6.com/blog_Ios_第9张

同时在
podsepc文件里面加上:

  s.source_files = 'Classes/**/*'
  s.public_header_files = 'Classes/**/*.h'
  # 第三方.a文件
  s.vendored_libraries = 'Classes/**/*.a'
  # 第三方framework
  s.vendored_frameworks = 'Classes/**/*.framework'
  s.dependency 'Flutter'

Flutter插件iOS端开发教程[亲测有效]_https://bianchenghao6.com/blog_Ios_第10张

更加详细的
podspec文件语法,请戳 podspec文件语法

使用

pubspec.yaml文件dependencies下添加:

cool_ui:
    git:
      url: http://code.zhilun.com/frontend/cool_ui.git
      ref: develop
# ref指定分支

如果是放在本地也可以使用path参数。

flutter_webview_plugin:
    path: ../flutter_webview_plugin-0.3.10

遇到的问题

运行example工程时,一直报library not found,这个问题还不是一直有,有时候报错有时候不报错,尤其Xcode能运行打开Android Studio运行就显示找不到库文件。搞了好久,请教了很多人,最后发现是Android Studio不能识别大写Lib开头的.a文件,一定要小写。

发表回复