共计 3746 个字符,预计需要花费 10 分钟才能阅读完成。
FNScanner 模块是一个二维码 / 条形码扫描器,是 scanner 模块的优化升级版。在 iOS 平台上本模块底层集成了 Zbar 和零碎自带的条形码 / 二维码剖析库,因为 IOS 零碎平台在 IOS7.0 以上才凋谢了二维码 / 条码的相干接口,所以在 IOS6 上运行时模块会调用开源库 Zbar 去读取解析二维码 / 条码。只有在 IOS7 以上版本才会调用零碎自带扫码性能。
模块文档地址(点击即可跳转)
模块须要留神的中央:
1. 留神:应用本模块前,需在云编译页面勾选增加拜访摄像头权限,若要拜访相册也需勾选申请拜访相册权限。
2. 不能同时应用的模块:wwprint
本模块封装了两套扫码计划:
计划一
开发者通过调用 openScanner 接口间接关上自带默认 UI 成果的二维码 / 条形码扫描页面,本界面相当于关上一个 window 窗口,其界面内容不反对自定义。用户可在此界面实现性能如下:
关上敞开闪关灯
从零碎相册选取二维码 / 条码图片进行解密操作
关上摄像头,主动对焦扫码想要解析的二维码 / 条码
计划二
通过 openView 接口打开一个自定义大小的扫描区域(本区域相当于关上一个 frame)进行扫描。开发者可自行 open 一个 frame 贴在模块上,从而实现自定义扫描界面的性能。而后配合应用 setFrame、closeView、switchLight 等接口实现开关闪光灯、重设扫描界面地位大小、图片解码、字符串编码等相干性能。详情请参考模块接口参数。
计划一我就不介绍,因为间接调取接口就能间接显示一个扫码 ui 界面,间接应用就能够,
楼主本帖分享的是计划一无奈满足 ui 设计成果前提下,怎么实现 ui 自定义的成果;
计划二实现页面截图
计划二关上闪光灯成果界面截图
第一步:首先先关上 openwin,而后再关上模块,而后提早关上一个 frm 自定义一个扫码见面。大家下面看到扫码是这种思路的;
废话不多说上局部外围源码
`1. var FNScanner, eHeader, headerH;
- apiready = function() {
- // 利用全局 FNScanner 模块
- FNScanner = api.require(‘FNScanner’);
- // 定义依据 id 获取 dom
- eHeader = $api.byId(‘header’);
- // 设置头部沉迷式
- $api.fixStatusBar(eHeader);
- // 获取头部高度
- headerH = $api.offset(eHeader).h;
- // 监听利用回到前台
- api.addEventListener({
- name: ‘resume’
- }, function(ret, err) {
- FNScanner.onResume();
- });
- // 监听利用回到后盾
- api.addEventListener({
- name: ‘pause’
- }, function(ret, err) {
- FNScanner.onPause();
- });
- fnOpenFNScanner();
- }
- function fnOpenFNScanner() {
- // 关上扫码模块
- FNScanner.openView({
- //autorotation: true,
- fixedOn: api.frameName,
- rect: {
- x: 0,
- y: headerH,
- w: api.frameWidth,
- h: api.frameHeight
- }
- }, function(ret, err) {
- if (ret) {
- if (ret.eventType == ‘success’ && ret.content != ”) {
- // 扫码胜利执行函数操作传值
- fnOpenCouple(ret.content);
- return;
- }
- if (ret.eventType == ‘cameraError’) {
- api.toast({
- msg: ‘ 请开启 app 拜访手机摄像头权限 ’,
- duration: 2000,
- location: ‘bottom’
- });
- setTimeout(function() {
- // 敞开扫码器 敞开扫码界面
- back();
- }, 300);
- return;
- }
- if (ret.eventType == ‘albumError’) {
- api.toast({
- msg: ‘ 请开启 app 拜访手机相册权限 ’,
- duration: 2000,
- location: ‘bottom’
- });
- setTimeout(function() {
- back();
- }, 300);
- return;
- }
- if (ret.eventType == ‘fail’) {
- api.toast({
- msg: ‘ 扫码失败, 请从新扫码 ’,
- duration: 2000,
- location: ‘bottom’
- });
- setTimeout(function() {
- back();
- }, 300);
- return;
- }
- } else {
- api.toast({
- msg: ‘ 扫码谬误请稍后再试 ’,
- duration: 2000,
- location: ‘bottom’
- });
- setTimeout(function() {
- back();
- }, 300);
- }
- });
- setTimeout(function() {
- // 关上扫码动画 frm 页面
- api.openFrame({
- name: ‘add_frm’,
- url: ‘./add_frm.html’,
- rect: {
- marginTop: headerH,
- marginLeft: 0,
- marginRight: 0,
- marginBottom: 0
- },
- bgColor: ‘rgba(0,0,0,0)’,
- });
- }, 300);
- }
- // 返回
- function back() {
- // 敞开 win 页面
- api.closeWin();
- // 敞开扫码模块
- FNScanner.closeView();
- }
- // 关上最初扫码得出的数值
- function fnOpenCouple(content) {
- console.warn(content);
- back(); // 倡议关上下一页我这块只是为了不便间接调用返回按钮 扫码胜利之后必须敞开扫码模块 不然会呈现屡次扫码状况
- }
- var isSOff = true;
- // 关上闪光灯
- function fnOpenLamp() {
- if (isSOff) {
- FNScanner.switchLight({
- status: ‘on’
- });
- isSOff = false;
- } else {
- FNScanner.switchLight({
- status: ‘off’
- });
- isSOff = true;
- }
- }
_复制代码_`