Question

I have found a few things on the web about PHP+GD regarding image manipulation, but none seem to give me what I am looking for.

I have someone upload an image of any dimensions, the script I have written resizes the image to no more than 200px wide by 200px high while maintaining aspect ratio. So final image could be 150px by 200px for example. What I want to do is then manipulate the image further and add a matting around the image to pad it to 200px by 200px while not affecting the original image. For example:

The code I have to get the image resized is here, I have tried a few things, but am definitely having an issue implementing the secondary process of adding the padding.

list($imagewidth, $imageheight, $imageType) = getimagesize($image);
$imageType = image_type_to_mime_type($imageType);
$newImageWidth = ceil($width * $scale);
$newImageHeight = ceil($height * $scale);
$newImage = imagecreatetruecolor($newImageWidth,$newImageHeight);
switch($imageType) {
    case "image/gif":
        $source=imagecreatefromgif($image); 
        break;
    case "image/pjpeg":
    case "image/jpeg":
    case "image/jpg":
        $source=imagecreatefromjpeg($image); 
        break;
    case "image/png":
    case "image/x-png":
        $source=imagecreatefrompng($image); 
        break;
}
imagecopyresampled($newImage,$source,0,0,0,0,$newImageWidth,$newImageHeight,$width,$height);
imagejpeg($newImage,$image,80);
chmod($image, 0777);

I am thinking I need to use imagecopy() right after the imagecopyresampled() call. That way the image is already the size I want, I just need to create an image exactly 200 x 200 and paste $newImage into the center (vert and horiz) of that. Do I need to create an entirely new image and merge the two, or is there a way to just pad the image I alread have created ($newImage)? Thanks in advance, all the tutorials I have found have led me nowhere, and the only applicable one I found on SO was for android 🙁

Answer 1

1. Open the original image
2. Create a new blank image.
3. Fill the new image with the background colour your want
4. Use ImageCopyResampled to resize&copy the original image centered onto the new image
5. Save the new image

Instead of your switch statement you can also use

$img = imagecreatefromstring( file_get_contents ("path/to/image") );

This will auto detect the image type (if the imagetype is supported by your install)

Updated with code sample

$orig_filename = 'c:\temp\380x253.jpg';
$new_filename = 'c:\temp\test.jpg';

list($orig_w, $orig_h) = getimagesize($orig_filename);

$orig_img = imagecreatefromstring(file_get_contents($orig_filename));

$output_w = 200;
$output_h = 200;

// determine scale based on the longest edge
if ($orig_h > $orig_w) {
    $scale = $output_h/$orig_h;
} else {
    $scale = $output_w/$orig_w;
}

    // calc new image dimensions
$new_w =  $orig_w * $scale;
$new_h =  $orig_h * $scale;

echo "Scale: $scale<br />";
echo "New W: $new_w<br />";
echo "New H: $new_h<br />";

// determine offset coords so that new image is centered
$offset_x = ($output_w - $new_w) / 2;
$offset_y = ($output_h - $new_h) / 2;

    // create new image and fill with background colour
$new_img = imagecreatetruecolor($output_w, $output_h);
$bgcolor = imagecolorallocate($new_img, 255, 0, 0); // red
imagefill($new_img, 0, 0, $bgcolor); // fill background colour

    // copy and resize original image into center of new image
imagecopyresampled($new_img, $orig_img, $offset_x, $offset_y, 0, 0, $new_w, $new_h, $orig_w, $orig_h);

    //save it
imagejpeg($new_img, $new_filename, 80);