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.

Eric Halim wrote:

Harlin,

Check this out

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

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:

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

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:

Nave Jothi wrote:

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

Try fixing image orientation first, then crop it. 


Hi,

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


Nave Jothi wrote:

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

What plugin did you use exactly? 

Cropper plugin or Image Utils plugin? 


Harlin Setiadarma wrote:

Nave Jothi wrote:

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

What plugin did you use exactly? 

Cropper plugin or Image Utils plugin? 



Cropper plugin

Nave Jothi wrote:

Harlin Setiadarma wrote:

Nave Jothi wrote:

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

What plugin did you use exactly? 

Cropper plugin or Image Utils plugin? 



Cropper plugin

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