Another collapsible panel (ultra simple)

• Download source code - 32.9 KB

Introduction

One of my last projects required a large amount of info to be displayed in categories. Due to the unbalanced population of each group, the Tab control was not an option. So, I turned to collapsible panels and groupboxes so the user could hide or show the information he needed.

There are many and wonderful collapsible controls available in CodeProject, but I needed something very simple and, most importantly, the possibility of nesting the "collapsers". The ones I tested had strange interactions both with the FlowLayoutPanel and the AutoSize feature.

I had no time to develop a custom control, and nearly by chance, I came with this simple solution.

Using the code

Two elements were needed: a GroupBox (or a Panel) and a collapsing/expanding Button. The solution is simple, but what happens if you need a dozen or more collapsers? Copy and paste is not elegant and can lead to tedious debugging.

Can a "universal collapsing button" be made? Yes. Here it is.

Private Sub chkbCollapser_CheckedChanged(ByVal sender As System.Object, _
        ByVal e As System.EventArgs) Handles chkbCollapser.CheckedChanged
 
    If Not Me.Created Then Exit Sub
    
    Dim ctrl As Control = CType(sender, Control).Parent
    Dim chk As CheckBox = CType(sender, CheckBox)

    If chk.Checked Then
        ctrl.AutoSize = True
        chk.Text = "-"
    Else
        ctrl.AutoSize = False
        ctrl.Height = 18
        chk.Text = "+"
    End If
End Sub

Only three points of interest in the code:

• The Me.Created test to avoid code execution when loading the form.
• The ctrl reference to the button's parent (both Panel or GroupBox work fine). This means that the button must obviously be inside the Panel or GroupBox. I uses to place it at the upper right corner and change the Anchor property from the default Top,Left value to Top,Right.
• The chk reference to the button itself. This allows to place the same code into as many buttons as needed. It's time to say that I don't use a Button, but a CheckBox with Button Appearance.

You only need to copy the code to the first collapsing button you need. Then just copy-paste it as required. The Sub header automatically will be added with the Handle elements for the copies.

Private Sub chkbCollapser_CheckedChanged(ByVal sender As System.Object, _
        ByVal e As System.EventArgs) _
        Handles chkbCollapser.CheckedChanged, CheckBox1.CheckedChanged, _
            CheckBox5.CheckedChanged, CheckBox4.CheckedChanged, _
            CheckBox3.CheckedChanged, CheckBox2.CheckedChanged, _
            CheckBox8.CheckedChanged, CheckBox9.CheckedChanged, _
            CheckBox13.CheckedChanged, CheckBox12.CheckedChanged, _
            CheckBox11.CheckedChanged, CheckBox10.CheckedChanged

The sample project allows to see how I manage with FlowLayoutPanels together with my collapsible Panel/GroupBox.