Coder Social home page Coder Social logo

piotrfleury / camcode Goto Github PK

View Code? Open in Web Editor NEW
13.0 4.0 11.0 221 KB

a Flutter web camera barcode scan library

Home Page: https://camcode-59c70.web.app/#/

License: BSD 3-Clause "New" or "Revised" License

Kotlin 3.52% Swift 2.57% Objective-C 1.89% Dart 77.76% HTML 5.93% JavaScript 2.09% Ruby 6.25%

camcode's Introduction

camcode

A camera barcode scan library for Flutter Web

Web build status

Getting Started

Add a javascript file for barcode scan

function detectBarcode(dataUrl, callback) {

    // call here your favorite javascript barcode scan library
    // input must be an image dataUrl
    // output must be a single String

    // don't forget to trigger the call back in order to get the result
    callback(barcode);
}

Import javascript files into your index.html

<script src="LINK_TO_MY_AWESOME_JAVASCRIPT_BARCODE_SCAN_LIB"></script>
<script src="js/barcode.js"></script> // the javascript file with the detectBarcode function

Use it

import 'package:camcode/cam_code_scanner.dart';

showDialog(
    context: context,
    builder: (context) => CamCodeScanner(
    width: MediaQuery.of(context).size.width,
    height: MediaQuery.of(context).size.height,
    refreshDelayMillis: 200,
    onBarcodeResult: (barcode) {
        // do whatever you want
    },
    minimalResultCount: 2,
    ),
);

More options

Manually release resources

Sometimes, depending on your camcode usage, you may need to release resources manually.

1- To do so, create first a controller for the scanner

// Create a controller to send instructions to scanner
  final CamCodeScannerController _controller = CamCodeScannerController();

2- Then, add it to the CamCodeScanner

CamCodeScanner(
    width: ...,
    height: ...,
    refreshDelayMillis: ...,
    onBarcodeResult: (barcode) {
        ...
    },
    controller: _controller,
),

3- And finally, just call releaseResources() method when required

ElevatedButton(
    onPressed: () {
        _controller.releaseResources();
    },
    child: Text('Release resources'),
),

Calling this method will close the camera and stop the scanner process

camcode's People

Contributors

dependabot[bot] avatar gwaelesadeo avatar piotrfleury avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

camcode's Issues

Question - My phone shows a blank screen and i cannot run in local and web server

My phone doesn't show the reader.
He requests the camera but nothing appears.

Every time I try to run the program on a server localhost, the application shows a screen with no information and gives the following error :

