Take Pictures in .NET MAUI with the Camera.MAUI CameraView!

[@jfversluis]

Looking for the videos mentioned in this video? Here they are! ZXing Barcode Scanning video: kzbin.info/www/bejne/paTXmJ1oraeSpc0 Google Vision ML Kit Barcode Scanning: kzbin.info/www/bejne/jYizY6djd5p0erc

[@GIMMY2K1]

You are right, but it's a preview :(

[@rushas]

Great quality content as always. I like that you cover the topics that are not usually picked up by other mobile development youtubers, like barcode scanners. This is what makes your chanel unique and your content original 👏

[@jfversluis]

Thank you so much Ruslan! Much appreciated!

[@Golden_games]

I will say it again. each time I see your videos am always filled with joy because either it solves something for me or pushes me to where I can solve things my self. keep it up

[@jfversluis]

Only if you keep it up with posting great comments like these 🥰 thank you!

[@Golden_games]

@@jfversluis No problem

[@nurfitriabdhalim3607]

It's very awesome! I use the snapshot stream retrieve from camera view after calling the get snapshot and send the stream for azure OCR recognition, and update the text directly in the view directly. So satisfying 🎉

[@jfversluis]

Ooh very cool! Open source a sample and I’ll make a video!

[@stonedhackerman]

Finally! It was a real shame that more than a year after GA, we still didn't have a CameraView

[@jfversluis]

In that time you could have built it yourself! 😏

[@stonedhackerman]

@@jfversluis I did for Android, but I have no IOS devices. My point was tho, that a CameraView seems like an essential feature and its a shame MS didnt implement it themselves

[@jfversluis]

Sure, but it’s also a shame we didn’t implement x, y, z. There is only so much we can do unfortunately. I’d love to have it all but we can’t. This control is important to you, another control is important to another person. Luckily we have an amazing community that creates things like these!

[@aslamiqbal3435]

This is what I was looking for. I wanted to 1. Scan QR/BAR code automatically 2. Use as a movement detector. Thanks, Gerald 💌

[@jfversluis]

Perfect! Glad I could help!

[@aslamiqbal3435]

@@jfversluis I learned from you a lot about MAUI/xamarin.

[@aslamiqbal3435]

@@jfversluis I follow you almost all of your LinkedIn posts. Have you noticed?

[@KoushalMalviya-sd4jv]

Thank you sir for video I am implementing this package for IOS also but StartRecordingAsync Method is not working, Please tell me what to do for IOS. Thanks

[@Donald.Archer]

That is awesome! I was thinking about creating a clone of the SkyView app, as it doesn't work very well here in South Africa. I was wanting to show the camera feed, and then overlay the planets, stars, moon, sun, maybe even satellites. I have to also figure out the relative positions of those bodies with respect to my GPS / Elevation / Compass heading, etc. But I thought it would be quite a fun experiment.

[@jfversluis]

That sounds pretty cool! Let me know when you pull that off!

[@GIMMY2K1]

Great !!! Finally a non-preview solution. Can you also make an example of Barcode detection/decode with this nuget ?

[@jfversluis]

The preview label is always such a psychological barrier I feel 😅 you’re trusting the judgement of the author. I know packages that are much more stable in preview and of course vice versa. I’ll have a look at also showing barcode scanning with this one!

[@GIMMY2K1]

@@jfversluis good, free examples ?

[@vijaichaudhary8092]

Thank you Gerald.

[@jfversluis]

Most welcome my friend!

[@paulsanders1687]

Thank you for the video works great, any chance you could explore the other features like snapshotstream, what I want to do is get the image in a form where I can store it in a database ideally SQL.

[@josemanuelgroo]

you are awesome, thanks for all the great work you do!!

[@jfversluis]

Thank you! 🥰

[@BrunswickGauss]

I want to congratulate you on your channel, it is very substantial, I have seen several tips, which are very good, and taking advantage of your knowledge on the subject, will you have a video that shows how to communicate the phone via USB, either in Serial form such as RS232 or Using the USB Bulk? Thank you very much for your attention

[@jaotech2]

Greetings, what a great contribution! Do you know if with this camera control I can design a rectangular frame above as if the user needs to take a screenshot of a personal card?

[@jfversluis]

Just place the camera view and whatever you want to use in the same Grid column and row so they will overlap and go nuts with your design!

[@jaotech2]

@@jfversluis Thank you, I was pleased to subscribe to your channel!

[@temurjuma]

Thank you for the video. I have been struggling with the savesnapshot. I am not getting an error - but no photo is saved in the Cache folder. Any demos on using this command? string mainDir = FileSystem.Current.CacheDirectory; string filePath = Path.Combine(mainDir, "test.png"); await camCamera.SaveSnapShot(Camera.MAUI.ImageFormat.PNG, filePath);

[@samda7109]

Can the functionality of a camera be utilized to highlight specific sections of an image, in order to analyze them using OCR (Optical Character Recognition) software and save the results into a list? For example, to digitize forms.

[@muhammadibrahim-ye3hs]

Thanks for such a great video . Much needed video Really appreciate :)

[@jfversluis]

Glad to be of service!

[@vigo1301]

Great contribution Gerald, i have a problem with this plugin, my ios app is locked to not rotate, but the camera always rotates, do you know of any solution to this issue?

[@mohammedalsabahii2]

Thanks Gerald for this amazing plugin ,, Does this plugin support to switch between cameras to front or just work with back camera ?

[@jfversluis]

It's mentioned in the video 😉

[@knightfox1]

Thank you for your video. I am a newbie and there is this one thing I can not figure out. How do I write the path to save the image?

[@giuliuploader]

Hello, nice video. How can I switch to front camera, and visualize it or take a photo with it?

[@jfversluis]

I think that’s all mentioned in the video

[@DeepWorksStudios]

Thanks again for this valuable information ❤

[@jfversluis]

My pleasure!

[@kainafa]

Very good 🚀

[@jfversluis]

Thanks 🔥

[@watherby29]

Something for interfacing with fingerprint scanner please :)

[@jfversluis]

Check out github.com/FreakyAli/Plugin.Maui.Biometric

[@SpinelliJT]

Nice video, thanks for the content! Is there a way to pause and resume video recording using this camera view?

[@jfversluis]

I don’t think so!

[@SpinelliJT]

​@@jfversluisoh, that's a shame! You know any library capable of doing so in .net maui?

[@liemnguyen3088]

Great thank you!. Could please make a video show Camera Preview in Content Page NOT using nuget plug in. I need learn and a want to maintenance by my self. Thank a lot!

[@jfversluis]

Look at the code of the plugin repo, mind the license terms and use it in your own project. The camera controls is notoriously hard because the platform APIs are not great. That won’t make for a great video, sorry.

[@sameerafonseka4704]

Hi Gerald, Thanks for the video. I used the cameraview TakePhotoAsync method. Unfortunately when I close the app and open again and try to take a new image, previously taken images are rendered. I post an issue in Github too. I properly dispose the stream. Is it a know issue or any walkaround to this issue?

[@KenzoArts]

Hello Gerald, I am creating a profile page where a user can upload or take a selfie to be used on his profile page and this is the feature i was looking to implement into my MAUI application. I have one question : i saw in this tuturial you have plugin your android phone to computer but in my case is the iphone and i am wondering how to access my iphone from Visual Studio on windows machine. Do you have any clue ? Thank for your feedback and i love your content.

[@MudahnyaFizik]

Is there a way to crop the ImageSource of the captured image, and return the cropped image? Seems there are limited library for this.

[@jfversluis]

Built-in Microsoft.Maui.Graphics might be able to or SkiaSharp

[@Brendan2Alexander]

Awesome Gerald! Thank u

[@jfversluis]

Glad you enjoyed it! Thanks!

[@bhuwan99]

Can you suggest me best camera picker NuGet package which we are using MAUI.

[@jfversluis]

The best one is the one you like best 😉

[@jitendrajadav9110]

Great to see this plugin does it support Tagging like place, parking, market etc..?

[@jfversluis]

I don't think so!

[@jitendrajadav9110]

@@jfversluisVersluis Thank you! is there any plan for it?

[@jfversluis]

You’ll have to add the author of this plugin

[@nacertabib3158]

Hi Gerald, thanks for the work. Does this support partial camera view, like when you want just to capture a part of the camera view for text analysis for example

[@jfversluis]

Not yet I think, make sure to open a feature request on the repository!

[@hankdoout6845]

