Javascript Cordova Cordova插件qrscanner:不透明相机视图
我正在通过quasar框架进行工作,并使用cordova for android平台进行包装 扫描器工作正常,但盲目 当QRScanner.show()启动时,我得到的是完全不透明的视图。我尝试在qrchanner.show()调用前后透明地执行所有html元素,隐藏甚至删除其中的一些元素,但我总是看到不透明视图。有人知道怎么解决这个问题吗Javascript Cordova Cordova插件qrscanner:不透明相机视图,javascript,android,cordova,cordova-plugins,vuejs2,Javascript,Android,Cordova,Cordova Plugins,Vuejs2,我正在通过quasar框架进行工作,并使用cordova for android平台进行包装 扫描器工作正常,但盲目 当QRScanner.show()启动时,我得到的是完全不透明的视图。我尝试在qrchanner.show()调用前后透明地执行所有html元素,隐藏甚至删除其中的一些元素,但我总是看到不透明视图。有人知道怎么解决这个问题吗 <script> export default { /* Fuentes: camera
<script>
export default {
/*
Fuentes:
camera
https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-camera/index.html#takePicture
qrscanner
https://github.com/bitpay/cordova-plugin-qrscanner#prepare
*/
mounted () {
this.prepDevice()
},
data () {
return {
imageURI: '',
authorized: false,
selection: 'standard',
selectOptions: [
{
label: 'Camera-thumbnail',
value: 'camera-thmb'
},
{
label: 'Standard',
value: 'standard'
}
],
enableVisibility: 'hidden',
backColor: 'transparent'
}
},
methods: {
prepDevice () {
QRScanner.prepare(this.onDone)
},
onDone: function (err, status) {
if(err) {
alert("preparing: error code = " + err.code)
}
if(status.authorized) {
this.authorized = true
} else if (status.denied || !status.authorized) {
this.openSettings()
} else {
//No se obtuvo permiso
}
},
goScan: function () {
//--->>> Funciona pero el escaneo es a ciegas (vista en negro) <<<---
this.authorized = false
QRScanner.show()
/*
var html = document.getElementsByTagName("*")
for (var i=0; i<html.length; i++) {
html[i].style.backgroundColor = "transparent"
}
*/
//QRScanner.enableLight()
QRScanner.scan(this.displayContents)
},
displayContents: function (err, text) {
if(err){
alert("scanning: error code = " + err.code)
if(err.name === 'SCAN_CANCELED') {
alert("The scan was canceled before a QR code was found.")
}
} else {
alert(text)
}
//QRScanner.hide()
//QRScanner.disableLight()
QRScanner.destroy() // hide, cancelScan...
this.authorized = true
},
cancelScan() {
QRScanner.cancelScan()
this.authorized = true
},
openSettings() {
if(status.canOpenSettings){
if(confirm("Would you like to enable QR code scanning? You can allow camera access in your settings.")){
QRScanner.openSettings();
}
}
}
}
}
导出默认值{
/*
富恩特斯:
照相机
https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-camera/index.html#takePicture
QRS扫描仪
https://github.com/bitpay/cordova-plugin-qrscanner#prepare
*/
挂载(){
这个设备()
},
数据(){
返回{
imageURI:“”,
授权:假,
选择:'标准',
选择选项:[
{
标签:“相机缩略图”,
值:“摄像头thmb”
},
{
标签:“标准”,
值:“标准”
}
],
enableVisibility:“隐藏”,
背景色:“透明”
}
},
方法:{
预处理设备(){
QRScanner.准备(这个.onDone)
},
onDone:功能(错误、状态){
如果(错误){
警报(“准备:错误代码=“+err.code”)
}
如果(授权状态){
这是真的
}else if(status.denied | | |!status.authorized){
这是openSettings()
}否则{
//不允许这样做
}
},
goScan:函数(){
//--->>>Functiona pero el escaneo es a ciegas(vista en negro)如果扫描已经开始工作,您就快到了。确保视频预览可见基本上需要通过应用程序的各个层,并确认该层没有遮挡预览
首先检查应用程序在设备上运行时的DOM。尝试在覆盖视图的每个元素上设置背景
的非透明
,包括主体
和html
元素。在几乎所有情况下,您都会在应用程序层的某个位置发现一个白色背景的恶意容器你的应用程序
如果您完全相信整个web视图是透明的(注意:这是非常不寻常的),您需要检查应用程序的本机层,以确定是否有其他插件或配置设置干扰了可见性。此步骤的说明与平台相关,因此最好查阅相关平台的文档/论坛。我不理解与cordova插件摄像头的关系>.cordova plugin qrscanner
在任何方面都不依赖它,我也不确定两者会如何互动。cordova plugin camera
会干扰扫描仪的可见性吗?顺便说一句,插件名称在你的标题中拼写错误,这可能会让人们很难找到你的问题。我错误地按下我自己的按钮。相机插件与我无关。我已经编辑了插件名称,感谢您回答@JasonDreyzehner
<button v-if="authorized" class="secondary push" @click="goScan()">Go Scan</button>