Error: PlatformException(error, TypeError: Cannot read property 'apply' of undefined, null, null)
at Object.throw_ [as throw] (http://10.0.0.146/dart_sdk.js:5063:11)
at StandardMethodCodec.decodeEnvelope (http://10.0.0.146/packages/flutter/src/services/system_channels.dart.lib.js:1351:19)
at platform_channel.MethodChannel.new._invokeMethod (http://10.0.0.146/packages/flutter/src/services/system_channels.dart.lib.js:1500:47)
at _invokeMethod.next ()
at http://10.0.0.146/dart_sdk.js:37788:33
at _RootZone.runUnary (http://10.0.0.146/dart_sdk.js:37659:59)
at _FutureListener.thenAwait.handleValue (http://10.0.0.146/dart_sdk.js:32861:29)
at handleValueCallback (http://10.0.0.146/dart_sdk.js:33413:49)
at Function._propagateToListeners (http://10.0.0.146/dart_sdk.js:33451:17)
at _Future.new.[_completeWithValue] (http://10.0.0.146/dart_sdk.js:33299:23)
at async._AsyncCallbackEntry.new.callback (http://10.0.0.146/dart_sdk.js:33320:35)
at Object._microtaskLoop (http://10.0.0.146/dart_sdk.js:37926:13)
at _startMicrotaskLoop (http://10.0.0.146/dart_sdk.js:37932:13)
at http://10.0.0.146/dart_sdk.js:33667:9

I'm new on flutter and I'm testing your package, would appreciate your answer c:

And sorry for my bad english, i'm a brazillian guy.

Getting TypeError when opening the scan page

Using this in a web app and when tapping on a button

 onTap: () {
            openScanner(context, _onResult);},

I'm getting the below error over and over

TypeError: dart.global.detectBarcode is not a function
packages/camcode/camcode_web.dart 280:5                                  _takePicture
dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 84:54       runBody
dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 123:5       _async
packages/camcode/camcode_web.dart 240:28                                 [_takePicture]
packages/camcode/camcode_web.dart 233:9                                  <fn>
dart-sdk/lib/_internal/js_dev_runtime/private/isolate_helper.dart 80:17  <fn>
Webcam taille : 1080 & 1920
Webcam video taille : 0 & 0
[โœ“] Flutter (Channel stable, 3.3.7, on macOS 12.6 21G115 darwin-x64, locale en-RO)
[โœ“] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
[โœ“] Xcode - develop for iOS and macOS (Xcode 13.4.1)
[โœ“] Chrome - develop for the web
[!] Android Studio (not installed)
[โœ“] VS Code (version 1.73.1)
[โœ“] Connected device (2 available)
[โœ“] HTTP Host Availability

Camera Access in Mobile Browser

Hi,

i have some issiues but i'm not sure of these.

When i want to use my app in phone browser(iphone se 2 generation, safari) camera is not working.
I'm just seing loading indicator but when i test it chrome on windows it is work properly.

Bottom overflowed

On version 1.0.4, there is a bottom overflow

My code :

void _webScanCamera(Task task) {
  showDialog(
    context: context,
    builder: (context) => CamCodeScanner(
      width: MediaQuery.of(context).size.width,
      height: MediaQuery.of(context).size.height,
      refreshDelayMillis: 200,
      onBarcodeResult: (barcode) {
        Navigator.of(context).pop();
        _handleWebScanResult(barcode, task);
      },
    ),
  );
}

Capture Response time is too high

hello dear i used your package and it works well with web but the main issue are
it is very slow in scanning the code as it take too much time in seconds, once it scan it just disappear like it calls releaseResource() and if and then there is no option to rescan anyother thing i have to reload my page for that,

Trying to use back camera on Android device (Flutter Web app). fetchDeviceList never completes

I'm using an Android tablet running this as a Flutter web app. I'm using Quagga like the example. The barcode.js code looks like this:

function detectBarcode(dataUrl, callback) {
    Quagga.decodeSingle({
        decoder: {
            readers: [
                "code_128_reader",
                "ean_reader",
                "ean_8_reader",
                "code_39_reader",
                "code_39_vin_reader",
                "code_93_reader"
            ] // List of active readers
        },
        locate: true, // try to locate the barcode in the image
        src: dataUrl // or 'data:image/jpg;base64,' + data
    }, function (result) {
        if (result && result.codeResult) {
            console.log("result", result.codeResult.code);
            callback(result.codeResult.code);
        } else {
            console.log("not detected");
        }
    });
}

After some research I thought maybe I could use the CamCodeScannerController.selectDevice() function to set it to the back camera. So I tried to use CamCodeScannerController.fetchDeviceList(), but that never completes when I call it (i.e. if I do await CamCodeScannerController.fetchDeviceList() it never gets past that line).

At this point I'm not even sure if I'm supposed to be setting the device in the Quagga code or in the CamCodeScannerController.

So to reiterate: The end goal is to get it to use the back camera instead of the front camera.

Camera view on iOS doesn't work

When open the CamCodeScanner() in Safari/Chomre/FireFox on my IPhone XR (14.4.2) i just get an black screen. But i get the red camera icon and the green dot which indicate that the camera is activated.

On Android and Desktop it works fine in all browsers. Andy hints?

Thanks in forward.

MissingPluginException

MissingPluginException(No implementation found for method initialize on channel camcode)
#0 MethodChannel._invokeMethod (package:flutter/src/services/platform_channel.dart:154:7)
E/flutter (15395):
E/flutter (15395): #1 _CamCodeScannerState.initialize (package:camcode/cam_code_scanner.dart:82:18)
E/flutter (15395):

Camcode - different notes

Hi
Thank you for this project.
We wanted to create a non-profit app to scan the dangerous food products and tested your module.
Some notes:

The scan area is bit small, can it take wider?

We need to keep the camera close to the product, possible to make it more sensitive

Important! Tested on Samsung S8 and Samsung S21 Android phones.
S21 cannot read the codebar.

Is it possible to contact you via email or other for more technical questions?

Thank you

improve efficiency of camcode

Hello,

Scanner should recognize barcodes in less than 1 second
User should not be forced to manage the zoom with the distance between phone and sticker to scan

Thank you Piotr :D

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.