Adding small text fieldsAdded by IBM on May 2, 2012 | Version 1 (Original)
|The size of the text field visually tells users the amount of information that they are required to enter. Using small text fields informs users that only minimal input, such as one or two letters, is required.
The size of the text field visually tells users the amount of information that they are required to enter. Using small text fields informs users that only minimal input, such as one or two letters, is required.
Next, you will add small text fields to the form by dragging each label and field onto the canvas. Each label and field will open the Properties window once dropped on the canvas. Once added, we will explore how to resize the field by using the nudging technique.
The graphic below shows the small text fields you will add to the form.
- In the Palette, click Text Label.
- Click the canvas, below the Section A: Client Information label and line, to insert a field and label on the form.
- When the Properties window opens, type Title: in the Text area.
- Click OK to save the change and close the Properties window.
- In the Palette, click Entry Field and drop it onto the canvas beside the Title: label.
- Click OK to close the Properties window and add the field to the design canvas.
In the next steps you will use the nudge technique to resize the field by one pixel at a time. This keyboard technique can be used as an alternative to using the mouse with the grid.
- With the field selected, use the arrow keys to nudge it into position.
- Press the period key on your keyboard. The cursor changes from a four-way arrow to a two-way arrow on a side of the field item. Move from one edge to another by pressing the period key on your keyboard.
- Select the right side to resize, use the arrow keys on your keyboard to nudge the size of the item in 1 pixel increments.
Tip: To resize one grid width at a time, press Ctrl + an arrow key.
In the next steps, you will use the toolbar tools to align items on the form.
- Press Enter to accept the new size of the item.
- Copy and paste both the Title: label and field.
Position these items below the first set by dragging them into place. The ruler and grid will assist you by displaying blue lines when the items are aligned.
- Copy and paste four more times.
- Rename each label to reflect the following titles for each field:
Parent topic: Tutorial: Creating a simple form
- First name:
- Middle initial:
- Last name:
- Email address:
- Phone number: