This is a lightweight image cropping component designed to bring a smooth and professional image upload experience to OutSystems Reactive Web applications.
The component features click-to-upload support for maximum usability across devices. Once an image is selected, the component presents a fully interactive cropping interface powered by Cropper.js, enabling users to adjust the crop area, pan the image, zoom in/out, and preview the final output before confirming.
Developers can configure:
Cropped image width & height
PNG or JPEG output
Maximum file size (in KB)
Automatic PNG scaling or JPEG quality reduction
The final output is returned as Binary Data, ready for saving into an OutSystems entity, sending to a server action, or using directly in the UI.
The asset also includes:
“Pick another image” restart button
Runtime compression logic
A full demo screen showing exactly how to integrate the component
A clean, responsive design fully compatible with OutSystems UI
Use this component to power image uploads for user profiles, product catalogs, photo submissions, ID uploads, and anywhere else your application needs consistent, optimized image input.