从 Android Web 视图启动 QR 扫描仪并使用 Xamarin 返回扫描结果答案

【问题标题】：Launching a QR scanner from Android web view and returning the scanned result using Xamarin从 Android Web 视图启动 QR 扫描仪并使用 Xamarin 返回扫描结果
【发布时间】：2016-10-27 09:31:14
【问题描述】：

我有这个 Xamarin 应用程序，它在单击按钮时启动 QR 扫描仪。此按钮单击是在 Javascript 中处理的。单击按钮时，将调用下面的 C# 代码。这应该会启动 QR 扫描仪，一旦扫描了值，扫描的值就会返回给 Javascript 函数。但是一旦点击扫描二维码的按钮，网页视图应用程序就会进入后台，但不会启动相机来扫描二维码。

 public class QRScannerJSInterface : Java.Lang.Object
    {
        QRScanner qrScanner;
        WebView webView;

        public QRScannerJSInterface(WebView webView)
        {
            this.webView = webView;
            qrScanner = new QRScanner();
        }

        [Export]
        [JavascriptInterface]
        public void ScanQR()
        {
            String result = qrScanner.ScanQR();
            var js = string.Format("getQRValue('{0}');", result);
            webView.LoadUrl("javascript:" + js);
            //call the Javascript method here with "result" as its parameter to get the scanned value
        }

以下是主要活动如何调用此类。

        webView = FindViewById<WebView>(Resource.Id.webView);
        webView.Settings.JavaScriptEnabled = true;
        webView.Settings.AllowFileAccessFromFileURLs = true;
        webView.Settings.AllowUniversalAccessFromFileURLs = true;
        webView.Settings.AllowFileAccess = true;
        webView.AddJavascriptInterface(new QRScannerJSInterface(webView),"CSharpQRInterface");

下面是二维码。

class QRScanner
    {
        MobileBarcodeScanner scanner;

        public QRScanner()
        {
            scanner = new MobileBarcodeScanner();
        }

        public String ScanQR()
        {
            scanner.UseCustomOverlay = false;
            scanner.TopText = "Scanning for barcode";
            Task<ZXing.Result> result = scanner.Scan();
            return result.ToString();
        }
    }

我在这里做错了什么？任何帮助将不胜感激。

【问题讨论】：

有什么理由不能使用ZXing.NET或类似的原生组件？
QRScanner 类正在包装 ZXing.NET 组件。我已在编辑后的问题中添加了该代码
@Cheesebaron 此代码在我在本机 android 应用程序中运行时有效。当我在网络视图中运行它时会发生这种情况

标签： c# android xamarin android-webview zxing

【解决方案1】：

以下是有效的解决方案。请注意扫描仪异步扫描更改。在将 Task 放入 js 文件之前，您需要等待结果。

资产scannerPage.html

<html>
<head>
    <title></title>

    <script type='text/javascript'>

        function getQRValue(result) {
    };

        function scan() {
            CSharpQRInterface.ScanQR();
        };


    </script>

</head>
<body style="background-color:powderblue;">
    <button type="button" onclick="scan()">Click Me!</button>
</body>
</html>

主活动

public class MainActivity : Activity
    {
        WebView webView;

        protected override void OnCreate(Bundle bundle)
        {
            base.OnCreate(bundle);

            MobileBarcodeScanner.Initialize(Application);

            // Set our view from the "main" layout resource
            SetContentView(Resource.Layout.Main);

            webView = FindViewById<WebView>(Resource.Id.webView);
            webView.Settings.JavaScriptEnabled = true;
            webView.Settings.AllowFileAccessFromFileURLs = true;
            webView.Settings.AllowUniversalAccessFromFileURLs = true;
            webView.Settings.AllowFileAccess = true;
            webView.AddJavascriptInterface(new QRScannerJSInterface(webView), "CSharpQRInterface");
            webView.LoadUrl("file:///android_asset/scannerPage.html");

        }

扫描仪界面

public class QRScannerJSInterface : Java.Lang.Object
    {
        QRScanner qrScanner;
        WebView webView;

        public QRScannerJSInterface(WebView webView)
        {
            this.webView = webView;
            qrScanner = new QRScanner();
        }

        [Export("ScanQR")]
        public void ScanQR()
        {
            qrScanner.ScanQR()
                .ContinueWith((t) =>
                {
                    //var js = string.Format("getQRValue('{0}');", t.Result);
                    //webView.LoadUrl("javascript:" + js);
                    //call the Javascript method here with "result" as its parameter to get the scanned value
                    if (t.Status == TaskStatus.RanToCompletion)
                        webView.LoadUrl(@"javascript:getQRValue('" + t.Result + "')");
                });
        }
    }

扫描仪类

class QRScanner
    {
        MobileBarcodeScanner scanner;

        public QRScanner()
        {
            scanner = new MobileBarcodeScanner();
        }

        public async Task<string> ScanQR()
        {
            scanner.UseCustomOverlay = false;
            scanner.TopText = "Scanning for barcode";
            var result = await scanner.Scan();
            return result.ToString();
        }
    }

【讨论】：

除了不调用 qrScanner.ScanQR() .ContinueWith((t) => 我做了什么不同的事情？你的作品！
我没有你的 html 也没有调试你的代码，所以我不能确切地知道哪里出了问题。除了异步调用扫描之外，我删除了不必要的属性 [JavascriptInterface] 并将函数的名称添加到属性 [Export("ScanQR")]