Home

Overview of Windows Controls

 

Text-Based Controls

 

Labels 

 

A label is a control that displays text to the user. The user cannot directly change it but only allowed to read it. A label can be used by itself or placed next to another control because such a control cannot inherently indicated what it is used for.

To create a label, on the Toolbox, click the Label button and click the form.

To programmatically create a label, declare a pointer to Label.

Use the new operator to initialize it using its default constructor. Once you have created the control, you can change its properties as you see fit.

 

Text Boxes

A text box is a control that is used to display text to, or receive text from, the user. It is presented as a rectangular box that cannot indicate what it is used for. For this reason, a text box is usually accompanied by a label that indicates its purpose.

To create a text box, on the Toolbox, click the TextBox button and click the form.

The TextBox control is based on the TextBox class. This can be used to programmatically create the control. To do this, declare a pointer to TextBox. Use the new operator to initialize it with its default constructor.

 

Command Buttons

 

Overview

A Button is a Windows control used to initiate an action. From the user’s standpoint, a button is useful when clicked, in which case the user positions the mouse on it and presses one of the mouse’s buttons. In some programming environments, the classic button is called a Command Button. There are other controls that can serve as click controls and initiate the same behavior as if a button were clicked. Such controls include a label or a panel.

From the programmer’s standpoint, a button needs a host or container. The container could be a form, a toolbar, etc.

The most popular button used in Windows applications is a rectangular control that displays a word or a short sentence that directs the user to access, dismiss, initiate an action or a suite of actions. In .Net applications, this control is implemented using the Button control from the Toolbox. Therefore, to add a button to a container, click the Button control and click on the container, which is usually a form. Once you have added the control to your application, you can set its properties using the Properties window.

Properties of a Button

For a user, the only things important about a button are the message it displays and the action it performs. Therefore, the default property of a button is the Text: this is the word or group of words that display(s) on top of the control, showing the message that would direct the user as to what the button is used for.

The most popular strings that buttons display are OK and Cancel. The OK caption is set for a form or a dialog box that informs the user of an error, an intermediary situation, or an acknowledgement of an action that was performed on the dialog that hosts the button. The Cancel caption is useful on a button whose main parent (the form) would ask a question or request a follow-up action from the user. Whenever a dialog box allows the user to dismiss it without continuing the action, you should provide a button with a Cancel caption.

After adding a button to a form (by design or with code), you can change its caption with code by calling the Text property. For example, you can change the caption of a button as follows:

Button1.Text = "Let Me Go!"

A button is referred to as default if pressing Enter while using its parent dialog box would cause the OK button to perform its action. A default button has a thick border. If the user presses Enter any time, the action associated with the button would be executed. This is usually set on a dialog box with a button whose caption displays OK. In the next lesson, when reviewing dialog boxes, we will see how to set a button as default.

The text of the button can be aligned using the TextAlign property.

When the user clicks a button to close a dialog box, you must already know what button was clicked. The .Net environment provides a mechanism to help identify such a button. This is done through the DialogResult property. This property is based on the DialogResult enumerator. To set the desired value, after adding a button to a dialog box and while the button is selected, in the Properties window, click the DialogResult field and select the desired value. The possible values of this property are: None, OK, Cancel, Abort, Retry, Ignore, Yes, and No.

A bitmap button is traditionally a command button that displays a bitmap and possibly a caption on top. The main difference between a bitmap button and a command button is that, by design, the former displays a bitmap. If you want a button to display a bitmap, you should first create or have a bitmap. Then, in the Properties window, use the Image field to select a bitmap or an icon. After specifying the image for the button, use the ImageAlign property to specify the alignment of the image with regards to the Text of the button. Alternatively, you can first create an image list and add some pictures to it. Then, using the ImageList property, assign it to the button. Use the ImageIndex property to specify what picture would be displayed on the button.

A regular button displays with raised borders as originally set by the operating system. To give your button a fancy look and behavior, you can use the FlatStyle property. The FlatStyle property is based on an enumerator of the same name. It provides 4 values that are:

  • Flat: The button appears flat. When the mouse is over it, it becomes highlighted

  • Popup: The button appears flat. When the mouse is over it, the borders of the button are raised (if you have used WordPerfect, you may have seen this effect)

  • Standard: The buttons appears and behave like all regular buttons you have seen

  • System: The appearance of the button depends on the operating system using it

 

Check Boxes

 

Introduction

A check box is a control that makes a statement true or false. To perform this validation, this control displays a small square box that the user can click. To start, the square box is empty *. If the user clicks it, a check mark appears in the square box T. To let the user know what the check box control represents, the control is accompanied by a label that displays the statement. When the square box is empty *, the statement is false. When the square box is filled with a check mark T, the statement is true.

Creating a Check Box

To create a check box control, you can use the CheckBox class.

  1. Create a new Visual C++ Windows Application named Pizza1
  2. Change the Text of the form to Pizza Application
  3. To add a check box, on the Toolbox, click CheckBox and click in the top-center section of the form

 

Check Box Properties

 

