C # Use anchor and dock to design complex interfaces (Controls change with the size of the form)

ProgramInterface above

Brief description of each part: The entire form overwrites A splitcontainer.

Put a label and a Treeview on Panel1 of splitcontainer.

Put a tabcontrol on panel2 of splitcontainer.

There are two tabpages on tabcontrol.

Put a combo box and two buttons on tabpage1. Go is button1, back is button2. The following is a webbrowser

The following controls are placed on tabpage2: Label 2, textbox1, label3, and textbox2 (with the multiline attribute)

Four buttons are placed under tabcontrol. The options include button3, button4, button5, and button6.

The following briefly introduces the significance of the dock and anchor:

The dock property controls the sub-control's Dock position in the parent window; the anchor property controls the distance between the sub-control and the parent control (you can give it a try by yourself)

The following describes how to set the dock and anchor attributes of each control:

Splitcontainer1:

1. Anchor: Top left;

2. DOCK: Fill (filled with the entire form, so that the size of splitcontainer changes with the size of winform );

 

Label1:

1. Anchor: Top left;

2. DOCK: none;

 

Treeview1:

1. Anchor: Top left bottom right (even if the form changes, the distance between the four sides of treeview1 and its parent control remains unchanged, that is, the meaning of treeview1 becoming larger );

2. DOCK: none;

 

Tabcontrol1:

1. Anchor: Top left

2. DOCK: Fill;

Combobox1:

1. Anchor: Top left right (that is, when the form changes, the top, left, and right of the control remain unchanged from the parent control );

2. DOCK: none;

 

Button1 (GO), button2 (back ):

1. Anchor: Top right;

2. DOCK: none.

 

Webbrowser1:

1. Anchor: Top left right bottom

2. DOCK: None

 

Label2 and label3 settings on tabpage2 are as follows: label1;

Textbox2, textbox3 settings such as combox1

The following describes how to set the four buttons.

We set the anchor of button3 (post extraction) to left, bottom, and dock to none. The Anchor attribute of other buttons is set to bottom, and the dock attribute is set to none;

When the length of the form changes, we divide the length of tabcontrol into four parts (because there are four buttons ). A1, A2, A3, and A4 are assigned to each button. The length of each button is 3/4 of its length (this can be set at Will)CodeAs follows:

 

The form also changes the button.
  Private   Void Form1_resize ( Object Sender, eventargs E)
{

Int Length =   This . Tabcontrol1.width /   4 ;
Int S = Length * 3 / 4 ;

Button3.width = S;
Button4.width = S;
Button5.width = S;
Button6.width = S;
Button4.location = New Point (button3.location. x + Length, button3.location. y );
Button5.location =   New Point (button4.location. x + Length, button4.location. y );
Button6.location =   New Point (button5.location. x + Length, button5.location. y );

}

Note: add the following code to formateload: This. Resize + = new system. eventhandler (this. form1_resize); // host

 

The button changes when we drag the splitcontainer. The design code is as follows:

 

The form remains unchanged. Panel1 and pannel2 are relatively different, and the button is also changed.
  Private   Void Splitcontainer?splittermoved ( Object Sender, splittereventargs E)
{
Int Length =   This . Tabcontrol1.width /   4 ;
Int S = Length *   3   /   4 ;

Button3.width = S;
Button4.width = S;
Button5.width = S;
Button6.width = S;
Button4.location =   New Point (button3.location. x + Length, button3.location. y );
Button5.location =   New Point (button4.location. x + Length, button4.location. y );
Button6.location =   New Point (button5.location. x + Length, button5.location. y );
}

 

After the above settings, our form interface is designed. I am still a cainiao. If I do not understand this, I would like to ask you to testify.

15:30:11

 

You can download the source code at http://finallyliuyu.download.csdn.net /.

If you do not have a csdn number, you can download it at http://www.cnblogs.com/finallyliuyu/admin/files.aspx.