Planning Form Layout in VB.NET

This is where a little code comes into play. To ensure that the panels resize in the desired manner we have to do two things:

1. We have to change the width of the green panel proportionally to the change in width of the form.



2. The height of green and the blue panels should remain constant. Which means we have to change the height of the red panel by the same value as the height of the form changes.

To accomplish the above tasks, do the following.

Declare these form level variable.

Private Const GreenPanelHeight As Integer = 117
Private Const FormHgtMinusRedPanelHgt As Integer = 232 - 88 'formHgt - PanelHgt
Private PrevFormWidth As Integer = 430

Put the following code in the form resize event.

Private Sub Form1_Resize(ByVal sender As Object, ByVal e As System.EventArgs) Handles MyBase.Resize
    Dim WidthRatio As Double = (Me.Size.Width / PrevFormWidth)
    GreenPanel.Size = New System.Drawing.Size(GreenPanel.Size.Width * WidthRatio, GreenPanelHeight)
    PrevFormWidth = Me.Size.Width
    RedPanel.Size = New System.Drawing.Size(RedPanel.Size.Width, Me.Size.Height - FormHgtMinusRedPanelHgt)
End Sub

Now save your work and run the application. You see that the form is working just as desired.

Now you can set the BackColor property of the panels back to its default values. Also set the MinimumSize property of the form such that all controls are visible and usable.