Is there a method to resize bitmap image?

Question

I'm having problem with my file browser.

When it reached to any directory : Get folder list to list map, and use onBindCustomView for setting icon for each list items. If that file format is image, it shows the image preview instead of showing image icon.

But the problem is, one or less than 10 image file is OK. But when the image file count is reached to over 50, it lags very hard.

I think this lag problem is caused by image preview. Because it didn't resize, so I add the code to resize image preview from any x any to 100x100.

But there is another problem.

bitmap.createBitmap(bitmap, 0, 0, 100, 100)

This cut image and make it small. This only resize the image. So the result is the small part of image.

Is there a method to resize the image and keep the image looks original?

Try this :: https://stackoverflow.com/questions/10413659/how-to-resize-image-in-android :: or just google it. — Barns, Apr 25 '18 at 14:01

score 1 · Accepted Answer · answered Apr 25 '18 at 14:10

You can use canvas:
In your view.

<script>
$('#files')
    .bind('change', function(ev) {
        message_loading("none");
        ev.preventDefault();
        ev.stopPropagation();
        uploadFiles(this);
        message_loading("display");
    })
</script>

In your script

function uploadFiles(target) {
   var content = target.files;
   var img = reduceImgSize(content[0], content[0]["name"]);
}
function reduceImgSize(f, name){
    var reader = new FileReader();
    reader.onload = function (readerEvent) {
        var image = new Image();
        image.onload = function (imageEvent) {
            var canvas = document.createElement('canvas'),
                max_size = image.width/1.1, 
                width = image.width,
                height = image.height;
            if (width > height) {
                if (width > max_size) {
                    height *= max_size / width;
                    width = max_size;
                }
            } else {
                if (height > max_size) {
                    width *= max_size / height;
                    height = max_size;
                }
            }

            canvas.width = width; // write your width
            canvas.height = height; // write your height
            canvas.getContext('2d').drawImage(image, 0, 0, width, height);
            var dataUrl = canvas.toDataURL('image/jpeg');
            var resizedImage = dataURLToBlob(dataUrl);
            var imageFile = new File([resizedImage], name, {type : "image/jpeg"});
            return imageFile;
        }
        image.src = readerEvent.target.result;
    }
    reader.readAsDataURL(f);
}

I hope it helps

I have not tried in chrome, but in firefox mobile works. – Marlon Adarme Apr 25 '18 at 14:28 — Marlon Adarme, Apr 25 '18 at 14:28

Is there a method to resize bitmap image?

1 Answers1