Page 1 of 1

Update an image file through a text field

Posted: Sun Jul 05, 2009 9:57 am
by Melee
Hello,

I am wondering if anyone can help me with this. I need a php script that helps me update an image file through a text field on a page.
So I can type something in the text field, press a button and it appears on the image.

I've been looking for help and tutorials but I did not find anything.

If I am not specific enough, please say so.

Thanks in advance,

Melee

E-mail adress: Melee.viii@gmail.com

Re: Update an image file through a text field

Posted: Sun Jul 05, 2009 10:14 am
by Skara
Check out imagettftext().

If you want to add it to an existing jpeg, then you'll need to start with imagecreatefromjpeg()

Re: Update an image file through a text field

Posted: Sun Jul 05, 2009 11:46 am
by Melee
I don't understand any of that, to be honest...
I'm pretty new to php, you see.

Re: Update an image file through a text field

Posted: Sun Jul 05, 2009 1:31 pm
by Skara
Um.. ok, maybe you should start with something else if you don't know the language at all. Once you have a basic grasp of it, those two manual pages should tell you everything you need to know.

Basically your code would look something like..

Code: Select all

$image = imagecreatefromjpeg('./path/to/existing/image.jpg');
$black = imagecolorallocate($image, 0, 0, 0);
imagettftext($image, 12, 0, 10, 10, $black, './path/to/font.ttf', 'whatever text you want to add');
imagejpeg($image);
modify to whatever your requirements are.

If that's über-confusing, look up an introductory tutorial first.

If you have any specific questions, please ask them, but it's kinda hard to answer "I don't understand."

Re: Update an image file through a text field

Posted: Sun Jul 05, 2009 1:33 pm
by McInfo
I see Skara beat me to it, but I'll post anyway.

Start with the basics.

img-a.php

Code: Select all

<?php
// Creates an image resource which exists in memory until the script ends.
// The image is 240 pixels wide by 120 pixels high and has a black background.
$img = imagecreatetruecolor(240, 120);
 
// Tells the browser to expect a PNG image.
header('Content-Type: image/png');
 
// Outputs the image to the browser in PNG format.
imagepng($img);
?>
Now for something more complex. Let's say you save the image created by img-a.php to img-a.jpg.

img-b.php

Code: Select all

<?php
// Creates an image resource from the file img-a.png.
$img = imagecreatefrompng('./img-a.png');
 
// Allocates an RGB color (red) to be used with the image resource.
$red = imagecolorallocate($img, 255, 0, 0);
 
// Draws a rectangle 60 pixels wide by 30 pixels high that is positioned
// 10 pixels from the left edge and 20 pixels from the top edge.
imagefilledrectangle($img, 10, 20, 70, 50, $red);
 
// Saves the image to a file, but does not send it to the browser.
imagejpeg($img, './img-b.jpg');
 
// Tells the browser to expect a JPEG image.
header('Content-Type: image/jpeg');
 
// Outputs the image to the browser in JPEG format.
imagejpeg($img);
 
// Destroys the image resource.
imagedestroy($img);
?>
Related topic: 101361 (involves anti-aliasing, true-type fonts and text alignment)

Edit: This post was recovered from search engine cache.

Re: Update an image file through a text field

Posted: Sun Jul 05, 2009 1:52 pm
by Melee
I thought I might be able to do it using POST?

Re: Update an image file through a text field

Posted: Sun Jul 05, 2009 2:06 pm
by Skara
Yes, that's correct. $_GET and $_POST variables are what is used as the vehicle for variables in html forms.

If you're editing the actual image...

Code: Select all

 
<form method="post">
<input type='text' name='imagetext' />
<input type='submit' value='Add Text' />
</form>
<?php
if (isset($_POST['imagetext'])) {
    $image = imagecreatefromjpeg('someimage.jpg');
    $black = imagecolorallocate($image, 0, 0, 0);
    imagettftext($image, 12, 0, 10, 10, $black, './path/to/font.ttf', $_POST['imagetext']);
    imagejpeg($image, 'newimage.jpg');
    echo '<img src="newimage.jpg" alt="original image plus text" />';
}
else {
    echo '<img src="someimage.jpg" alt="the original image" />';
}
?>
 
I'm not sure about the security of imagettftext() running directly off of a POST variable. It probably won't hurt anything...

Please take my advise, though, and learn this for yourself. Never run code you don't completely understand.

Re: Update an image file through a text field

Posted: Sun Jul 05, 2009 3:27 pm
by Melee
Thank you!
Though I do have one question...
Is there a way to improve the quality of the image?
Because right now the image has a really bad quality if I use this script. :(

EDIT: Nevermind I changed it to .png and now it works! Thank you! :D <3

Re: Update an image file through a text field

Posted: Sun Jul 05, 2009 3:32 pm
by McInfo
PHP Manual wrote:bool imagejpeg ( resource $image [, string $filename [, int $quality ]] )

quality is optional, and ranges from 0 (worst quality, smaller file) to 100 (best quality, biggest file). The default is the default IJG quality value (about 75).
Use the $quality parameter of imagejpeg() or use a different image format like PNG.

Edit: This post was recovered from search engine cache.

Re: Update an image file through a text field

Posted: Sun Jul 05, 2009 4:47 pm
by Melee
There's just one more problem.
Even though it works on my pc, it won't work on my server...

I keep getting this error.

Code: Select all

Warning: imagettftext() [function.imagettftext]: Could not find/open font in /usr/home/xxx/domains/xxxx.com/public_html/xxxx/imagetext/update.php on line 31
What do I have to do in order to fix this?

Re: Update an image file through a text field

Posted: Sun Jul 05, 2009 6:41 pm
by Skara
imagettftext() requires a ttf font file in order to work--hence the name.
Upload whatever true type font you like to the directory and change the parameter to match.

Code: Select all

imagettftext($image, 12, 0, 10, 10, $black, 'your_uploaded_font.ttf', $_POST['imagetext']);

Re: Update an image file through a text field

Posted: Mon Jul 06, 2009 3:45 am
by Melee
Skara wrote:imagettftext() requires a ttf font file in order to work--hence the name.
Upload whatever true type font you like to the directory and change the parameter to match.

Code: Select all

imagettftext($image, 12, 0, 10, 10, $black, 'your_uploaded_font.ttf', $_POST['imagetext']);
I did that, but the problem was the .ttf extension which needed to be .TTF. That fixed it. :)

Thanks for everything.