[TIMOB-10080] Android: Parity for Ti.Blob methods
| GitHub Issue | n/a |
|---|---|
| Type | Sub-task |
| Priority | High |
| Status | Closed |
| Resolution | Fixed |
| Resolution Date | 2012-11-13T21:42:37.000+0000 |
| Affected Version/s | Release 2.1.0 |
| Fix Version/s | Sprint 2012-17 API, Release 3.0.0 |
| Components | Android |
| Labels | api, module_imageview, parity, qe-testadded |
| Reporter | Vishal Duggal |
| Assignee | Ping Wang |
| Created | 2012-07-23T09:43:45.000+0000 |
| Updated | 2013-10-03T12:52:04.000+0000 |
Description
Parity ticket see parent ticket for details on missing methods.
We should take a look at github.com/yagitoshiro/ImageAsResized for the Android platform.
This module is generally good but crashes when resizing large images (such as those directly from the phone's camera).
For functional test: 1. Run the test code below. 2. Click "Open Gallery" and choose one image. 3. Click the other buttons to check the functionality of the new methods. 4. Repeat step 2-3 if needed. Note: i) If the original image size is very large, "Add Transparent Border" and "Add Rounded Corners" may result in a crash due to memory issues. End developers should pre-process (eg. crop or resize) images before adding a border or rounded corners. ii) "Thumbnail Image", "Add Transparent Border" and "Add Rounded Corners" will add a transparent border to the image. Since the background color for the imageview is blue, you will see a "blue" border around the image.
var win = Ti.UI.createWindow({ backgroundColor : "black" }); var currentImage = null; var openGallery = Ti.UI.createButton({ height : 50, top : 0, title : "Open Gallery" }); var cropButton = Ti.UI.createButton({ height : 50, top : 50, title : "Crop Image" }); var resizeButton = Ti.UI.createButton({ height : 50, top : 100, title : "Resize Image" }); var thumbnailButton = Ti.UI.createButton({ height : 50, top : 150, title : "Thumbnail Image" }); var borderButton = Ti.UI.createButton({ height : 50, top : 200, title : "Add Transparent Border" }); var cornerButton = Ti.UI.createButton({ height : 50, top : 250, title : "Add Rounded Corners" }); var imgView = Ti.UI.createImageView({ backgroundColor : 'blue', top : 300 }); openGallery.addEventListener("click", function() { Titanium.Media.openPhotoGallery({ success : function(event) { var image = event.media; currentImage = image; imgView.width = currentImage.width / 5; imgView.height = currentImage.height / 5; imgView.image = currentImage; Ti.API.info("************original: width = " + currentImage.width + ", height = " + currentImage.height); }, cancel : function() { }, error : function(error) { }, saveToPhotoGallery : false, mediaTypes : [Ti.Media.MEDIA_TYPE_PHOTO] }); }); cropButton.addEventListener("click", function() { if (currentImage !== null) { var croppedImg = currentImage.imageAsCropped({ width : currentImage.width / 4, height : currentImage.height / 4 }); imgView.width = croppedImg.width; imgView.height = croppedImg.height; imgView.image = croppedImg; currentImage = croppedImg; Ti.API.info("************cropped: width = " + currentImage.width + ", height = " + currentImage.height); } }); resizeButton.addEventListener("click", function() { if (currentImage !== null) { var resizeImg = currentImage.imageAsResized(300, 400); imgView.width = resizeImg.width; imgView.height = resizeImg.height; imgView.image = resizeImg; currentImage = resizeImg; Ti.API.info("************resized: width = " + currentImage.width + ", height = " + currentImage.height); } }); thumbnailButton.addEventListener("click", function() { if (currentImage !== null) { var thumbnailImg = currentImage.imageAsThumbnail(200, 10, 20); imgView.width = thumbnailImg.width; imgView.height = thumbnailImg.height; imgView.image = thumbnailImg; currentImage = thumbnailImg; Ti.API.info("************thumbnail: width = " + currentImage.width + ", height = " + currentImage.height); } }); borderButton.addEventListener("click", function() { if (currentImage !== null) { var borderImg = currentImage.imageWithTransparentBorder(10); imgView.width = borderImg.width; imgView.height = borderImg.height; imgView.image = borderImg; currentImage = borderImg; Ti.API.info("************added border: width = " + currentImage.width + ", height = " + currentImage.height); } }); cornerButton.addEventListener("click", function() { if (currentImage !== null) { var cornerImg = currentImage.imageWithRoundedCorner(20); imgView.width = cornerImg.width; imgView.height = cornerImg.height; imgView.image = cornerImg; currentImage = cornerImg; Ti.API.info("************rounded corners: width = " + currentImage.width + ", height = " + currentImage.height); } }); win.add(openGallery); win.add(cropButton); win.add(resizeButton); win.add(thumbnailButton); win.add(borderButton); win.add(cornerButton); win.add(imgView); win.open();PR https://github.com/appcelerator/titanium_mobile/pull/2833
Glad to see this implemented. But have you looked into using inSampleSize to return a smaller image for memory management? Thanks
Tested and verified fix with: Titanium Studio, build: 3.0.0.201211071923 Titanium SDK, build: 3.0.0.v20121112140159 Device: Nexus7 4.1.2 The behavior as described above. Closing as fixed.
The test app does not include the test for "imageWithAlpha". This function adds an alpha channel to the image but the alpha value is 255 for the whole image which means the image is opaque. So we can not tell the difference between the input and the output image by eyes.