Q&A
現在、ハイブリッドアプリの開発を行っており、QRコードリーダーを組み込もうとしております。
そこで「Instascan」と呼ばれるオープンソースを使用していたのですが
自動でコードの認識を行わない仕組みが必要となってしまいました。
Instascanでオートフォーカスを行わない仕組みなどご存知の方いらっしゃいましたら、教えていただけないでしょうか？
あるいは、自動認識機能を持たないアプリのオープンソースなどご存知であれば
教えていただければ幸いです。
どうぞよろしくお願いいたします。
サンプルデモ
HTML
1<!doctype html> 2<html> 3 <head> 4 <meta charset="utf-8"/> 5 <title>Instascanサンプルデモ</title> 6 <style> 7 body { 8 margin: auto; 9 width: 960px; 10 text-align: center; 11 } 12 #info { 13 font-size: 4em; 14 font-weight: bold; 15 color: #666; 16 } 17 </style> 18 </head> 19 <body> 20 <h1>Instascanサンプルデモ</h1> 21 22 <!-- ここにカメラの映像を表示する --> 23 <video id="preview"></video> 24 25 <!-- ここにQRコードの情報を表示する --> 26 <p id="info"></p> 27 28 29 <script src="instascan.min.js"></script> 30 <script> 31 var videoTag = document.getElementById('preview'); 32 var info = document.getElementById('info'); 33 var scanner = new Instascan.Scanner({ video: videoTag }); 34 35 //QRコードを認識して情報を取得する 36 scanner.addListener('scan', function (value) { 37 info.textContent = value; 38 }); 39 40 //PCのカメラ情報を取得する 41 Instascan.Camera.getCameras() 42 .then(function (cameras) { 43 44 //カメラデバイスを取得できているかどうか？ 45 if (cameras.length > 0) { 46 47 //スキャンの開始 48 scanner.start(cameras[0]); 49 } 50 else { 51 alert('カメラが見つかりません！'); 52 } 53 }) 54 .catch(function(err) { 55 alert(err); 56 }); 57 </script> 58 </body> 59</html>
回答1件
0
ベストアンサー
Javascript
1 //QRコードを認識して情報を取得する 2 scanner.addListener('scan', function (value) { 3 info.textContent = value; 4 });
上記のscanイベントにてQRコードの解析を行なっているようなので、以下のどちらかのように実装する事が出来そうですね。
- 上記処理内でフラグによる処理実行の分岐
- イベントを発生させる操作（ボタン操作など？）にて、
scannerへのイベント追加／削除を行う
投稿2018/05/31 01:48
総合スコア2335
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。