How to build an Image Cropper Control in Angular with Material and ngx-image-cropper

[@gmexpert3530]

how can i resize the image that will get cropped. For smaller images the cropper is really small it would be really helpful if we could resize the original image before loading it on the cropper

[@iqrasharif-sx5fj]

aslam o alaikum sir mei y properties camera capicator angualr mei use krna chti hn capturd imag eko rotate aur crop krna chahi hn but how?

[@ZoaibKhan]

Aap Ionic Capacitor ke baat kar rahe hain?

[@iqrasharif-sx5fj]

@@ZoaibKhan gg

[@hugimo-kun7924]

Is it possible in the dialog to have a circle ratio instead of a square in the cropper to get a circle image ?

[@hugimo-kun7924]

ah yes i just found it, it's [roundCropper] = "true"

[@gunderaopatil476]

Will ngx image cropper works for already uploaded image . ? I mean once you upload and click on that and cropp it

[@ZoaibKhan]

Yup, from their official docs, you can use the imageUrl input parameter to specify the image. github.com/Mawi137/ngx-image-cropper?tab=readme-ov-file#inputs

[@C.Ruiloba]

why didnt you use input signals there instead?

[@ZoaibKhan]

I think this video was done before signal inputs came along :)

[@shivajitiwari7047]

Will it support keyboard arrows to crop the image.

[@ZoaibKhan]

I'm not sure about this

[@sandeeptiwari602]

how to store url image in form of base64 encoded?

[@ZoaibKhan]

If I recall, there is a property for that in the cropper package we're using

[@gekoskipatric]

will this work with an ng-module based app?

[@ZoaibKhan]

Yes, it should work

[@moudjahidinesalissou9011]

Can I use it with bootstrap instead of Angular Material?

[@ZoaibKhan]

Sure, just use the bootstrap components such as buttons and the modal dialog instead of the material ones!

[@steve-o2198]

Great video, thank you so much!

[@ZoaibKhan]

You're welcome, Steve!

[@ParvezKhan-j8g]

start teaching angular from basics for beginners that would be a huge help

[@ZoaibKhan]

Ok, noted!

[@JB-sv8oh]

great video! thank u s much

[@ZoaibKhan]

You're welcome 🤗

[@techwake360]

awesome