• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >html5 > H5项目开发iOS插件功能的实例代码

H5项目开发iOS插件功能的实例代码

作者:匿名 字体:[增加 减小] 来源:互联网 时间:2018-12-03

本文主要包含h5 ios 插件 开发等相关知识,匿名希望在学习及工作中可以帮助到您
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层: 插件扩展的平台原生代码,负责执行业务逻辑并执行结果返回到请求页面。

先来注册下对应关系
修改PandoraAPI.bundle中feature.plist文件,在其中添加JS插件别名和Native插件类的对应关系,SDK基座会根据对应关系查找并生成相应的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)
                 });

大致的开发流程就值这个样子,其实真正麻烦的并是不代码而是IDE的各种调试..
下面就是把H5项目导入Xcode来实现离线打包了,在项目的manifest.json中,修改appid,使其与Xcode中的appid一致,Version和Build对应version下的name和code

将manifest.json中的中文注释全部删除,然后把H5项目导入到Pandora下的www目录中,记住,把项目下的所有文件导入到www下,而不是项目文件夹直接导入到www下,那样运行会打不开App。

把www上一级的文件夹名称改为Appid一致的名称,修改图标可以把图标放入HBuilder中可以生成相应尺寸的图标..这点儿用着非常亲民..之前iOS开发都是去找美工要的..接着修改项目名称等我就不再一一说了。

【相关推荐】

1. 免费h5在线视频教程

2. HTML5 完整版手册

3. php.cn原创html5视频教程

以上就是H5项目开发iOS插件功能的实例代码的详细内容,更多请关注微课江湖其它相关文章!

您可能想查找下面的文章:

相关文章

  • 2018-12-03使用HTML5技术开发一个属于自己的超酷颜色选择器_html5教程技巧
  • 2018-12-03关于9个经典华丽的HTML5图表应用 详情介绍
  • 2017-08-06仿酷狗html5手机音乐播放器主要部分代码
  • 2018-12-03h5新特性及网页布局实例
  • 2017-08-06HTML5的Geolocation地理位置定位API使用教程
  • 2018-12-03HTML5边玩边学(九)-俄罗斯方块之数据模型篇
  • 2017-08-06HTML5实现预览本地图片
  • 2018-12-03最近微信出现的HTML5的邀请函?
  • 2018-12-03HTML5 中 Geolocation 获取地理位置的原理是什么?
  • 2018-12-03html5转义实体字符的使用详解

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • HTML5中的Scoped属性使用实例_html5教程技巧
    • html5如何及时更新缓存文件(js、css或图片)
    • HTML5 的自定义 data-* 属性和jquery的data()方法的使用
    • HTML5-表单输入验证详解(图文)
    • HTML5高级编程之图形扭曲及其应用一(原理篇)
    • 【水果忍者】血日狂刀代码-_-#真的只有一把刀
    • 通过phonegap操作数据库的的教程详解
    • HTML5 History API 实现无刷新跳转
    • HTML5画一个简单呢好看的电路图
    • 如何删除多余无用的css?

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有