uni-app自定义二维码扫描及本地图片扫描

结构

<template><view class="scan"></view>
</template>
<script>let scan = null;export default {data() {return {flash: false,barcode: null}},onNavigationBarButtonTap() {uni.chooseImage({count: 1,sizeType: ['original', 'compressed'],sourceType: ['album'], //这要注意，camera掉拍照，album是打开手机相册success: (res) => {uni.getImageInfo({src:res.tempFilePaths[0],success:function(image){plus.barcode.scan(image.path, function(type, result) {console.log("扫描成功:(" + type + ")" + result);}, function(e) {console.log("Scan failed: " + JSON.stringify(e));});}})}});},mounted() {const currentWebview = this.$mp.page.$getAppWebview();this.barcode = plus.barcode.create('barcode', [plus.barcode.QR], {top: '0px',left: '0px',width: '100vw',height: '100vh',position: 'static'});// 成功的回调this.barcode.onmarked = this.onmarked;this.barcode.setFlash(this.flash);currentWebview.append(this.barcode);this.barcode.start();// 此处未演示扫码成功回调的地址设置，实际请参考HTML5Plus API自行处理  // 注意扫码区域需为正方形，否则影响扫码识别率  },methods: {onmarked(type, result) {console.log("type:" + type, "result:" + result)uni.navigateBack({delta: 1});this.barcode.close();},},}
</script>
<style>#bcid {height: 100vh;width: 100vw;background: #0077AA;}
</style>

路由

{"path": "pages/index/qrscen","style": {"navigationBarTextStyle":"white","app-plus": {"titleNView": {"backgroundColor":"#000000","titleText":"扫一扫","titleColor":"#ffffff","autoBackButton":true,"backButton":{"color":"#ffffff"},"buttons":[{"text": "相册","fontSize": "16px","float": "right","color": "#ffffff","fontWeight": "400"}]}}}},

uni-app自定义二维码扫描及本地图片扫描相关推荐

Zxing生成自定义二维码样式
Zxing生成自定义二维码样式现在几乎每个app都带有二维码,但是google提供的zxing包,只给我们提供了核心的二维码算法,而开发过程中经常有自定义二维码的样式的需求,这时候我们就要自己写工具 ...
uniapp中应用H5自定义二维码扫码界面
uniapp中应用H5自定义二维码扫码界面最终效果 pages配置组件代码最终效果 pages配置 {"path": "components/barcode/sca ...
微信扫码登录自定义二维码显示信息
微信扫码登录,自定义二维码显示信息 <script src="http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js& ...
【Android App】二维码的讲解及生成属于自己的二维码实战（附源码和演示超详细必看）
需要全部代码请点赞关注收藏后评论区留言~~~ 一.二维码基本内容介绍条形码只能表达十几位数字编码,无法表示更复杂的数据. 二维码在二维方格上描出一个个黑点,从而表达更丰富的信息. 二维码早已在手机A ...
【uni-app】App实现二维码分享图合成(支持单张或多张)
[uni-app]App实现二维码分享图合成写在前面, 该文章目前仅支持合成特定数量的分享图, 不支持随意数量分享图合成一. 背景 app内实现一个邀请拉新功能, 需要根据每个用户生成各自的二维码 ...
APIcoud 手机二维码or条码生成与扫描模块
APIcoud 手机二维码or条码生成与扫描模块刚接触APIcoud 的时候觉得很多模块真的好难,初次接触二维码的时候觉得,生成二维码真的很费劲呢,其实不然,是真的很难,但是APIcoud 已经封 ...
如何制作APP下载二维码？
电信诈骗已经成为一个非常严重的社会问题了. 五花八门的诈骗手段总是让人防不胜防,每天都有很多人因为电信诈骗造成严重的财产损失.全国各地的公安部门也纷纷使出了洪荒之力来加强反诈宣传力度.提升民众反诈意识 ...
iOS二维码限制区域识别、扫描动画
AVCaptureDevice //初始化捕捉设备 AVCaptureDeviceInput //创建输入流 input AVCaptureSession //创建会话 AVCaptureVideoP ...
微信扫码登录自定义二维码样式
微信扫码登录自定义二维码样式前言 Java生成data-url 1.工具类pom 2.代码实现将data-url赋值给href 前言今天在做web端扫码登录时,前端需要定义二维码的样式.官方文档 ...
Android 自定义二维码
Android生成二维码使用的是zxing. 1.加入依赖,或者自己选择zxing版本:Releases · zxing/zxing · GitHub dependencies {...impleme ...

uni-app自定义二维码扫描及本地图片扫描

结构

路由

uni-app自定义二维码扫描及本地图片扫描相关推荐

最新文章

热门文章