Let's continue designing our "List of Names" window. It is assumed that you've removed any controls you added in previous sections of this tutorial. Remember that we want to create a window that looks like this:

Let's first add the "Names:" text label above the box (where names are displayed). Move the mouse pointer over the button in the Toolbox that indicates it is a "Text" control, and click on this button to select it:

Now move the mouse pointer toward the upper left corner of the window we're designing, and click in a blank area to drop that text control in the window. It will look something like this:

If you need to move this control so that it is positioned more like in the first picture above, you can grab and move the control to the desired location.

You'll notice that the label displayed is "Text". We want to change this to "Names:". You'll remember that you double-clicked on the window itself to bring up its properties dialog. So too, each control you put into the window has its own properties dialog. Simply move the mouse pointer over that text control, and double-click the left mouse button. This opens the TEXT Properties dialog. This contains many settings you can change for this one control. Some of the settings affect its appearance. Other settings affect how it operates. For now, we'll simply change the label.

Into the box labeled Caption, type Names: as so:

Click on the OK button and the TEXT Properties dialog will disappear. You should now see the label change to "Names:".

If some of the text is cut off, you can grab one of the sizing boxes and resize the control as so:

Tip: You can also quickly resize the control to fit its text by clicking on the Toolbox "Size to text" operation button.

Now let's add a listbox to our window. Move the mouse pointer over the button in the Toolbox that indicates it's a "List" control, and click on this button to select it:

Now move the mouse pointer toward the upper left corner of your window, beneath where you put the "Names:" text control, and click in a blank area to place a list box control in the window. It will look something like this:

The list box is arbitrarily filled with a few strings to show you what it will look like when you add some strings to the list box.

Again, if you need to move this list box, you can grab and move the control just like you did with the text control. You can also size the list box with the 8 sizing boxes on its edges.

And if you move the mouse over the list box and double-click the left mouse button, this will open the LIST Properties for this list box. You'll notice that many of the settings are different than the TEXT Properties dialog. After all, a list box is different than a text control. Some settings are the same. We really do not need to change any of this control's settings, so you can simply click the OK button.

Now let's place our "Add" button in the window. Find the Toolbox button that indicates it is a "Push" control, and select this. Move the mouse pointer over to our window, to the right of the list box, and click in a blank area. You should see a button control appear with a default label of "Push". We need to change this label to "Add". As you'll probably guess, you do this by double-clicking on that Push button to bring up the PUSH Properties dialog. Into the box labeled Caption, type "Add", and then click the OK button. The PUSH Properties dialog will disappear, and the control's label will change to "Add".

Repeat the above process to add another Push control to your window. Place it below the "Add" control. Change its label to "Delete". You should now have a window that looks like the picture at the top of this page. You may want to move around the controls a little to line them up evenly. (Remember that the arrow keys on the keyboard can move the selected control in fine increments). This is where some of the Toolbox's operation buttons can prove useful. For example, let's say that you dropped the Add and Delete buttons so that they were slightly askew as so:

Select both controls and make sure that the "Add" control is the dominant control as so:

Now find the Toolbox operation button labeled "Align left". (It should be the first operation button).

Click on it, and you'll notice that the "Add" and "Delete" push buttons have been moved so that the Delete button's left edge lines up with the Add button (because the Add button is the dominant control here). Also notice that the list box and text control have not changed position. The Toolbox's operation buttons affect only the selected controls.