本文出自APICloud官方論壇
FNScanner 模塊是一個(gè)二維碼/條形碼掃描器，是 scanner 模塊的優(yōu)化升級(jí)版。在 iOS 平臺(tái)上本模塊底層集成了 Zbar 和系統(tǒng)自帶的條形碼/二維碼分析庫(kù)，由于 IOS 系統(tǒng)平臺(tái)在 IOS7.0 以上才開放了二維碼/條碼的相關(guān)接口，所以在 IOS6 上運(yùn)行時(shí)模塊會(huì)調(diào)用開源庫(kù) Zbar 去讀取解析二維碼/條碼。只有在 IOS7 以上版本才會(huì)調(diào)用系統(tǒng)自帶掃碼功能。
模塊文檔地址：
docs.apicloud.com/Client-API/…
模塊需要注意的地方：
注意：使用本模塊前，需在云編譯頁(yè)面勾選添加訪問(wèn)攝像頭權(quán)限，若要訪問(wèn)相冊(cè)也需溝通申請(qǐng)?jiān)L問(wèn)相冊(cè)權(quán)限 。
不能同時(shí)使用的模塊：wwprint
本模塊封裝了兩套掃碼方案：
方案一
開發(fā)者通過(guò)調(diào)用 openScanner 接口直接打開自帶默認(rèn) UI 效果的二維碼/條形碼掃描頁(yè)面，本界面相當(dāng)于打開一個(gè) window 窗口，其界面內(nèi)容不支持自定義。用戶可在此界面實(shí)現(xiàn)功能如下：
打開關(guān)閉閃關(guān)燈
從系統(tǒng)相冊(cè)選取二維碼/條碼圖片進(jìn)行解密操作
打開攝像頭，自動(dòng)對(duì)焦掃碼想要解析的二維碼/條碼
方案二
通過(guò) openView 接口打開一個(gè)自定義大小的掃描區(qū)域（本區(qū)域相當(dāng)于打開一個(gè) frame）進(jìn)行掃描。開發(fā)者可自行 open 一個(gè) frame 貼在模塊上，從而實(shí)現(xiàn)自定義掃描界面的功能。然后配合使用 setFrame、closeView、switchLight 等接口實(shí)現(xiàn)開關(guān)閃光燈、重設(shè)掃描界面位置大小、圖片解碼、字符串編碼等相關(guān)功能。詳情請(qǐng)參考模塊接口參數(shù)。
方案一我就不介紹，因?yàn)橹苯诱{(diào)取接口就能直接顯示一個(gè)掃碼ui界面，直接使用就可以， 樓主本帖分享的是方案一無(wú)法滿足ui設(shè)計(jì)效果前提下，怎么實(shí)現(xiàn)ui自定義的效果；
方案二完成頁(yè)面截圖
方案二打開閃光燈效果界面截圖
第一步：首先先打開openwin，然后再打開模塊 ，然后延遲打開一個(gè)frm自定義一個(gè)掃碼見面。大家上面看到掃碼是這種思路的； 廢話不多說(shuō)上部分核心源碼
重慶分公司
重慶分公司
var FNScanner, eHeader, headerH;
apiready = function() {
//應(yīng)用全局FNScanner模塊
FNScanner = api.require('FNScanner');
//定義根據(jù)id獲取dom
eHeader = $api.byId('header');
//設(shè)置頭部沉浸式
$api.fixStatusBar(eHeader);
//獲取頭部高度
headerH = $api.offset(eHeader).h;
//監(jiān)聽?wèi)?yīng)用回到前臺(tái)
api.addEventListener({
name: 'resume'
}, function(ret, err) {
FNScanner.onResume();
});
//監(jiān)聽?wèi)?yīng)用回到后臺(tái)
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 != '') {
// 掃碼成功執(zhí)行函數(shù)操作傳值
fnOpenCouple(ret.content);
return;
}
if (ret.eventType == 'cameraError') {
api.toast({
msg: '請(qǐng)開啟app訪問(wèn)手機(jī)攝像頭權(quán)限',
duration: 2000,
location: 'bottom'
});
setTimeout(function() {
// 關(guān)閉掃碼器 關(guān)閉掃碼界面
back();
}, 300);
return;
}
if (ret.eventType == 'albumError') {
api.toast({
msg: '請(qǐng)開啟app訪問(wèn)手機(jī)相冊(cè)權(quán)限',
duration: 2000,
location: 'bottom'
});
setTimeout(function() {
back();
}, 300);
return;
}
if (ret.eventType == 'fail') {
api.toast({
msg: '掃碼失敗,請(qǐng)從新掃碼',
duration: 2000,
location: 'bottom'
});
setTimeout(function() {
back();
}, 300);
return;
}
} else {
api.toast({
msg: '掃碼錯(cuò)誤請(qǐng)稍后再試',
duration: 2000,
location: 'bottom'
});
setTimeout(function() {
back();
}, 300);
}
});
setTimeout(function() {
// 打開掃碼動(dòng)畫frm頁(yè)面
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() {
// 關(guān)閉win頁(yè)面
api.closeWin();
// 關(guān)閉掃碼模塊
FNScanner.closeView();
}
//打開最后掃碼得出的數(shù)值
function fnOpenCouple(content) {
console.warn(content);
back(); //建議打開下一頁(yè)我這塊只是為了方便直接調(diào)用返回按鈕 掃碼成功之后必須關(guān)閉掃碼模塊 不然會(huì)出現(xiàn)多次掃碼情況
}
var isSOff = true;
// 打開閃光燈
function fnOpenLamp() {
if (isSOff) {
FNScanner.switchLight({
status: 'on'
});
isSOff = false;
} else {
FNScanner.switchLight({
status: 'off'
});
isSOff = true;
}
}
復(fù)制代碼
另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無(wú)理由+7*72小時(shí)售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國(guó)服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢(shì)，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場(chǎng)景需求。
