How do i get a fixed ratio image cropping for selected pictures

@BioPerl wrote:

Hey guys,

I am trying to get my users to add avatars to their profile. I've done up a super simple select photo script, but the cropper aspect ratio gets skewed and it the final image gets squished or stretched in the app when the image is displayed to set ratio.

is there an easy way to add to my script the ability to fix the width of the cropper? I've seen other android apps do that. just dont know how:

$scope.galleryOpen = function(){
    try{
        myPopup.close();
        var options = {
            quality : 100,
            destinationType : Camera.DestinationType.FILE_URI,
            sourceType : Camera.PictureSourceType.PHOTOLIBRARY ,
            allowEdit : true,
            targetWidth: 250,
            targetHeight: 250,
            encodingType: Camera.EncodingType.JPEG,
            popoverOptions: CameraPopoverOptions,
            correctOrientation: true
        };
        $cordovaCamera.getPicture(options).then(function(imageData) {
            function convertImgToBase64(url, callback, outputFormat){
                var canvas = document.createElement('CANVAS'),
                    ctx = canvas.getContext('2d'),
                    img = new Image;
                img.crossOrigin = 'Anonymous';
                img.onload = function(){
                    var dataURL;
                    canvas.height = img.height;
                    canvas.width = img.width;
                    ctx.drawImage(img, 0, 0);
                    dataURL = canvas.toDataURL(outputFormat);
                    callback.call(this, dataURL);
                    canvas = null;
                };
                img.src = url;
            }

            convertImgToBase64(imageData, function(base64Img){
                $scope.ProfilePic = base64Img;
                $scope.uploadImage();
            });
        }, function(err) {
            alert(err.message);
        });
    }
    catch(err){
        alert(err.message);
    }
};

is it easier do you think to fix the ratio of the cropper OR is it easier to change the size of the final image so its not fixed and then have my code in css try and scale to fixed width?

thanks for your help! (also this code seems to only work in android , not in iOS, not sure why, thats problem two later).

Posts: 1

Participants: 1

Read full topic