Adding Images to Your Application

How to:

You can use images to improve the appearance and usability of App Studio Maintain Data applications. This section explains how to:

Procedure: How to Add a New Background Image to Your Form

  1. Open Form1.
  2. Make sure all of the controls are deselected so that you can see the properties for the form.
  3. In the Properties panel for the form, locate the Background-image property in the Background category.
  4. Click the mouse in the input area to the right to display the ellipsis button.
  5. Click the ellipsis button, browse to Data Servers, EDASERVE, Application, maintain, images, and select spiral.gif.

    Note: Spiral.gif is one of the sample Tutorial files that was placed on your hard drive at installation. It should be located in \ibi\apps\Maintain\images.

  6. Use the Background-repeat property to set it to repeat-y. This makes the image repeat for the entire height of the form.

    Your form resembles the following image.



    You may need to move the controls on your form to the right so that they are not overlapping the spiral.

Procedure: How to Add an Existing Background Image to Your Form

  1. Add the spiral image to the ShowFan form.
  2. Run your application to see how it looks.
  3. Click the Exit button to close the application before continuing the tutorial.

Procedure: How to Add an Image to Your Form

  1. Open Form1.
  2. Select all the controls on your form by pressing Ctrl+A and move them down so that you have roughly one inch at the top of your form.
  3. On the Components tab, select the Image control.
  4. Draw a box in the empty space at the top of the form.

    The HTML canvas opens the Open File dialog box.

  5. Repeat the steps you followed in How to Add a New Background Image to Your Form to add Addafan.gif to your form.
  6. Add the fan.gif image to your form to the right of the entry boxes. (Repeat steps 3 through 5.)

    Your form resembles the following image.



  7. Open ShowFan and add the image currfan.gif. (Repeat steps 3 through 5.)
  8. Run your application to see how it looks.
  9. When you are done, exit your application by clicking Exit.