but, the new cameraview seems remove these method, how can I indicate the front camera? thanks

[@jfversluis]

Select Different Camera and Prevent Memory Leaks with CameraView kzbin.info/www/bejne/gIbHl3Rto6uXjdk

[@christianlindenblatt6815]

Thank u Gerald! Is your example repo MVVM compliant? I'm not sure, if it is better to implement the OnClick-Event in codebehind or in viewmodel. For example I have a page which collects some data (e.g. PersonDetailPage). One part is an image. For this I like to open a "TakePicturePage". This page is equal to your example. But there are different ways to send this picture from TakePicturePage back to the PersonDetailPage. Do you have an example repo, where this behaviour is explained?

[@LEGIT_ELITE]

I've been looking for a solution to this problem for so long have you found a good solution?

[@wildannugraha1130]

hi gerald, i want to ask, is it possible to create overlay like rectangle / create custom button in official mediapicker camera plugin ?

[@jfversluis]

Unfortunately not with the official MediaPicker, no

[@Onri]

Gerald does Maui have OCR

[@jfversluis]

We don’t have anything in .NET MAUI directly. But if the platform supports it you can easily use it from within .NET MAUI yourself

[@Onri]

@@jfversluis Ty

[@antonioya]

Thanks for this tutorial, it has helped me a lot. I've been testing and I can't find a way to change the resolution of the Android camera. It seems that the maximum resolution is the size of the screen image. How can I make the camera use the maximum resolution?

[@antonioya]

And...how can I save the image in Android? I have looked your video to save a drawing. I tried to convert the SnapShot to Stream, but it looks there is no method for this. EDIT: I have found SaveSnapShot, but how set the path in Android?

[@kingggerald]

Did you get a fix for this yet? I am also looking into changing the resolution :)

[@mohamadrezamohamadi9915]

Thanks for help❤

[@jfversluis]

Glad you find it useful!

[@temurjuma]

Спасибо тебе за видео. У меня возникли проблемы с сохранением снимка. Я не получаю сообщение об ошибке, но в папке «Кэш» не сохраняется ни одна фотография. Есть ли демонстрации по использованию этой команды? строка mainDir = FileSystem.Current.CacheDirectory; строка filePath = Path.Combine(mainDir, "test.png"); дождитесь camCamera.SaveSnapShot(Camera.MAUI.ImageFormat.PNG, filePath);

[@bedzgaming2935]

hi Gerald can you create a qr scanner that can save in sqlite after you scan the qr code

[@jfversluis]

Sure! Capture the result and save it as a string

[@mohammedmahmoud4872]

Hey gerald in xamarin forms in xamarin community toolkit there was toast msssage like snackbar you can customize it with color or event or something. Where can i find something like that in maui

[@jfversluis]

In the .NET MAUI Community Toolkit: kzbin.info/www/bejne/qHeteYxtjrBpjJY

[@mohammedmahmoud4872]

Man i love you

[@ranlevi6975]

Hi @Gerald Versluis this package does not detect my 0.5x Zoom Camera on my galaxy a50, do you have any suggestions? thank you!

[@jfversluis]

Hm not really, sorry!

[@hattmann]

Hello! Do you know if the Maui Bug with Android 11 and accessing the MediaPicker will be solved soon?

[@jfversluis]

I don’t know, sorry!

[@adambenge2562]

Does this work with Android 13 (SDK 33)?

[@jfversluis]

It should!

[@johnsontsang2518]

how about Burst mode shots?

[@jfversluis]

Don't think that's supported right now

[@ItsSalesGabriel]

Awesome 🔥🔥

[@jfversluis]

Thanks!

[@johns4651]

I am slightly confused by this project. It does not look like a .NET Maui application, I can see traditional "old-school" xmls views (like in Xamarin) but no .razor components or .razor pages with Blazor components as would be expected in a .NET Maui application. What is this project? I though the whole point of .NET Maui is to be able to write cross platform Blazor component based projects. using the tradiinal xmls views kind of defeats the purpose as it is regressive rather than reaping the benefits of Blazor applications.

[@jfversluis]

I think this is under the wrong video? Also xmls is not a thing. Do you mean XAML?

[@johns4651]

