Barcode Scanning with Google Vision and ML Kit in .NET MAUI

[@jfversluis]

Looking for that other barcode scanning plugin ZXing? Got a video on that right herekzbin.info/www/bejne/paTXmJ1oraeSpc0

[@charlesstacyharrisiii2593]

Thanks for covering this one! It's the library that I've been using, and it is a lot faster than the alternatives! Keep the fantastic content coming!

[@jfversluis]

Definitely will do! Thanks for watching!

[@alibouzrouti744]

The finest thing a person can reach is to educate the other. Thank you for your efforts.

[@jfversluis]

I love that saying, thank you for sharing that!

[@80amnesia]

omg another barcode scanning, amazing , thanks again

[@Andres-wo5oi]

Gerald aqui un seguidor de habla hispana, me encantan tus videos son cortos pero con mucho contenido interesante. estoy suscrito. Gracias!!!!

[@jfversluis]

¡Hola amigo! Yo soy estudio español. But I still needed to Google translate your message 😅 Thank you so much Andres! Appreciate your support!

[@delusionfish9606]

It works greatly. But i dont know how to make mvvm style.

[@metacapitalism5113]

So cool! Time to write POS systems with Maui!

[@jfversluis]

That would be cool!

[@metacapitalism5113]

I created a tech startup & prototyped a POS system (targeting Microsoft Surface) for the cannabis industry here in the State of Washington when it was legalized. It of course tracks using barcodes from seed to sale. It also had to include a all the functionality of a enterprise management system (accounting, inventory, sales, marketing, etc.). But those with better political connections won out so that startup didn't last as it was created for just that purpose.

[@mrnguyenlee]

Hi, I got an error 'Could not create an native instance of the type 'MLKit.BarcodeScanning.BarcodeScannerOptions': the native class hasn't been loaded. I am using mix Maui page and blazor

[@fenya18]

One thing worth mentioning is that this scanner is not working on emulators, throws a NullReferenceExeption. Also I found a solution to test scanning on emulators, you just have to add virtual scene images in the emulator Settings -> Camera.

[@jfversluis]

Oh that’s a good one, thanks! Yeah I didn’t even bother for emulators as that wouldn’t be much use 😬

[@jensevent1284]

Did you manage to solve the emulator issue? Adding virtual scene's still throws a NullException on my side...

[@fenya18]

@@jensevent1284 virtual scenes only add an image inside the camera testing environment, will not fix the scanner on emulator. It is useful if you are testing other scanners, for example the one from zxing.

[@DocuFlow]

Thank you! This was really helpful. I'll cast my vote for a tutorial about scanning barcodes from images, cheers! Edit: is it possible to take a photo with this control as well?

[@jfversluis]

You might want to look at the Camera.MAUI plugin which can take pictures as wel as scanning barcodes, Barcode scanning: kzbin.info/www/bejne/fKbZd6V_iJ6qo5I Taking images: kzbin.info/www/bejne/pJ29hH-Gm5dlrKs

[@developerrog7126]

Great to know about, thanx Gerald! 🎉

[@jfversluis]

Haha oops. This was supposed to be private first! Published by mistake so the first version was probably lacking a thumbnail and description haha. Thanks for watching!

[@SuperT]

I hope when I develop this into my project I’d works better than ZXing, currently it fails to scan most barcodes even though I implemented it following your other tutorial lol

[@jfversluis]

Hm that is weird. I think there were some strange gotchas like only scanning in landscape or you needed to enable some property in the settings like TryInverse? That made it work. Does that help?

[@siyathweb]

@@jfversluis this solution only works in android. For ios it doesn't even build. Because of that path error like firebase.ios.core

[@НикитаЗападнов]

Works perfect, thanks

[@Pevi70]

Dit werkt perfect Gerald! Ik liep wel tegen een probleempje aan dat ik de CameraView weer wilde verbergen na een scan en dat lijkt niet te werken. Als ik na een Scan IsVisible op false zet, reageert de layout wel op het verdwijnen van de Camera viewer, maar ik zie nog steeds de camerabeelden. Heb jij enig idee?

[@jfversluis]

Waarschijnlijk even kijken op de repository of er een bug voor gemeld is en anders even doen!

[@Pevi70]

Bedankt voor de tip, had ik mss zelf ook kunnen bedenken 😅. Er zijn idd ook andere gebruikers tegenaan gelopen.

[@sandhya2592]

Anyway we can get this working with a .NET 8 android and iOS app which does not use MAUI yet?

[@jfversluis]

Not without extracting the android code to your own project I think

[@checox1909]

Mmmm interesting 🤔🤔 there is something we can use to scan text form an object using the camera ?

[@jfversluis]

I would think there is functionality for that, but not a ready to use .NET MAUI plugin as far as I know.

[@TheStormbreaker07]

Thanks for all you do. Does this plugin support Machine Readable Zones? Or do you have a suggestion for that?

[@jfversluis]

This plugin does not, it's specific to barcodes. I don't know of any libraries, at least not MAUI specific that do that. I think there are some C# ones that you should be able to use either on the device itself or maybe on the backend by using a picture of the document.

[@water5089]

Hi, cool video. Is there a good MVVM way to close/open the CameraView?

[@jfversluis]

