使ionic2 app完全透明的最佳方法是什么？

Question

我最近遇到了一个名为cordova-plugin-qrscanner(https://github.com/bitpay/cordova-plugin-qrscanner)的相当新的cordova插件.我之前一直在使用其他QR扫描仪,但这些只是覆盖某种原生相机UI,直到QR被扫描然后返回到应用程序.

但是,这个插件的方法有点不同.实际上,相机显示在您的应用程序"后面",您必须使所有内容都透明才能看到它.

这非常有趣,因为您可以使用HTML和CSS轻松添加自定义叠加层.但是,我不太清楚这里最好的方法是什么.

添加插件后,只是调用QRScanner.scan(displayContents);你看不到任何东西,但扫描仪已经在后台运行.然后,我从应用程序中递归删除任何样式(请参阅删除页面中所有样式的最简单方法),并将background-color设置为透明,以查看它是否有效.它确实如此,但我显然仍然可以看到之前显示的文本.

我想我可以创建并推送带有叠加层的新页面,将背景颜色设置为透明,然后在扫描代码后导航回来.但这感觉非常黑客.

有人有更好的解决方案吗？
例如,有没有办法用覆盖层"交换"应用程序的整个可见部分,并在扫描代码后恢复状态？

谢谢你的帮助.

编辑:

它不是同一个插件,但这篇文章与我的问题相关.

http://www.joshmorony.com/ionic-go-create-a-pokemon-go-style-interface-in-ionic-2/

应用css样式有效,但同样,应用程序的其余部分无法使用.

Answer 1

我不会让应用程序变得透明，因为我不明白这样做的意义。相反，您只需在页面的 div 中显示相机的内容，并使用比包含相机图像的元素更高的 z-index 将其他 HTML 元素放在该元素之上。