积木式移动互联网App Hybrid框架-modular的使用(2)

接着我们讲解HTML如何调用Native能力。

集成步骤

1、HTML端

1、引入框架中的modular-core.js和modular-extend.js

<script type="text/javascript" src="modular-core.js"></script>
<script type="text/javascript" src="modular-extend.js"></script>

注：上述引入的js文件，可以在模板工程中下载

2、把versions.properties文件随同HTML一起发布
根据自己的发布服务器情况修改versions.properties：

  #版本号
  #android版本信息配置
  android.version=1.0
  #apk下载url
  android.versionURL=xxxxx
  #是否是兼容版本 0兼容，1需强制更新
  android.updateType=0
  
  #iOS版本信息配置
  iOS.version=1.0
  #IPA发布，一般为版本配置的plist文件，目前是调到版本下载页面
  iOS.versionURL=xxxxx
  #是否是兼容版本 0兼容，1需强制更新
  iOS.updateType=0

注：自动升级版本亦可使用自己的升级模块，把global.properties里的version.url去掉即可；

2、iOS端

可参考上一篇博文的模板工程

3、Android 端

可参考上一篇博文的模板工程

API使用说明

本部分仅介绍可被HTML调用几个典型的APIs（后续持续更新），掌握调用方式即可自行封装扩展接口，原生APId调用方式（后续更新）。

1.身份证拍照

JN_TakeCertificate(callback)

参数	类型	说明
callback	function	匿名回调函数,参数返回图片base64数据

范例

window.modular.JN_TakeCertificate(function(base64) {
	//
})

2.打开在线文档

JN_OpenDocument(url,callback)

参数	类型	说明
url	string	文档的在线链接（pdf、word、ppt、excel、图片等）
callback	function	匿名回调函数

范例

window.modular.JN_OpenDocument('http://xxxx/201809.xls',function(str){
 })

3. 分享到系统剪切板

JN_Sharing(content,callback)

参数	类型	说明
content	string	复制到剪切板的内容
callback	function	匿名回调函数

范例

window.modular.JN_Sharing("wuyoujian",function(str) {
 })

4. 启动原生Loading

JN_ShowLoading(text,callback)

参数	类型	说明
text	string	loading的提示语
callback	function	匿名回调函数

范例

 window.modular.JN_ShowLoading('加载中...',function(str){
    })

5. 关闭原生Loading

JN_DismissLoading(callback)

参数	类型	说明
callback	function	匿名回调函数

范例

 window.modular.JN_DismissLoading(function(str){
    })

6. 自消失的提示框

JN_ShowMessage(text)

参数	类型	说明
text	string	提示语

范例

window.modular.JN_ShowMessage('你好，张三！')

7. 保存数据

JN_SetValueWithKey(value,key)

参数	类型	说明
value	string	保存的字符串
key	string	保存的key

范例

window.modular.JN_SetValueWithKey('你好，张三！','message')

8. 获取保存数据

JN_GetValueWithKey(key,callback)

参数	类型	说明
key	string	保存的key
callback	function	匿名回调函数,回传获取的数据

范例

window.modular.JN_GetValueWithKey('message',function(value) {
})

9. 指纹验证

JN_Fingerprint(callback)

参数	类型	说明
callback	function	匿名回调函数,回传验证的状态语，其中：“failed” 表示失败，"success"表示成功，其他对应的提示语

范例

 window.modular.JN_Fingerprint(function(result) {
    })

10. 发送短信

JN_SMS(phoneNumber,content)

参数	类型	说明
phoneNumber	string	接收短信的手机号码
content	string	短信内容

范例

window.modular.JN_SMS('13812345678','你好，张三！')

11. 拨打电话

JN_Telephone(phoneNumber)

参数	类型	说明
phoneNumber	string	手机号码

范例

window.modular.JN_Telephone('13812345678')

12. 发送邮件

JN_Email(address,subject,content)

参数	类型	说明
address	string	接收者邮箱地址
subject	string	邮件主题
content	string	邮件内容

范例

 window.modular.JN_Email('13812345678@139.com','你好，张三','邮件内容')

13.打开网址

JN_OpenLightWebViewActivity(title,url,color)

参数	类型	说明
title	string	标题
url	string	网址
color	string	webView背景颜色

范例

window.modular.JN_OpenLightWebViewActivity("百度",'http://www.baidu.com,"0x000000")

14. 从相册选择图片

JN_SelectPhoto(callback)

参数	类型	说明
callback	function	匿名回调函数,返回参数图片的base64数据

范例

window.modular.JN_SelectPhoto(function(base64) {
 })

15. 系统拍照

JN_Photograph(callback)

参数	类型	说明
callback	function	匿名回调函数,返回参数图片的base64数据

范例

window.modular.JN_Photograph(function(base64) {
 })

16. 扫码

JN_QRcode(callback)

参数	类型	说明
callback	function	匿名回调函数,参数就一个String扫码的内容

范例

window.modular.JN_QRcode(function(result) {
 })

17. 传递自定义对象

JN_JSONObj(obj,callback)

参数	类型	说明
obj	object	android侧是JSONObject，iOS侧是NSDictionary
callback	function	匿名回调函数

范例

var obj = {"title":"问候","message":"张三，你好！"};
window.modular.JN_JSONObj(obj,function(str) {
 })

小结

上述挑选一些典型API，后续更新其他一些API说明，读者亦可从模板工程以及框架代码中找到其他的API。