扫描器

付费插件

此插件需要购买。价格：$49（一次性购买）

概述

Scanner API 通过原生相机界面提供跨平台的条形码和二维码扫描功能。

安装

composer require nativephp/mobile-scanner

使用

PHP (Livewire/Blade)

use Native\Mobile\Facades\Scanner;
use Native\Mobile\Events\Scanner\CodeScanned;

// 打开扫描器
Scanner::scan();

// 监听扫描结果
#[OnNative(CodeScanned::class)]
public function handleScan($data, $format, $id = null)
{
    Dialog::toast("已扫描：{$data}");
}

JavaScript (Vue/React/Inertia)

import { scanner, dialog, on, off, Events } from '#nativephp';

// 打开扫描器
await scanner.scan();

// 监听扫描结果
const handleScan = (payload) => {
    const { data, format, id } = payload;
    dialog.toast(`已扫描：${data}`);
};

on(Events.Scanner.CodeScanned, handleScan);

配置方法

prompt(string $prompt)

设置扫描器屏幕上显示的自定义提示文本。

Scanner::scan()->prompt('扫描产品条形码');

await scanner.scan()
    .prompt('扫描产品条形码');

continuous(bool $continuous = true)

保持扫描器打开以扫描多个码。默认为 false（第一次扫描后关闭）。

Scanner::scan()->continuous(true);

await scanner.scan()
    .continuous(true);

formats(array $formats)

指定要扫描的条形码格式。默认为 ['qr']。

可用格式： qr、ean13、ean8、code128、code39、upca、upce、all

Scanner::scan()->formats(['qr', 'ean13', 'code128']);

await scanner.scan()
    .formats(['qr', 'ean13', 'code128']);

id(string $id)

为扫描会话设置唯一标识符。用于处理不同的扫描上下文。

Scanner::scan()->id('product-scanner');

await scanner.scan()
    .id('product-scanner');

事件

CodeScanned

当成功扫描到码时触发。

Payload:

• string $data - 扫描到的码内容
• string $format - 码格式（qr、ean13 等）
• ?string $id - 扫描器 ID（如果设置了）

PHP

use Native\Mobile\Attributes\OnNative;
use Native\Mobile\Events\Scanner\CodeScanned;

#[OnNative(CodeScanned::class)]
public function handleScan($data, $format, $id = null)
{
    if ($id === 'product-scanner') {
        $this->addProduct($data);
    }
}

Vue

import { on, off, Events } from '#nativephp';
import { onMounted, onUnmounted } from 'vue';

const handleScan = (payload) => {
    const { data, format, id } = payload;

    if (id === 'product-scanner') {
        addProduct(data);
    }
};

onMounted(() => {
    on(Events.Scanner.CodeScanned, handleScan);
});

onUnmounted(() => {
    off(Events.Scanner.CodeScanned, handleScan);
});

React

import { on, off, Events } from '#nativephp';
import { useEffect } from 'react';

const handleScan = (payload) => {
    const { data, format, id } = payload;

    if (id === 'product-scanner') {
        addProduct(data);
    }
};

useEffect(() => {
    on(Events.Scanner.CodeScanned, handleScan);

    return () => {
        off(Events.Scanner.CodeScanned, handleScan);
    };
}, []);

平台支持

• Android: ML Kit Barcode Scanning (API 21+)
• iOS: AVFoundation (iOS 13.0+)

注意事项

• 权限： 你必须在 config/nativephp.php 中启用 scanner 权限才能使用扫描器。相机权限会自动处理，用户在首次使用扫描器时会收到权限提示。