Home arrow HTML arrow Page 5 - Submitting a Form Using an Image Tag

Submitting a Form Using an Image Tag

There are a number of ways to make the forms on your website more user friendly. This article will explain one way of doing this, which eliminates a page reload and replaces it with an image generated on the server.

Author Info:
By: Chris Root
Rating: 5 stars5 stars5 stars5 stars5 stars / 25
April 18, 2005
  1. · Submitting a Form Using an Image Tag
  2. · Submitting a Form
  3. · Processing the Form
  4. · The Server Side Code
  5. · GD Methods
  6. · Handling the Name
  7. · The TextBox Class
  8. · From the Top

print this article

Submitting a Form Using an Image Tag - GD Methods
(Page 5 of 8 )

In order to load an existing image for use by our application, we'll need to use the imagecreatefrompng() function. You can also use other image formats, provided you have the proper support libraries. This function accepts a single argument that is the path to an image as a string. It returns a resource handle to the image that you can then use to work with the image.

If you are going to draw anything with GD, including text, you will need to allocate a color to be used. The imagecolorallocate() function does just that. This function takes as its first argument the resource handle that was created with one of the image creation functions. The remaining three arguments are hexadecimal or numerical RGB values. For instance, allocating a blue color would look like the following:

$bluecolor = imagecolorallocate($resource,0,0,255);

If you choose, as I did in the example, to use the numerical values to define a color, the numbers must be between 0 and 255. The first value is red, the second green and the third blue. Mixing these three colors will give you any color you might need within the limits of an 8 bit pallet.

In GD you can use true type, postscript or freetype fonts. Your distribution may not have support for all of these. Check your php.ini configuration and the PHP documentation for details.

Whatever font system you use, I would suggest using your own fonts rather than any that are built in. In order to to do this you will need to make some fonts available for use by PHP. Rather than give PHP permission to your fonts directory, make a directory in your Web structure for fonts you might want to use with GD that has the proper permissions assigned to it.

In this example we'll be using True Type fonts. The function for creating text used in this project is imagettftext(). This function takes a whopping eight arguments for this example. The first is the image resource, then the font size as an integer, an angle parameter that allows the text to be drawn at an angle and a horizontal and vertical coordinate as integers. These are followed by the path to the font as a string and the string to print.

In order to center anything, we will need to determine some coordinates. Doing this with the image we just loaded is easy. Using imagesx() (width) and imagesy() (height), we can get the dimensions of the created image. Determining the size of a text block is a little more difficult.

blog comments powered by Disqus

- Does HTML5 Need a Main Element?
- Revisiting the HTML5 vs. Native Debate
- HTML5: Not for Phone Apps?
- HTML5 or Native?
- Job Hunting? Freelancer.com Lists This Quart...
- HTML5 in the News
- Report: HTML5 Mobile Performance Lags
- The Top HTML5 Audio Players
- Top HTML5 Video Tutorials
- HTML5: Reasons to Learn and Use It
- More of the Top Tutorials for HTML5 Forms
- MobileAppWizard Releases HTML5 App Builder
- HTML5 Boilerplate: Working with jQuery and M...
- HTML5 Boilerplate Introduction
- New API Platform for HTML5

Watch our Tech Videos 
Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Weekly Newsletter
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 

Developer Shed Affiliates


© 2003-2019 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials