cordova 插件开发

创建插件 # npm install -g plugman npm install -g plugman # plugman create --name <pluginName> --plugin_id <pluginId> -- plugin_version 1.0.0 # plugin id用点号分隔 plugman create --name PluginDemo --plugin_id cordova.plugin.plugindemo --plugin_version 1.0.0 cd PluginDemo/ plugman platform add --platform_name android plugman createpackagejson . #push to github: https://github.com/eddyshn/cordova-plugin-demo.git 测试工程 ionic start blankApp blank ionic cordova platform add android ionic cordova plugin add https://github.com/eddyshn/cordova-plugin-demo.git 调用插件 nativeToast(){ (window as any).cordova.plugins.PluginDemo.coolMethod(this.inputValue, (x) => { console.log(x); }, (x) => { console.log(x); }); }

中以看到cordova plugin 是attach 到window上的, exports.coolMethod的命名空间来源于

封装插件便于调用

import { Injectable } from '@angular/core'; import { Observable, Observer } from 'rxjs'; @Injectable({ providedIn: 'root' }) export class PluginDemo { coolMethod(arg0) { return new Observable(subscriber => { (window as any).cordova.plugins.PluginDemo.coolMethod(arg0, (data: any) => { subscriber .next(data); subscriber .complete(); }, (error: any) => { subscriber .error(error); } ); }); } }

github demo

https://github.com/eddyshn/cordova-plugin-demo.git

https://github.com/eddyshn/kb-code/tree/main/cordova/plugin-test-app

参考资料

https://cordova.apache.org/docs/en/latest/guide/hybrid/plugins/index.html

https://medium.com/@durgavundavalli/ionic5-cordova-custom-plugin-for-objective-c-e4e82c5fbc3b

https://medium.com/@durgavundavalli/cordova-create-a-native-wrapper-with-ionic-native-d88fbc6742a2

https://www.youtube.com/watch?v=Q6PaFEDonac&t=665s