@diadal/barcode-scanner

A fast and efficient (QR) barcode scanner for Capacitor

Install

npm install @diadal/barcode-scanner
npx cap sync

import { BarcodeScanner } from '@diadal/barcode-scanner';


function Scaner() {

      window.document.body.classList.add('qrscanner');
      BarcodeScanner.startScan()
        .then((result: ScanResult) => {
          window.document.body.classList.remove('qrscanner');
          console.log('result222cc', result);
        })
        // eslint-disable-next-line @typescript-eslint/no-explicit-any
        .catch((error: any) => {
          window.document.body.classList.remove('qrscanner');
          console.log('error333', error);
        });
    }

.scanner-ui {
display: none;
}
.scanner-hide {
visibility: visible;
}

body.qrscanner {
background-color: transparent;
}
body.qrscanner .scanner-ui {
display: block;
}
body.qrscanner .scanner-hide {
visibility: hidden;
}

.ion-content {
--background: transparent;
}

ion-content {
--background: transparent;
}

Thansk To [https://github.com/capacitor-community/camera-preview

](camera-preview)

API

• startScan(...)
• Interfaces
• Type Aliases

startScan(...)

startScan(data: CameraPreviewOptions | null) => Promise<ScanResult>

Param	Type
data	CameraPreviewOptions | null

Returns: Promise<ScanResult>

---

Interfaces

ScanResult

Prop	Type
hasContent	boolean
code	string

CameraPreviewOptions

Prop	Type	Description
width	number	The preview width in pixels, default window.screen.width (applicable to the android and ios platforms only)
height	number	The preview height in pixels, default window.screen.height (applicable to the android and ios platforms only)
x	number	The x origin, default 0 (applicable to the android and ios platforms only)
y	number	The y origin, default 0 (applicable to the android and ios platforms only)
paddingBottom	number	The preview bottom padding in pixes. Useful to keep the appropriate preview sizes when orientation changes (applicable to the android and ios platforms only)
rotateWhenOrientationChanged	boolean	Rotate preview when orientation changes (applicable to the ios platforms only; default value is true)
position	string	Choose the camera to use 'front' or 'rear', default 'front'
enableHighResolution	boolean	Defaults to false - iOS only - Activate high resolution image capture so that output images are from the highest resolution possible on the device *

Type Aliases

CameraPosition

'rear' | 'front'