1. Introduction to GroupBox Control
In this article, we will explore how to use the C# ‘GroupBox Control’ in C# windows forms-based applications. Before we start, we will learn about Topmost Container, Normal Container and Controls.
The first fact one should know is that a Container holds Controls in it. For example, the Log-in dialog as a Container can hold username and password text boxes in it. A Container can act as a Control as well and we will know more about it in this group box example. Modern applications treat Dialog and Window as Topmost Containers. Top Level Containers can hold some other Containers treating those as Controls. Top Level Containers are solely a Container. But, some developers tweak it to act as a Control and embed that in some other Dialog.
Note:
The C# GroupBox Control can act as a Container as well as Control. We will see that in this example.
The Container Controls allow us to place other controls in it. It pushes its properties to all the control contained by it. Say, for example, if we set the container in a disabled state, then all the controls in the container becomes disabled. This behavior is useful to set common properties to the logically grouped control. The GroupBox Control is a Container Control and we will explore about it in this example.
Youtube: Learn Basics of C# GroupBox Control
2. About the GroupBox Container Example
The screenshot of the GroupBox Control Example is shown below:
Container Controls – Group Box Example
In the above example, we have two GroupBox Controls called country and actions. They both have logically grouped controls inside it. In the design time, we can move the group of controls by moving the parent GroupBox control. While we do so, we no need to worry about control alignment as the parent container, the GroupBox takes care of it.
There are three containers in this example. They are:
- The Form
- Country GroupBox
- Action GroupBox
The form treats these two GroupBoxes as controls. The GroupBox is a Container and also a Control. Why because, It is a container for the control it holds and it is a control for the form in which it resides.
The ‘Enable Check Box’, when checked, enables all the controls in the Actions GroupBox. For doing this, we will not set the Enabled property to true for each control. All we do is setting the Enabled property of Actions GroupBox to true. This will set all the child control’s Enable property to true.
Note:
The Container which groups the related control together and hence got the name GroupBox Control.
Also note, we have two radio groups. One belongs to the Country, and another one belongs to the action GroupBox. So, these two radio sets act independent to each other. This means, we can keep one radio button selected in each group as form treats there are two radio button groups in it. This is because they live in a separate GroupBox container.
YouTube: About this GroupBox Example
3. GroupBox Control Properties
In this section, we will explore frequently used GroupBox properties. We will also set those properties at run-time. One can also use these properties while designing the Windows Form.
YouTube: GroupBox Container Control Properties
3.1 Enabled Property
First, we deal with the
CheckedChanged
Event of the CheckBox Control. Inside the handler, we set the
Enabled
Property of the Actions GroupBox. Now, C# sets all the child controls with the same property value. The child control properties taken from their parent is called Inherited Properties. One can override it by setting the specific control’s property at run-time. Below is the handler code for Enable Action CheckBox:
|
1 2 3 4 5 6 7 8 9 10 |
private void chkAction_CheckedChanged(object sender, EventArgs e) { //Groupbox 01: Enable or disable the Actions //radio group if (chkAction.CheckState == CheckState.Checked) grpActions.Enabled = true; else grpActions.Enabled = false; } |
3.2 BackColor Property
Next, we handle the ‘
StateChanged
Event’ of the radio button on the right-side group to set
BackColor
Property. This will change the background color of the GroupBox and its Children. Note, the radio buttons in this container acts separately from the one which is already there on the country container. Here, we are setting the
BackColor
Property for the country container and thereby for the controls it hold. Note, we are not settings the
BackColor
Property for each controls since the child controls get the properties from its parent. Below is the code snippet:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
private void rdBack1_CheckedChanged(object sender, EventArgs e) { //Groupbox 02: Set the Background for the Groupbox if (rdBack1.Checked == true) grpCountry.BackColor = Color.AliceBlue ; } private void rdBack2_CheckedChanged(object sender, EventArgs e) { //Groupbox 03: Set the Background for the Groupbox if (rdBack2.Checked == true) grpCountry.BackColor = Color.Azure; } |
3.3 Visible Property
Next comes the
Click
Event Handler for the hide country button. The
Visible
Property of the GroupBox shows or hides the GroupBox and the controls it contains. Here, the button will toggle the operation between hiding and showing of Country GroupBox by using its
Visible
Property. The button label also we toggle between ‘show’ or ‘hide’. Note, hiding the container, hides all the controls it holds. The code snippet is below:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
private void btnHideShowCountry_Click(object sender, EventArgs e) { //Groupbox 04: Hide the Country Container if(btnHideShowCountry.Text == "Hide Country" ) { grpCountry.Visible = false; btnHideShowCountry.Text = "Show Country"; } else { grpCountry.Visible = true; btnHideShowCountry.Text = "Hide Country"; } } |
3.4 Font Property
The
Font
Property is used to set the Font for GroupBox and its controls. First, we pick a Font from the C#
FontDialog
. Then, we set the selected font to our Country GroupBox control using its Font Property. Once, we do this, C# assigns same Font to all the child controls on the GroupBox Control. Below is the code:
|
1 2 3 4 5 6 7 8 9 10 |
private void btnFontVerdana_Click(object sender, EventArgs e) { //Groupbox 05: Set a different font to the Country FontDialog fnt = new FontDialog(); if (fnt.ShowDialog() == DialogResult.OK) { grpCountry.Font = fnt.Font; } } |
YouTube: C# GroupBox Example Implementation
4. Closing Notes
Note, all the Child Controls inside the container will inherit the properties from its parent. Here, we learned simple properties like Enable, Visible, Font etc., We set these on the GroupBox container. Also, we came upon how Child Controls draws the same property from its parent.
In the Above Example,
-
- The top-level container is our Windows Form. Both the Group Boxes and the Enable Actions CheckBox belongs to the top-level Container. So, they inherit the properties from it.
- The form acting as a Top-Level Container holds two Group boxes sees them as controls. Whereas for all the controls inside the Group Box, the parent is the Containing GroupBox. Now when we set the properties at run-time, we should always remember the Order in which control properties are set. The order is:
- Top Level container
- Child Container and Controls
For Example, if we want to set Red Color to Form, Green Color to Country Group Box and Blue Color to Malaysia Radio button, we should know in which order we should set the properties to gain the desired result. At Run-time, we should set the color in the following order to avoid properties overridden in the hierarchy:
- Set red color to the form. Entire controls in the form will have red color now.
- Override the red by setting green to country GroupBox Control. All the children of Group Box change from Red to Green.
- Override, Green color of specific radio button by setting Blue to it. Here, we pick the individual control and set its property.
Source Code: Download GroupBox Control Example from Google Drive
Categories: C#
Tags: C# Container Controls, C# GroupBox
Do you like this Example? Please comment about it for others!!
This site uses Akismet to reduce spam. Learn how your comment data is processed.