Windows10 UWP x64 Cordova应用设置双单格式条码扫描区域问题

我之前在Windows 10 UWP的Cordova项目里折腾过类似的条码扫描配置，针对你需要的两个扫描区域分别对应CODE_39和QR_CODE的需求，可以通过扩展barcodeScanner.scan方法的配置参数来实现。你的现有代码只用到了基础的扫描回调，没利用插件支持的扫描区域指定和条码格式过滤功能，下面是具体的实现方案：

核心配置说明 #

Cordova的cordova-plugin-barcodescanner插件在UWP平台支持两个关键参数，刚好能满足你的需求：

• formats: 字符串类型，指定要识别的条码格式，多个格式用逗号分隔（你需要分别指定CODE_39和QR_CODE）
• rect: 对象类型，定义扫描区域的位置和大小，参数为x, y, width, height，取值范围是0到1（基于屏幕尺寸的比例值，适配不同设备）

具体实现代码 #

你可以创建两个扫描触发函数，分别对应CODE_39的上半区域扫描和QR_CODE的下半区域扫描：

// 扫描CODE_39（屏幕上半部分区域）
function scanCode39() {
    const scanConfig = {
        formats: "CODE_39", // 仅识别CODE_39条码
        rect: {
            x: 0.1,    // 区域左上角x坐标（屏幕宽度的10%）
            y: 0.1,    // 区域左上角y坐标（屏幕高度的10%）
            width: 0.8,// 区域宽度（屏幕宽度的80%）
            height: 0.3// 区域高度（屏幕高度的30%）
        },
        showTorchButton: true, // 可选：显示手电筒按钮
        disableSuccessBeep: false // 可选：扫描成功是否发声
    };

    cordova.plugins.barcodeScanner.scan(
        function(result) {
            if (!result.cancelled) {
                alert(`CODE_39扫描结果：\n内容：${result.text}\n格式：${result.format}`);
            }
        },
        function(error) {
            alert(`CODE_39扫描失败：${error}`);
        },
        scanConfig // 传入配置参数
    );
}

// 扫描QR_CODE（屏幕下半部分区域）
function scanQRCode() {
    const scanConfig = {
        formats: "QR_CODE", // 仅识别QR_CODE条码
        rect: {
            x: 0.1,    // 区域左上角x坐标（屏幕宽度的10%）
            y: 0.6,    // 区域左上角y坐标（屏幕高度的60%）
            width: 0.8,// 区域宽度（屏幕宽度的80%）
            height: 0.3// 区域高度（屏幕高度的30%）
        },
        showTorchButton: true
    };

    cordova.plugins.barcodeScanner.scan(
        function(result) {
            if (!result.cancelled) {
                alert(`QR码扫描结果：\n内容：${result.text}\n格式：${result.format}`);
            }
        },
        function(error) {
            alert(`QR码扫描失败：${error}`);
        },
        scanConfig
    );
}

踩坑提示 #

1. UWP区域坐标规则：rect参数的取值是屏幕比例而非像素值，这样能自动适配不同尺寸的设备屏幕，别搞错成像素了。
2. 条码格式拼写：插件对格式名称大小写敏感，必须写CODE_39和QR_CODE，不能随便改大小写或者缩写。
3. 插件版本：确保用的是最新版cordova-plugin-barcodescanner，旧版本可能不支持UWP的rect参数。
4. 权限配置：别忘了在UWP项目的Package.appxmanifest里添加网络摄像头权限，不然扫描功能会直接罢工。

内容的提问来源于stack exchange，提问作者Enzo B.