Programming in Delphi uses components, like the button and label. And so, it comes with a library of them, known as the Visual Component Library (VCL). In this course, we'll be going through some of the more useful ones to start you off.

Common Properties

Before we start rattling off our list of components, let's go through some of the properties which are common to most components. These won't be explained too much later, because they usually do the same thing to all the controls.

• Caption
  If the component displays text, that text is usually its Caption. If you change it, the displayed text changes too. For example, if we changed the caption of a form, its title bar would change too.
• Color
  If you're in a creative mood, Delphi lets you break free from monochrome windows and displays. Simply change the Color property, and the component will usually change its colour.
• Height, Width, Top, Left
  As you might have guessed, these properties determine where the component is placed, and how large it is. If you change them, the component resizes or re-positions accordingly.
• Enabled
  When a component isn't applicable, or shouldn't be modified by the user at runtime, you should turn its Enabled to false so that the user can't do anything about it. Of course, that doesn't mean that you, the programmer, can't touch it either...
• Visible
  When something should be there, but not be seen, set its Visible to false. You can still modify any of its visual properties, but because it's invisible, those changes can't be seen.
• PopupMenu
  This property sets up which pop up menu to appear when the user right-clicks on the component.
• TabStop, TabOrder
  Even though Windows naturally demands the use of a mouse, some users find using the keyboard more convenient and efficient. So be sure to set TabStop and TabOrder right for those die-hard keyboarders. TabStop determines whether pressing the Tab key will ever activate it. TabOrder is the order in which the controls are selected with Tab.
• Name
  When you first create components, they are given names like Form1 and Label2. As you might have realized, these names aren't very descriptive, making coding difficult and error-prone. So, whenever you need to, rename your components. lblMyName is much more understandable than something like Label12!
• Tag
  Sometimes, you'll need to store information inside the component itself. That's where Tag comes in - it can store an integer number from -2147483648 to 2147483647, and how you use it is entirely up to you. Tag is merely a storage place and does not affect the component in any way.

Of course, like properties, there are a few standard events that can occur. The code you write can be attached to any one of these events, so that it'll be executed when that event occurs.

• OnClick, OnDblClick, OnMouseDown, OnMouseUp, OnMouseMove
  The mouse can cause lots of events. By clicking it on the component, you get an OnClick. Double-clicking it causes an OnDblClick. Pushing the mouse button down causes an OnMouseDown while releasing it causes an OnMouseUp. Merely moving the mouse over a component will cause an OnMouseMove.
• OnKeyPress, OnKeyDown, OnKeyUp
  If the component is selected and a key is pressed, an OnKeyPress will occur. When the key is down, an OnKeyDown occurs. When released, an OnKeyUp occurs.
• OnEnter, OnExit
  When focus is given to a component, an OnEnter is generated. When the user leaves it, guess what? An OnExit is generated! With these two, you can make a component change its appearance only when it acquires focus.

Now that we've got that over with, let's start going! We won't be doing a complete runthough of all the components, but we'll cover enough of them for you to get a head-start. Good luck!

Button Pushing Jobs

Buttons are everywhere. On a dialog, on a toolbar, on the title bar, buttons are simplest form of interaction between human and software. Imagine the power a new user feels when he sees the screen sink in with the touch of a mouse... Opps, that's a bad joke. But quite honestly, the button is an extremely flexible gadget. You might be surprised at how many times buttons do a better job than some other component.

• Caption
  A note about the caption. An ampersand is a special character when it comes to buttons and so on. Instead of displaying the ampersand, what Windows does is to make the letter after the ampersand become a shortcut key and show it as underlined on the screen. For example, O&K will look like OK and pressing k will select it.
• Cancel
  If cancel is true, clicking on the button is equivalent to pressing Esc.
• Default
  If default is true (and only one button on each form can have a button with default true), pressing enter will select it no matter which other button has the focus.
• ModalResult
  A Delphi program can have more than one form, but only one appears unless you show the others. One way of doing so is to call ShowModal.

    Form2.ShowModal;
  

  The form will be shown modally, that is, you can't switch back to the first one without closing the modal form first. What ModalResult does for a button on a modal form is to close the modal form and return the ModalResult value back to the first form. For more details, press F1 while ModalResult is selected in your Object Inspector.

Not surprisingly, there is no OnDblClick for the button because buttons react immediately after each click. Other components, however, wait a moment after each click to determine whether it's an OnClick or OnDblClick.

A Group of Boxes Or A Box Of Groups?

Using RAD development systems has its benefits, but quite honestly, it breeds bad programming habits in the long run. One of them is being messy, and this messiness is reflected in some programs' interface design. Dispersed checkboxes, haphazardly placed buttons, and unnecessary repetition. Well, what can we do? Enter the GroupBox, this component holds your related components together, so nothing goes out of place.

Of course, there's a little catch to this. The GroupBox is supposed to hold components together, but to do this, the components must be inside the GroupBox. To test whether this is so, simply try to remove the component from the GroupBox. If clips at the edge of the GroupBox, then everything's all right, otherwise you'll have to do this dastardly trick to get it in.

1. Cut the component (Ctrl-X)
2. Select the GroupBox
3. Paste it in (Ctrl-V)

Radio Buttons Don't Play Music

When you have series of choices, but you only want the user to choose one, use radio buttons. For radio buttons to work, you must place those which you want to have in a set into a GroupBox. When you run the program, you'll realize that only one radio button in each set can be selected at one time.

• Alignent
  Slightly useless property for you to define where the text caption for each radio button goes. For instance, a value of taLeftJustify will place the caption at the left.
• Checked
  This is the most important property of all. This property tells us whether the radio button is selected. If it is, then that the option the user selected.

Also, if your GroupBoxes seem to only contain radio buttons, you should consider using the RadioBox, which is dedicated solely to radio buttons. Find out more from Online Help.

I'll pay by Check, if I may, sir.

Checkboxes don't really need elaboration. They allow for the user to select multiple choices. You don't have to put them into a GroupBox, because their states are not dependant on one another.

• State
  This property allows you to select cbGrayed to gray a checkbox. Notice that the checkbox is not disabled! It's just an extra state of the checkbox which means that what it's representing is unsure.
• AllowGrayed
  This allows the user to gray a checkbox by clicking.

The label is labelled label.

Labels serve two purposes. Firstly, they provide captions for components without their own captions. Secondly, they serve as static text for people to read. It can also function as a shortcut key provider for another component. We'll see how below.

• Alignment
  This property defines whether the text is left, right, or center aligned.
• AutoSize
  This lets the label resize automatically.
• FocusControl
  If you decide to add a shortcut key with the ampersand (&), set this property to the control that should receive focus.
• ShowAccelChar
  If you decide that the ampersand is that important to have on the screen, turn this on.
• WordWrap
  Allows word-wrapping to occur.
• Color
  Note that this property does not determine the font's colour. To change that, expand the Font property and change the Color under Font instead. This Color changes the background colour of the label instead.
• Transparent
  This makes the background transparant, allowing other components under it to be visible.

The End Of It All

And yes, this marks the end of our runthrough. Of course, there're a whole lot more components to learn, but with Online Help, getting the hang of them is a snap. There are three ways to get online help immediately:

1. To get help on a specific component, select it and press F1.
2. To get help on a property or an event, select it and press F1.
3. To get help on code, move your input cursor to the term and press F1.