Cropping Image To Square Dimension With CodeIgniter

July 14th, 2010 by aditia rahman / 11 Comments  

     

I’ve posted similar article before but this time I want to do it with codeigniter, codeigniter have a powerful image manipulation class, in this post I will use it to make thumbnail square from image, let get directly to the code. I make the function inside the controller, this code is cropping image that already located on the server so the image path (not URL) have to be defined.

If you have dynamic variable to locate image on the server you can create function to check image type wheter is .png, .gif or .jpg then use the PHP GD function (imagecreatefromjpeg or imagecreatefrompng or imagecreatefromgif) to get the image width and height, in this code below it assume the image only in .jpg format.

And if you want to crop image from the uploaded file by the user it will make it easier, cause when you use codeigniter file uploading class there’s a built in property to get uploaded image width and image height automatically after the image was uploaded.

public function crop()
{
    $img_path = 'uploads\capsamples.jpg';
    $img_thumb = 'uploads\capsamples_thumb.jpg';

    $config['image_library'] = 'gd2';
    $config['source_image'] = $img_path;
    $config['create_thumb'] = TRUE;
    $config['maintain_ratio'] = FALSE;

    $img = imagecreatefromjpeg($img_path);
    $_width = imagesx($img);
    $_height = imagesy($img);

    $img_type = '';
    $thumb_size = 100;

    if ($_width > $_height)
    {
        // wide image
        $config['width'] = intval(($_width / $_height) * $thumb_size);
        if ($config['width'] % 2 != 0)
        {
            $config['width']++;
        }
        $config['height'] = $thumb_size;
        $img_type = 'wide';
    }
    else if ($_width < $_height)
    {
        // landscape image
        $config['width'] = $thumb_size;
        $config['height'] = intval(($_height / $_width) * $thumb_size);
        if ($config['height'] % 2 != 0)
        {
            $config['height']++;
        }
        $img_type = 'landscape';
    }
    else
    {
        // square image
        $config['width'] = $thumb_size;
        $config['height'] = $thumb_size;
        $img_type = 'square';
    }

    $this->load->library('image_lib');
    $this->image_lib->initialize($config);
    $this->image_lib->resize();

    // reconfigure the image lib for cropping
    $conf_new = array(
        'image_library' => 'gd2',
        'source_image' => $img_thumb,
        'create_thumb' => FALSE,
        'maintain_ratio' => FALSE,
        'width' => $thumb_size,
        'height' => $thumb_size
    );

    if ($img_type == 'wide')
    {
        $conf_new['x_axis'] = ($config['width'] - $thumb_size) / 2 ;
        $conf_new['y_axis'] = 0;
    }
    else if($img_type == 'landscape')
    {
        $conf_new['x_axis'] = 0;
        $conf_new['y_axis'] = ($config['height'] - $thumb_size) / 2;
    }
    else
    {
        $conf_new['x_axis'] = 0;
        $conf_new['y_axis'] = 0;
    }

    $this->image_lib->initialize($conf_new);

    $this->image_lib->crop();
}
        submit to reddit Delicious

11 Comments Leave a Comment Subscribe RSS

  • Carlo says:

    Thanks for the script! Works well and easy to implement…been searching a long while for this.

  • bima says:

    awesome dude…
    thanx…
    work with my CI Project
    greet
    bima (Indonesia)

  • Greg says:

    Good stuff! You could quite easily makes this script work dynamically with other file types by passing $img_path and $thumb_size to the function and using php’s getimagesize() within the function to get the image dimensions. Wrap it in a helper file and you got a handy CI utility.

  • Mike says:

    This is great man. Thanks a lot!

  • Alex says:

    Hey, thanks Aditia. Nicely thought out, appreciate the helpful post.

  • dalibor says:

    Thanks man, been looking for this for some time, I kinda sucks with math :(
    Do you know or can you point out what to change and where if I need final dimension to be say 100×150 instead of 100×100?
    It would then resize image to 100xXYZ or XYZx150 depending on its orientation, and then crop the bigger size to 150 so final image is 100×150?
    I guess your code works in a very similar way, just if you can pinpoint exact point where change can be made, that would be awesome!!! :)
    Thanks man!

  • Gordon says:

    Looks very good! Is there a software program I can download to make this easier than reprogramming things?

    Regards,

    Gordon

  • Anon says:

    Great script, however I have noticed by default that it crops the top left hand corner of every picture, how can you modify it so that it crops the centre of the picture?

    Thanks

  • virgil says:

    Is all that math overkill? Wouldn’t it be much simpler, when resizing to set master_dim as width or height depending on which side is bigger? Then crop.

  • pacob says:

    Great script. Only one small change required, you first resize the image and later you need crop from the previously thumbnailed image, not the original one. You need to add:

    $conf_new["source_image"] = original_image_thumb.jpg.

Leave a Comment