Dynamically Resizing Controls On Windows Forms - Using Anchor Property

Introduction

During our initial stages of developing Windows applications we might have encountered this issue of dynamically resizing and positioning the controls on the Form. Frankly, speaking even when I began to develop my first application I have encountered this issue. In my understanding of the Anchor property here I present this article to you. Please provide to me any suggestions or errors in this please.

Hope this article that I present here might be useful to novice application developers.

Anchor Property

The Anchor Property determines how a control is automatically resized when its parent control is resized. It defines the position for the control on the form.

When designing a form that can be resized at run-time, the controls on the form should resize and reposition accordingly. To do this we take the advantage of the Anchor property.

Let us design a form that can be resized at run-time and get to understand the Anchor property of controls.

Properties Window

To set the Anchor property for a Control, from the Properties Window we set the Anchor property.

image2.png

Here we have set the button1 button control's Anchor property to the bottom-right corner of the form.

Programmatically Setting Anchor Property

The Anchor property is set programmatically with a bitwise combination of Anchor Style values. The default is Top and Left.

button1.Anchor = (AnchorStyles.Bottom | AnchorStyles.Right);


The combination of AnchorStyles.Bottom | AnchorStyles.Right anchors the button to the bottom right corner of the form.

Now let us look at how it works!!

image3.png

Set the button1 Anchor property to "Bottom, Right" from the properties Window. Now when you resize your form by dragging the right bottom of the corner you can view a change indicating that the button maintains the same distance from the bottom of the form as well as to its right.

Creating our Resizable Form

  1. Open Visual Studio and select "Windows Forms Application" from the list of available templates and name it "DynamicallyPositioningControls".

    image4a.png

  2. Rename your form to "frmDynamicResizing" by setting its Name property and sets its Text property to "Dynamic Resizing Form".
  3. Now let us design our form with controls and set its Anchor properties.

    image5.png

Here we have used the controls MenuStrip, Label, ComboBox, Button, DataGridView, TextBox and LinkLabel.

Anchor Properties for controls used

image1.gif

The "cmb_Search" Anchor property (Top, Left, and Right) means that the ComboBox is anchored to Top Left corner of the form and AnchorStyle Right indicates that the ComboBox is stretched to maintain the anchored distance to the top edges of the Form as the height of the Form is resized.

The "bt_Search" Anchor property (Top, Right) indicates that the control is anchored to the top and right edges of the form.

The bt_Close anchors the button to the bottom-right corner of the form.

dg_UserInfo: The Anchor and Dock properties are contradictory. Only one can be set at a time, and the last one set takes priority.

We fix the minimum size of the form to 517, 347 by setting its Minimum size.

Now we will run the form and see how the UI resizes accordingly,

image6.png

After resizing the form:

image7.png

Clicking the Maximize Button:

image8.png

Roundup

In this article we have discussed how to create a resizable UI (User Interface) by setting its Anchor property of forms. The Anchor Property in Windows Forms helps in creating resizable UI's.

Thanks for Reading.

X

Build smarter apps with Machine Learning, Bots, Cognitive Services - Start free.

Start Learning Now