Image Resize client action for Mobile App?

Hi, on my requirement I need to have user sign up and getting their profile photo from camera.

But on modern smartphone, camera resolution so high that it create time-out when sending to server.

I have Image Resize server action to resize it before saving to database, but it will be better to resize image on client side before sending to server.

I only found Cropper mobile plugin which only crop, not resize the image.

Any ideas?

Thanks and Regards.

Hi Harlin,

You will have to use a Javascript node and some JS magic:

Check out this for example: https://stackoverflow.com/questions/19262141/resize-image-with-javascript-canvas-smoothly

Thanks, but I'm not JS guys...

I'm looking for mobile client plugin if available.

I will pass this to my team and hopefully can find a JS Guru to wrote plugin for this.

Harlin,

Check this out

https://www.outsystems.com/forge/component/1393/cropper-mobile/

Eric Halim wrote:

What I need is resizing profile picture image, is this cropper mobile plugin also can be used for resizing images?

Thanks.

That's true. Sorry that was cropper not resizer.

So I think it should be a cordova plugin then, like this one https://www.npmjs.com/package/cordova-plugin-image-resizer then wrap it on Outsystems.

Never tried it myself but that's the way it's supposed to be. :) worth to try

For P10 mobile app, I gladly present my new Image Utils Mobile component in Forge:

https://www.outsystems.com/forge/2078/

Resize (while maintaining aspect ratio), Crop, and Identify width/height of image binary data.

All works client-side, before sending image to server...

Thanks Harlin

Hi guys,

I am facing the issue for portrait images in cropper, When we take a picture in portrait mode, In Cropper preview image has changed the landscape,How solve this issue. This issue only for iphone

Thanks,

Nave

Nave Jothi wrote:

Try fixing image orientation first, then crop it. 

Hi Harlin,

You can use below component.it will compress the image size.

We have used in 2 project and working fine.

https://www.outsystems.com/forge/component-overview/2347/image-compress

Thanks,

Salman

Harlin Setiadarma wrote:

Hi,

Thanks for reply, where to set image orientation Css or cropper preview option, Can you please explain deeply

Nave Jothi wrote:

What plugin did you use exactly? 

Cropper plugin or Image Utils plugin? 

Harlin Setiadarma wrote:

Cropper plugin

Nave Jothi wrote:

Maybe it's better if you asked in Cropper plugin discussion.