Scaling and Clipping a Photo/Image

I would like to select a RECTANGULAR photo (similar to PhotoPicker sample), scale to a SQUARE profile picture box and would like to clip the remaining part (extra WIDTH or HEIGHT outside of the square box) of the image.

I tried setMask and it doesn’t work well, once I scale the photo to the square profile box size. It shows a smaller version of the clipped image. I tried to play with maskScaleX & maskScaleY settings - doesn’t seem to work.

Any help or suggestions or pointers would be appreciated. Thanks. [import]uid: 48484 topic_id: 29925 reply_id: 329925[/import]

I haven’t tried this yet, but it looks promising:
http://developer.coronalabs.com/code/useful-crop-library
[import]uid: 110228 topic_id: 29925 reply_id: 119978[/import]

I recently implemented something similar. The below just crops a section of what’s visible on the screen and saves it to a file.

--set content bounds based on area of screen you want to extract --adjust bounds to suit your needs local contentBounds = { xMin = 0, yMin = 35, xMax = 420, yMax = 333 } local capture = display.captureBounds(contentBounds, false) -- save to library = false display.save(capture, "my\_cropped\_images/crop.jpg") capture:removeSelf() [import]uid: 92150 topic_id: 29925 reply_id: 119996[/import]

@greenrift - Thanks for your suggestion. I think that your suggestion works on clipping a portion of the displayed image.

The problem that I would like to solve is - displaying only the clipped image (without displaying the full image).

I have found a workaround for now - applying the mask on the group containing the scaled down image than on the image itself - works! [import]uid: 48484 topic_id: 29925 reply_id: 120177[/import]

@emaurina - Thanks for the suggestion. Will check on the crop library.

As I mentioned in my earlier post, I have a found a workaround for now. [import]uid: 48484 topic_id: 29925 reply_id: 120178[/import]

I haven’t tried this yet, but it looks promising:
http://developer.coronalabs.com/code/useful-crop-library
[import]uid: 110228 topic_id: 29925 reply_id: 119978[/import]

I recently implemented something similar. The below just crops a section of what’s visible on the screen and saves it to a file.

--set content bounds based on area of screen you want to extract --adjust bounds to suit your needs local contentBounds = { xMin = 0, yMin = 35, xMax = 420, yMax = 333 } local capture = display.captureBounds(contentBounds, false) -- save to library = false display.save(capture, "my\_cropped\_images/crop.jpg") capture:removeSelf() [import]uid: 92150 topic_id: 29925 reply_id: 119996[/import]

@greenrift - Thanks for your suggestion. I think that your suggestion works on clipping a portion of the displayed image.

The problem that I would like to solve is - displaying only the clipped image (without displaying the full image).

I have found a workaround for now - applying the mask on the group containing the scaled down image than on the image itself - works! [import]uid: 48484 topic_id: 29925 reply_id: 120177[/import]

@emaurina - Thanks for the suggestion. Will check on the crop library.

As I mentioned in my earlier post, I have a found a workaround for now. [import]uid: 48484 topic_id: 29925 reply_id: 120178[/import]