SAP / ui5-webcomponents

UI5 Web Components - the enterprise-flavored sugar on top of native APIs! Build SAP Fiori user interfaces with the technology of your choice.
https://sap.github.io/ui5-webcomponents/
Apache License 2.0
1.46k stars 253 forks source link

[Feature Request]: fiori/BarcodeScannerDialog capture video image from centered region only #8918

Open slin-sap opened 1 month ago

slin-sap commented 1 month ago

Feature Request Description

Current implementation seems to pass the entire image captured by camera to zxing. This might lead to an unexpected nearby barcode label to be capture instead.

Proposed Solution

It is better to show a focused region like this example screenshot. Or something similar to UI5 sap.ndc.BarcodeScanner animated scanning css effect. This can help user to position camera so that the barcode label fits within the centered region.

Screenshot 2024-05-08 at 8 34 35 AM

In the code, only the centered region needs to be draw to image canvas, and pass to zxing for barcode recognition.

This might require capturing video frame as image as done in sap.ndc.BarcodeScanner and then use codeReader.decodeFromImage API instead of decodeFromVideo.

https://github.com/zxing-js/library/blob/master/docs/examples/barcode-image/index.html

Proposed Alternatives

No response

Organization

UX Engineering

Additional Context

No response

Priority

Medium

Privacy Policy

niyap commented 1 month ago

Hello @SAP/ui5-webcomponents-topic-p ,

Could you please take a look of this feature request?

Thank you in advance!

Kind Regards, Niya

jdichev commented 1 month ago

Team will look into this request. Internal reference: BGSOFUIPIRIN-6561

dobrinyonkov commented 6 days ago

POC: https://github.com/SAP/ui5-webcomponents/pull/9259