Regular Windows Controls

  1. The most important property of any control is the name. This is changed in the Properties window.
    While the checkBox1 control is still selected, on the Properties window, click Name
  2. Type chExtraCheese and press Enter
  3. Click Location. Type 16, 16 and press Enter
  4. Click Text. Type &Extra Cheese
  5.  y to specify the position of the control. Don't forget to specify the label of the check box, which is done using the Text property.
    As an example, change the file as follows:
     
  6. Test the application
     
 

Checked

By default, a check box appears empty, which makes its statement false. To make the statement true, the user clicks it. There are three main ways you can use this property of a check box. To select a check box, you can set its Checked property to true. You can also do it programmatically as follows:

Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
        Me.CheckBox1.Checked = True
End Sub

To find out if an item is selected, get the value of its Checked property. Another possibility consists of toggling the state of the check mark with regards to another action. For example, you can check or uncheck the check mark when the user clicks another button. To do this, you can simply negate the truthfulness of the control as follows:

CheckBox1.Checked = Not CheckBox1.Checked

 

The Check-Alignment

By default, the square box of a check box control is positioned to the left side of its accompanying label. In Microsoft .Net applications, you have many options. Besides the left position, the most common alignment consists of positioning the round box to the right side of its label. The position of the round box with regards to its label is controlled by the CheckAlign property. The possible values are: TopLeft, TopCenter, TopRight, MiddleRight, BottomRight, BottomCenter, and BottomLeft.

To programmatically set the check alignment of a check box, you can call the ContentAlignment enumerator and select the desired value. Here is an example:

Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
        Me.CheckBox1.CheckAlign = Drawing.ContentAlignment.MiddleRight
End Sub

The Checked State

Instead of being definitely checked, you can let the user know that the decision of making the statement true or false is not complete. To do this, a check box can display as "half-checked". In this case the check mark would appear as if it were disabled. This behavior is controlled through the CheckState property. To provide this functionality, assign the Indeterminate value to its CheckState property. You can do this programmatically as follows:

Me.CcheckBox1.CheckState = CheckState.Indeterminate;
Indeterminate check box

 

The Three-State

The CheckState property only allows setting the check box control as "undecided". If you actually want the user to control three states of the control as checked, half-checked, or unchecked, use the ThreeState property.

By setting the CheckState Boolean property to true, the user can click it two to three times to get the desired value. When this ability is given to the user, then you can use or check the value of the Indeterminate property to find out whether the control is checked, half-checked, or unchecked.

Here is an example of specifying the check box control as being able to display one of three states:

Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
        Me.CheckBox1.Checked = True
        Me.CheckBox1.ThreeState = True
End Sub

The Appearance of the Button

By default, a check box control appears as a square box that gets filled with a check mark when the user clicks it. Optionally, you can make a check box control appear as a toggle button. In that case, the button would appear as a regular button. When the user clicks it, it appears down. If the user clicks it again, it becomes up.

To change the appearance of a check box, assign the Button or Normal value to its Appearance property. The Appearance values are defined in the Appearance enumerator. You can also do this programmatically as follows:

Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
        Me.CheckBox1.Appearance = Appearance.Button
End Sub 

Radio Buttons

 

Introduction

A radio button, sometimes called an option button, is circular control that comes in a group with other controls of the same type. Each radio button is made or an small empty circle O. From the group, when the user clicks one of them, the radio button that was clicked becomes filled with a big dot, like this 8. When one of the radio buttons in the group is selected and displays its dot, the others display empty circles. To guide the user as to what the radio buttons mean, each is accompanied by a label.

Radio Buttons Example

Creating Radio Buttons

To create a radio button, on the Toolbox, you can click the RadioButton control. Alternatively, you can declare a RadioButton class and use the form's constructor to initialize the radio buttons. Because radio buttons always come as a group, you should include them in another control that visibly shows that the radio buttons belong to the same group. The most common control used for this purpose is the group box created using the GroupBox control.

Radio Button Properties

 

Checked

While radio buttons come as a group, only one of them can be selected at a given time. The item that is selected has its Checked property set to true. There are two main ways you can use this property. To select a particular radio button, set its Checked property to true. To find out if an item is selected, get the value of its Checked property. You can also programmatically check a radio button. Here is an example:

Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
        Me.RadioButton2.Checked = True
End Sub

The Check-Alignment

By default, the round box of a radio button control is positioned to the left side of its accompanying label. In Microsoft .Net applications, you have many options. Besides the left position, the most common alignment consists of positioning the round box to the right side of its label. The position of the round box with regards to its label is controlled by the CheckAlign property. The possible values are: TopLeft, TopCenter, TopRight, MiddleRight, BottomRight, BottomCenter, and BottomLeft. You can also do this programmatically as follows:

Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
        Me.RadioButton1.CheckAlign = ContentAlignment.MiddleRight
End Sub

The Appearance

By default, radio buttons appear as rounded boxes that get filled with a big dot when the user selects one. Optionally, you can make a radio button appear as a toggle button. In that case, the buttons would appear as regular buttons. When the user clicks one, it appears down while the others are up. If the user clicks another button, the previous one becomes up while the new one would be down. To change the appearance of a radio button, assign the Button or Normal value to its Appearance property. The Appearance values are defined in the Appearance namespace. Here is an example:

Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
        Me.RadioButton1.Appearance = Appearance.Button
End Sub
 

Previous Copyright © 2004-2010 FunctionX, Inc.