@@jfversluisAplogies, I meant xaml (autocorrect). We have discontinued Xamarin when doing projects for our clients, and all greenfield project we now do are .NET Maui applications. The project in the video looks like a Xamarin project (it uses Views and XAML markup for the UI), where in .NET Maui applications we use Blazor and thus .razor components, not Views. Hence I cannot see how this video would apply to a .NET Maui Blazor project. I thought sticking to the oldschool Xamarin-style coding defeats the purpose of all the improvements that came with .NET MAui with Blazor.

[@jfversluis]

@@johns4651 OK gotcha, so .NET MAUI Blazor Hybrid is not the only option. Our main product it still .NET MAUI based on XAML as you were used to with Xamarin.Forms. Blazor Hybrid is an option and if you prefer that, totally fine, but then you will have to find solutions that will work with that. In this case, the camera view, is very specific to non-Blazor use. If you still want to use it, you can but you'll have to mix it up, see: kzbin.info/www/bejne/aJXPna1qg792Zqs

[@johns4651]

​@@jfversluis Thank you for the link, I added it to my "watch later", it looks very useful. For now I've implemented the functionality with standard MediaPicker with Azure Cognitive Services SDK to analyze photographed product labels for text (OCR) and multiple barcodes. It works surprisingly well for a few hours initial work. We have complex requirements where the client will be taking photos of product labels as they arrive into the warehouse and the app would automatically GR them into inventory based on the label photo (of course each supplier has different label format, hence Cognitive Services are very handy as they not only extract text or barcodes but provide positional info or other metadata). The reason I was initially surprised is that our team has grown to hate Xamarin over the years as it was causing no end of issues in real enterprise applications. Yes it was quite revolutionary when it came out but Blazor Maui project are such as step-up in the real world applications that I would not expect anyone to use, de fecto "Xamarin" (dressed up, mind you, as a .NET Maui application) in 2023. When I think .NET Maui app I think Blazor by default. And I think this is Microsoft intention as well, with XAML/view provided primarily for "compatibility" for folks transitioning from Xamarin. Just like EV cars are a step-up to ICE cars. It also so much easier and quicker to code complex projects. Just a personal bias I admit!

[@jfversluis]

@johns4651 that is definitely very personal. The majority of people I talk to are very successful with Xamarin and now .NET MAUI. Anyway, glad you find something that works for you!

[@ahmedessa4906]

can you make video .NET MAUI Blazor with the Camera example

[@jfversluis]

You probably want to watch this: 3 Ways Combine .NET MAUI and .NET MAUI Blazor Hybrid kzbin.info/www/bejne/aJXPna1qg792Zqs

[@juandisk8]

Its just for images or also videos?

[@jfversluis]

I think just images for now

[@crystalcortexx]

Is it part of the community tool kit yet?

[@jfversluis]

Unfortunately not

[@crystalcortexx]

@@jfversluis amazing tutorial btw I'm currently using it right now. I'm a little confused about observables in MAUI and data binding is a tad confusing but I'm slowly getting there.... I hope. I am running into a null pointer exception sometimes :'(

[@jojoii7287]

Does the camera stop when changing the page?

[@jfversluis]

Might be! If it's not visible it's not of much use!

[@lexuanquy3920]

Hello sir. Can you help me to convert Imagesource to Mat for opencv

[@jfversluis]

I’m afraid not, sorry!

[@dilshadzm786]

how to configure it?

[@jfversluis]

Check the plugin repository for all the details

[@НесторГрин]

best

[@jfversluis]

Thanks!

[@josedonizeteoliveirajunior1744]

First!🎉

[@jfversluis]

Yes you are!

[@temurjuma]

Thank you for the video. I have been struggling with the savesnapshot. I am not getting an error - but no photo is saved in the Cache folder. Any demos on using this command? string mainDir = FileSystem.Current.CacheDirectory; string filePath = Path.Combine(mainDir, "test.png"); await camCamera.SaveSnapShot(Camera.MAUI.ImageFormat.PNG, filePath);

[@patricknance7938]

Thank you for the video. I have been struggling with the savesnapshot. I am not getting an error - but no photo is saved in the Cache folder. Any demos on using this command? string mainDir = FileSystem.Current.CacheDirectory; string filePath = Path.Combine(mainDir, "test.png"); await camCamera.SaveSnapShot(Camera.MAUI.ImageFormat.PNG, filePath);