parent
0c407140f5
commit
ad8338e7ad
@ -1,7 +1,4 @@
|
||||
package com.tauri.api
|
||||
|
||||
import app.tauri.plugin.PluginManager
|
||||
|
||||
class MainActivity : TauriActivity() {
|
||||
var pluginManager: PluginManager = PluginManager(this)
|
||||
}
|
||||
|
@ -0,0 +1,128 @@
|
||||
<script>
|
||||
import { scan } from "tauri-plugin-barcode-scanner-api";
|
||||
|
||||
export let onMessage;
|
||||
|
||||
let scanning = false;
|
||||
let windowed = true;
|
||||
|
||||
function startScan() {
|
||||
scanning = true;
|
||||
scan({ windowed })
|
||||
.then((res) => {
|
||||
scanning = false;
|
||||
onMessage(res);
|
||||
})
|
||||
.catch((error) => {
|
||||
scanning = false;
|
||||
onMessage(error);
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="full-height">
|
||||
<div class:invisible={scanning}>
|
||||
<div>
|
||||
<input type="checkbox" id="scanner-windowed" bind:checked={windowed} />
|
||||
<label for="scanner-windowed">Windowed</label>
|
||||
</div>
|
||||
<button class="btn" type="button" on:click={startScan}>Scan</button>
|
||||
</div>
|
||||
<div class="scanning full-height" class:invisible={!scanning}>
|
||||
<div class="scanner-background">
|
||||
<!-- this background simulates the camera view -->
|
||||
</div>
|
||||
<div class="container full-height">
|
||||
<div class="barcode-scanner--area--container">
|
||||
<div class="relative">
|
||||
<p>Aim your camera at a QR code</p>
|
||||
</div>
|
||||
<div class="square surround-cover">
|
||||
<div class="barcode-scanner--area--outer surround-cover">
|
||||
<div class="barcode-scanner--area--inner" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.invisible {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.full-height {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
p {
|
||||
color: #fff;
|
||||
font-family: sans-serif;
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
.container {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.relative {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.square {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
transition: 0.3s;
|
||||
}
|
||||
.square:after {
|
||||
content: "";
|
||||
top: 0;
|
||||
display: block;
|
||||
padding-bottom: 100%;
|
||||
}
|
||||
.square > div {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.surround-cover {
|
||||
box-shadow: 0 0 0 99999px rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
.barcode-scanner--area--container {
|
||||
width: 80%;
|
||||
max-width: min(500px, 80vh);
|
||||
margin: auto;
|
||||
}
|
||||
.barcode-scanner--area--outer {
|
||||
display: flex;
|
||||
border-radius: 1em;
|
||||
}
|
||||
.barcode-scanner--area--inner {
|
||||
width: 100%;
|
||||
margin: 1rem;
|
||||
border: 2px solid #fff;
|
||||
box-shadow: 0px 0px 2px 1px rgb(0 0 0 / 0.5),
|
||||
inset 0px 0px 2px 1px rgb(0 0 0 / 0.5);
|
||||
border-radius: 1rem;
|
||||
}
|
||||
|
||||
.scanner-background {
|
||||
background: linear-gradient(45deg, #673ab7, transparent);
|
||||
background-position: 45% 50%;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
</style>
|
@ -1,59 +1,83 @@
|
||||
import { invoke } from '@tauri-apps/api/tauri'
|
||||
import { invoke } from "@tauri-apps/api/tauri";
|
||||
|
||||
type PermissionState = 'granted' | 'denied'
|
||||
type PermissionState = "granted" | "denied";
|
||||
|
||||
type Format = 'QR_CODE' | 'UPC_A' | 'UPC_E' | 'EAN_8' | 'EAN_13' | 'CODE_39' | 'CODE_93' | 'CODE_128' | 'CODABAR' | 'ITF' | 'AZTEC' | 'DATA_MATRIX' | 'PDF_417'
|
||||
type Format =
|
||||
| "QR_CODE"
|
||||
| "UPC_A"
|
||||
| "UPC_E"
|
||||
| "EAN_8"
|
||||
| "EAN_13"
|
||||
| "CODE_39"
|
||||
| "CODE_93"
|
||||
| "CODE_128"
|
||||
| "CODABAR"
|
||||
| "ITF"
|
||||
| "AZTEC"
|
||||
| "DATA_MATRIX"
|
||||
| "PDF_417";
|
||||
|
||||
interface ScanOptions {
|
||||
cameraDirection?: 'back' | 'front'
|
||||
formats?: Format[]
|
||||
cameraDirection?: "back" | "front";
|
||||
formats?: Format[];
|
||||
windowed?: boolean;
|
||||
}
|
||||
|
||||
interface PrepareOptions {
|
||||
cameraDirection?: 'back' | 'front'
|
||||
cameraDirection?: "back" | "front";
|
||||
windowed?: boolean;
|
||||
}
|
||||
|
||||
interface Scanned {
|
||||
content: string;
|
||||
bounds: unknown;
|
||||
}
|
||||
|
||||
/**
|
||||
* Prepare the camera before starting scanning.
|
||||
* This is optional, only use it if you need a small performance improvement when preparing a scan in advance.
|
||||
* @param options
|
||||
* @param options
|
||||
*/
|
||||
export async function prepare(options?: PrepareOptions) {
|
||||
invoke('plugin:barcodeScanner|prepare', { ...options })
|
||||
export async function prepare(options?: PrepareOptions): Promise<void> {
|
||||
return await invoke("plugin:barcodeScanner|prepare", { ...options });
|
||||
}
|
||||
|
||||
/**
|
||||
* Start scanning.
|
||||
* @param options
|
||||
* @param options
|
||||
*/
|
||||
export async function scan(options?: ScanOptions) {
|
||||
invoke('plugin:barcodeScanner|scan', { ...options })
|
||||
export async function scan(options?: ScanOptions): Promise<Scanned> {
|
||||
return await invoke("plugin:barcodeScanner|scan", { ...options });
|
||||
}
|
||||
|
||||
/**
|
||||
* Cancel the current scan process.
|
||||
*/
|
||||
export async function cancel() {
|
||||
invoke('plugin:barcodeScanner|cancel')
|
||||
export async function cancel(): Promise<void> {
|
||||
return await invoke("plugin:barcodeScanner|cancel");
|
||||
}
|
||||
|
||||
/**
|
||||
* Get permission state.
|
||||
*/
|
||||
export async function checkPermissions(): Promise<PermissionState> {
|
||||
return invoke<{ camera: PermissionState }>('plugin:barcodeScanner|check_permissions').then(r => r.camera)
|
||||
return await invoke<{ camera: PermissionState }>(
|
||||
"plugin:barcodeScanner|check_permissions"
|
||||
).then((r) => r.camera);
|
||||
}
|
||||
|
||||
/**
|
||||
* Request permissions to use the camera.
|
||||
*/
|
||||
export async function requestPermissions(): Promise<PermissionState> {
|
||||
return invoke<{ camera: PermissionState }>('plugin:barcodeScanner|request_permissions').then(r => r.camera)
|
||||
return await invoke<{ camera: PermissionState }>(
|
||||
"plugin:barcodeScanner|request_permissions"
|
||||
).then((r) => r.camera);
|
||||
}
|
||||
|
||||
/**
|
||||
* Open application settings. Useful if permission was denied and the user must manually enable it.
|
||||
*/
|
||||
export async function openAppSettings() {
|
||||
invoke('plugin:barcodeScanner|open_app_settings')
|
||||
export async function openAppSettings(): Promise<void> {
|
||||
return await invoke("plugin:barcodeScanner|open_app_settings");
|
||||
}
|
||||
|
Loading…
Reference in new issue