PHP Thumbnail Image Resizing with proportions

Question

As a brief run down, I am currently making a dating type site. Users can create accounts and upload profile pictures (up to 8). In order to display these in the browse area of the website, I am looking for a way in PHP (with third party processor/scripts) to resize all images uploaded to have thumbnails that adhere to certain dimensions.

As an example, I will want "profile" images (thumbnails) to be NO larger than 120*150px. The scripting needs to resize uploaded images (regardless of whether they are portrait or landscape, and regardless of proportions) to adhere to these dimensions without getting stretched.

The width (eg. 120pixels) should always remain the same, but the height (eg. 150px) can vary in order to keep the image in proportion. If it's a landscape photo, I'm assuming the script would need to take a chunk out of the middle of the image?

The reason that all images to be resized is so that when profiles are display in a grid that all thumbnails are roughly the same size.

Any input would be greatly appreciated.

Answer 1

$maxwidth = 120;
$maxheight = 150;

$img = imagecreatefromjpeg($jpgimage); 
//or imagecreatefrompng,imagecreatefromgif,etc. depending on user's uploaded file extension

$width = imagesx($img); //get width and height of original image
$height = imagesy($img);

//determine which side is the longest to use in calculating length of the shorter side, since the longest will be the max size for whichever side is longest.    
if ($height > $width) 
{   
$ratio = $maxheight / $height;  
$newheight = $maxheight;
$newwidth = $width * $ratio; 
}
else 
{
$ratio = $maxwidth / $width;   
$newwidth = $maxwidth;  
$newheight = $height * $ratio;   
}

//create new image resource to hold the resized image
$newimg = imagecreatetruecolor($newwidth,$newheight); 

$palsize = ImageColorsTotal($img);  //Get palette size for original image
for ($i = 0; $i < $palsize; $i++) //Assign color palette to new image
{ 
$colors = ImageColorsForIndex($img, $i);   
ImageColorAllocate($newimg, $colors['red'], $colors['green'], $colors['blue']);
} 

//copy original image into new image at new size.
imagecopyresized($newimg, $img, 0, 0, 0, 0, $newwidth, $newheight, $width, $height);

imagejpeg($newimg,$outputfile); //$output file is the path/filename where you wish to save the file.  
//Have to figure that one out yourself using whatever rules you want.  Can use imagegif() or imagepng() or whatever.

This will shrink any images down proportionally based on whichever side is longer (width or height), to the maximum size. It will also blow up any images smaller than max, which you can stop with a bit of checking on whether or not both width and height are less than their max. So, a 200x300 image will be shrunk to 100x150, and a 300x200 image will be shrunk to 120x80.

Hmm, you want the width to always be 120, so it would change a bit, and yeah, it would have to cut something out in the case of an image like 200x300, because that would shrink to 120x180 without any distortion, or it would have to shrink it farther and letterbox it, but that should get you started nicely.

Letterboxing this example would just involve figuring out what the proper x and y to start the drawing to the new image would be in the imagecopyresized() function. In the case of something like 100x150, the X would be 10, I think, so there would be 10px of blank space on each side for 120x150 in the end. Letterboxing 120x80 X would be 0 but Y would be 35, so there would be 35px of blank space above and below for 120x150.

You'd also want to make $newimg with $maxwidth,$maxheight rather than $newwidth,$newheight, but the imagecopyresized() would still use both $new values.

Since I'm bored and don't have anything else to do, these changes would do it:

if ($height > $width) 
{   
$ratio = $maxheight / $height;  
$newheight = $maxheight;
$newwidth = $width * $ratio; 
$writex = round(($maxwidth - $newwidth) / 2);
$writey = 0;
{
else 
{
$ratio = $maxwidth / $width;   
$newwidth = $maxwidth;  
$newheight = $height * $ratio;   
$writex = 0;
$writey = round(($maxheight - $newheight) / 2);
}

$newimg = imagecreatetruecolor($maxwidth,$maxheight);

//Since you probably will want to set a color for the letter box do this
//Assign a color for the letterbox to the new image, 
//since this is the first call, for imagecolorallocate, it will set the background color
//in this case, black rgb(0,0,0)
imagecolorallocate($newimg,0,0,0);

//Loop Palette assignment stuff here

imagecopyresized($newimg, $img, $writex, $writey, 0, 0, $newwidth, $newheight, $width, $height);

That should work, haven't tried it yet.