Crop/clip imageView
Is there any way to crop or clip and imageView?
I have both landscape and portrait images and I'm going to resize them down to a grid and then show them, and they have to be the same dimension, let say 50x50 without being stretched.
2 Answers
-
You can crop an image without using an external module. Here's how to crop 100x100 pixels from an image starting at position 200,200 and then display the cropped image in an image view:
// Here's our base (full-size) image. // It's never displayed as-is. var baseImage = Titanium.UI.createImageView({ image:'flower.jpg', width:512, height:512, }); // Here's the view we'll use to do the cropping. // It's never displayed either. var cropView = Titanium.UI.createView({ width:100, height:100 }); // Add the image to the crop-view. // Position it left and above origin. cropView.add(baseImage); baseImage.left=-200; baseImage.top=-200; // now convert the crop-view to an image Blob var croppedImage = cropView.toImage(); // make an imageView containing the image Blob var imageView = Titanium.UI.createImageView({ image:croppedImage, width: 100, height:100 }); // add it to the window win1.add(imageView);
It would be fairly trivial to make this into a function to crop any image and return either a Blob containing the cropped image or an image view object containing the cropped image.
-
Yes there is a way to do that, a user has developed a Patch to allow crop of an imageView. Look at this QA entry:
http://developer.appcelerator.com/question/90691/cropclip-image-module-from-kosso-