H5项目开发iOS插件功能的实例代码
互联网
17-5-10
HBuilder用来写H5项目,Xcode用来写iOS原生的插件,我所需实现的是,在H5页面点击打印,运行iOS原生插件来实现连接蓝牙打印机并打印出获取的内容。
首先去HBuilder文档上,下载HBuilder离线打包iOS版SDK,运行HBuilder-Hello,在HBuilder-Hello项目基础上开始进行原生插件开发。
HTML5+ 基座扩展采用三层结构,JS层、PluginBridge层和Native层。 三层功能分别是:JS层: 在Webview页面调用,触发Native层代码,获取执行结果。 PluginBridge层: 将JS层请求进行处理,触发Native层扩展插件代码。Native层: 插件扩展的平台原生代码,负责执行业务逻辑并执行结果返回到请求页面。
plugintest为你所要扩展的插件类的类名,在iOS中创建plugintest类,并继承于PGPlugin,在.h中导入PGPlugin.h,PGMethod.h
#include "PGPlugin.h" #include "PGMethod.h"
若需要静态库的话直接吧.a和.h文件拖到项目中就可以了,native中的方法分同步和异步方法,我在这里只介绍异步方法
- (void)PluginTestFunctionArrayArgu:(PGMethod *)msg { NSArray *pArray = [NSArray array]; if (msg) { //CallBackid 异步方法的回调id,H5+ 会根据回调ID通知JS层运行结果成功或者失败 NSString *cdId = [msg.arguments objectAtIndex:0]; //用户的参数会在第二个参数传回,可以按照Array方式传入 pArray = [msg.arguments objectAtIndex:1]; NSLog(@"cdId: %@ pArray: %@",cdId,pArray); // 如果使用Array方式传递参数 NSString *pResultString = [NSString stringWithFormat:@"%@ %@ %@ %@ %@ %@ %@",[pArray objectAtIndex:0],[pArray objectAtIndex:1], [pArray objectAtIndex:2],[pArray objectAtIndex:3],[pArray objectAtIndex:4], [pArray objectAtIndex:5],[pArray objectAtIndex:6]]; NSLog(@"pResultString: %@",pResultString); //可以直接调用所导入的静态库里面的方法 NSString *UUID = [ZQDeviceSDK Prn_GetPortList:1]; NSString *port = [UUID stringByTrimmingCharactersInSet:[NSCharacterSet whitespaceAndNewlineCharacterSet]]; [self startPrintText:pArray andUUID:port]; // 运行Native代码结果和预期相同,调用回调通知JS层运行成功并返回结果 PDRPluginResult *result = [PDRPluginResult resultWithStatus:PDRCommandStatusOK messageAsString:pResultString]; // 如果Native代码运行结果和预期不同,需要通过回调通知JS层出现错误,并返回错误提示// PDRPluginResult *resultError = [PDRPluginResult resultWithStatus:PDRCommandStatusError messageAsString:@"出错了!"]; //通知JS层Native层运行结果,JS Pluginbridge会根据cbid找到对应的回调方法并触发 [self toCallback:cdId withReslut:[result toJSONString]]; } }在js中的函数
document.addEventListener( "plusready", function(){ // 声明的JS“扩展插件别名” var _BARCODE = 'plugintest',B = window.plus.bridge; var plugintest ={ // 声明异步返回方法 // 通知Native层plugintest扩展插件运行”PluginTestFunction”方法 //参数为所需传入原生的参数 PluginTestFunctionArrayArgu : function (Argus, successCallback, errorCallback ){ var success = typeof successCallback !== 'function' ? null : function(args) { successCallback(args); }, fail = typeof errorCallback !== 'function' ? null : function(code) { errorCallback(code); }; callbackID = B.callbackId(success, fail); //这里写上原生中的异步方法名 return B.exec(_BARCODE, "PluginTestFunctionArrayArgu", [callbackID, Argus]); } window.plus.plugintest = plugintest; }, true );在H5中调用的代码
plus.plugintest.PluginTestFunctionArrayArgu( printData, function( result ) { mui.alert( result ); },function(result){ mui.alert(result) });将manifest.json中的中文注释全部删除,然后把H5项目导入到Pandora下的www目录中,记住,把项目下的所有文件导入到www下,而不是项目文件夹直接导入到www下,那样运行会打不开App。
把www上一级的文件夹名称改为Appid一致的名称,修改图标可以把图标放入HBuilder中可以生成相应尺寸的图标..这点儿用着非常亲民..之前iOS开发都是去找美工要的..接着修改项目名称等我就不再一一说了。
【相关推荐】
1. 免费h5在线视频教程
2. HTML5 完整版手册
3. php.cn原创html5视频教程
以上就是H5项目开发iOS插件功能的实例代码的详细内容,更多内容请关注技术你好其它相关文章!
免责声明:
1.资讯内容不构成投资建议,投资者应独立决策并自行承担风险
2.本文版权归属原作所有,仅代表作者本人观点,不代表本站的观点或立场
1.资讯内容不构成投资建议,投资者应独立决策并自行承担风险
2.本文版权归属原作所有,仅代表作者本人观点,不代表本站的观点或立场