Looks like this might be helpful: github.com/JimmyPun610/BarcodeScanner.Mobile/tree/master/SampleApp.Maui/Mvvm

[@volum2569]

Thanks for your educational videos. I have a question. Handheld terminals have their own barcode reading feature, how can I integrate this into my project?

[@volum2569]

handheld terminal android operating system

[@jfversluis]

That terminal will have to have an SDK that can work with .NET!

[@volum2569]

Tanks. I found :)

[@thiagofortini7114]

Hi! let me ask, do you know any solution for car plate? I mean take a pic and save only the car plate numbers

[@vinodkk2007]

Nice video. Is this supposed to work on iOS? It asks for Camera permission. After that it just shows a blank screen, it does not show the camera view.

[@jfversluis]

I definitely also tested this on iOS! Check the repo for potential issues

[@Noglazer]

I am having the same issue

[@zok1708ify]

On Android it works great, but I don't know why on iOS I get the error "The selected camera is not supported on this device" in the Program.cs file in the line UIApplication.Main(args, null, typeof(AppDelegate))

[@bdgmsoft9062]

Awesome... waiting for another video with ean-13 Barcode generator? Thanks Sir

[@jfversluis]

This one might be helpful" kzbin.info/www/bejne/pmWlg6aagshqhaM

[@frankleib4176]

Hi, what is the way/the different to implement it in a Maui Blazor App (I use only Blazor and look at first your clips, because you use it too and ok your clips are very good ...)? Thx :)

[@jfversluis]

Thanks Frank! I should do more Blazor Hybrid so maybe I’ll come up with some of that. For mixing .NET MAUI and Blazor like in this example, this video might help: 3 Ways Combine .NET MAUI and .NET MAUI Blazor Hybrid kzbin.info/www/bejne/aJXPna1qg792Zqs

[@tanakamawere]

Great video Gerald as always. I do need clarification though on the state of MAUI. I am planning on making a large application, of course with MAUI but I am skeptical of the lifetime of MAUI. I see that Microsoft uses React Native for its own apps and doesn't use its own App development stack. Does this mean development with MAUI is tricky as the plug can be pulled similar to SIlverlight

[@jfversluis]

Thank you Tanaka!

[@ihcahgem]

is it possible to crop and extract the security tag's image using the vision api?

[@mohammedalsabahii2]

Great to know about it ,, dose net maui support Google ML Kit or if the a plugins for ML Kit ? , thank a lot

[@jfversluis]

Someone would have to create the plugins/bindings for it, but otherwise you can use them, yes!

[@mohammedalsabahii2]

@@jfversluis that's awesome thank you

[@LeonoX97]

I love it thank you

[@jfversluis]

Awesome! Thanks for watching!

[@armageddontri7]

Does the barcode scanner work for grocery items?

[@bobanlapcevic5406]

Thanks. How to add camera focus ?

[@jfversluis]

Check the library docs. Not sure if that’s supported

[@claude4074]

Gerald, how do we use this in MAUI Blazor?

[@jfversluis]

This might help: 3 Ways Combine .NET MAUI and .NET MAUI Blazor Hybrid kzbin.info/www/bejne/aJXPna1qg792Zqs

[@reinierkops]

Great video, but keep in mind the requirement of Google Play Services (which not everyone has on there mobile devices).

[@jfversluis]

Definitely a good thing to keep in mind, thanks!

[@kkn385heyahsshshshd]

Can u please make a short video how u mirror your android phone screen to your pc?

[@jfversluis]

It’s called Phone Link, built into Windows but it doesn’t work on all phones unfortunately

[@PunisherSamo]

Can we can barcode from saved picture as well , instead of frame from camera ? Thanks

[@jfversluis]

I think you should be able to do that with this plugin. Have a look at this video for Xamarin.Forms where I do that: kzbin.info/www/bejne/qXLNan-feKZ6orM

[@haeun159951]

when the qrcode is displayed in the dark mode, the barcode scanner doesn't detect/work, is there a possible solution/workaround for this?

[@jfversluis]

I think there is some property like “scan inverse” or something that should help here

[@hakhov1]

Thank you!!!

[@jfversluis]

You're welcome!

[@fahadbytes]

Love it.

[@jfversluis]

Thanks appreciate it!

[@cissemy]

How to batch scan?

[@jfversluis]

You’ll probably need to implement something for that yourself

[@Noglazer]

On iOS, the page appears blank after granting permissions. Did anyone else see this issue?

[@Noglazer]

I tested on MAUI 7 with the version 7 plugin and also MAUI 8. Permission is granted successfully but the camera page appears blank with no camera.

[@Noglazer]

This was resolved by removing the FillAndExpand options and setting a specific HeightRequest and WidthRequest. Now the camera shows on iOS.

[@jfversluis]

Gld you figured it out!

[@lifecraft2646]

Is it only for Android, or can it be used on iOS?

[@jfversluis]

iOS and Android as mentioned in the video

[@ea543]

@@jfversluis but, ios => MSB401 ResolveNativeReferences System.ComponentModel.Win32Exception:The system cannot find the file specified

[@tangle5511]

Google Vision and ML Kit is free?

[@jfversluis]

I think so! I didn't enter any API keys or something so it probably uses a local model

[@kwasit3707]

First

[@jfversluis]

Now I know I have made it as a creator with these type of comments... Thank you!