Image Croping

[gunadat]

How to do Image cropping using php...

I needed 3 steps:
1. Upload a file, view before start cropping
2. Save the original image in the db, crop the image and replace it with the original image
3. View the cropped image and ask for upload another image..

[Kieran Y5]

Please stay awake when you read this. :)

Step 1: Check if you have the GD Graphics Library installed. This is what is used to work with images. (Use phpinfo(); and look for a section named "gd" and check to make sure it is enabled). Links: Wikipedia , Main Website

Step 2: Make an upload script. Instead of me pasting a trillion (well about 20) lines of code here, I have decided to link to some tutorials.

• W3Schools
• tizag

One thing they all do is the function move_uploaded_file() which is for copying the uploaded file onto the hard drive. Instead of this, you want to insert the temporary file into a database like any other piece of data. Just make sure that the column that you are trying to insert the data to is set to some type of "blob" (e.g. "longblob").

Step 3: Use GD to crop the image. Once again I have posted links to tutorials for this step. Some of these tutorials go into more detail than needed.

• TalkPHP Cropping Images
• John Conde
• Four Mules To May

Step 4: Save the new image to the data base (at least temporarily).

Step 5: Display the upload for again and put your image where you like.

How to display the image
In step 5 I said that you need to put the image on the page, but you can only do this using a <img> tag. This is really simple - all you need to know is where the image is (in the database) and what the file format is for it.

Step 1: Put an <img> tag on the page, with the SRC pointing to a PHP page. (e.g. <img alt="Dynamic Image" src="showImage.php" />

Step 2: Create the PHP page.

Step 3: In the PHP page, open a connection to the database and put the file format and file content into variables.

Step 4: Change the page header (BEFORE DISPLAYING ANY TEXT OR DATA). Different file formats use a different header. You can look them up on Google but I will be kind and show some here.

/* The following code may not work and cause errors because it is sending the header more than once. */

/* Header for PNG */
header('Content-Type: image/png');

/* Header for JPG/JPEG */
header('Content-Type: image/jpeg');

Step 5: Echo the file content. echo $fileContent;

Step 6: Call die(); just to make sure the script stops. Alternatively you can use exit();.

Your script *could* look something like this (excluding database bit).

if($fileFormat == 'jpg' || $fileFormat == 'jpeg')
{
    header('Content-Type: image/jpeg');
}
else
{
    /* assume file format is PNG - Could lead to problems! */
    header('Content-Type: image/png');
}

echo $fileContent;
die();

I hope this helps - I might just submit this as a tutorial :)
Sorry about its length - A good tutorial goes into great detail(ish). :)

Kieran