Свойства Dock и Anchor в Winforms

Если вы относительно недавно занимаетесь разработкой графических приложений на c#, то вероятно уже сталкивались с проблемой, когда вы изменяете размер формы, при этом все компоненты (контролы) на ней остаются на своих местах, где вы их накидали в дизайнере Visual Studio. Может в определенных ситуациях такое поведение контролов и нужно, но это скорее редкость. Скорее всего вам хочется, чтобы различные кнопочки, текстбоксы, комбобоксы и т.д. изменяли местоположение, растягивались, сжимались в соответствие с формой, на которой располагаются. Чтобы не изобретать велосипед, взглянем какие свойства компонентов предлагаются в Winforms для данной цели.

Свойство Dock

Данное свойство (property) позволяет привязать элемент управления к одной из сторон родительского (parent) контрола, в котором располагается, либо полностью заполнить всё свободное пространство. Даже если просто перевести с английского, то Dock — это пристань, причал, док. Т.е. вы как бы причаливаете своим контроллом к одной из сторон родителя грубо говоря. Свойство Dock может принимать одной из шести значений перечисления DockStyle:

• None (нет привязки, значение по умолчанию)
• Fill (элемент управления заполняет свободное пространство)
• Left (“прижимаемся” к левому краю)
• Right (к правому краю)
• Bottom (к низу)
• Top (к верху)

Бегло рассмотрим каждое значение. None — компонент располагается там, где вы его расположили. При изменении родительского размера контрол сохраняет местоположение и размер.

Left — контрол прижимается к левому краю родителя, при этом занимает всю высоту, она фиксирована, но можно изменить ширину в дизайнере Visual Studio потянув мышью за правый край, либо в коде. Для примера кину на форму кнопочку (Button) и задам DockStyle.Left. Вот что получилось:

Запустив приложение, поизменяйте размеры формы и заметите, что ширина кнопки не меняется, а по высоте она растягивается, сжимается.
Right работает по аналогии с Left. Только контрол в этом случае прижимается к правому краю. Думаю здесь не стоит расписывать подробно…
Top — элемент управления цепляется к верхнему краю, занимает всю доступную ширину родителя, она фиксированная, а вот высоту можно поменять в дизайнере студии, либо в коде.

Опять же запустите приложение и измените размеры формы. Высота кнопки не меняется, по ширине — растягивается, сжимается.
Bottom — прижимает контрол к нижней части родителя. В остальном по данное свойство действует по аналогии с Top. Ничего сложного.

Fill — заполняет свободное пространство parent’а. Абсолютно никакие размеры контрола с таким свойством нельзя изменить в дизайнере студии, только лишь меняя размеры родителя.

Так же стоит сказать, что если вы попытаетесь задать сразу нескольким элементам управления одно и тоже свойство Dock из следующих — Left, Top, Bottom или Right, то данные контролы будут, образно говоря, прилипать друг к другу.

Для закрепления, взляните как можно не написав ни одной строчки кода, позиционировать несколько кнопок (Button) используя лишь свойство Dock:

Вкратце вроде рассмотрели свойство (property) Dock. Как можно заметить, оно не решает всех потребностей программиста, при позиционировании компонентов управления. К примеру, для некоторых контроллов Dock подходит очень редко. Например взять TextBox, задать ему Dock — Bottom, будет смотреться некрасиво мягко сказать. Так вот, если данное свойство не удовлетворяет вашим потребностям, есть еще полезное property под названием Anchor. Рассмотрим его.

Свойство Anchor

Свойство Anchor предназначено для закрепления краев вашего компонента к краям родительского элемента, при этом изменяя размер parent’a, расстояние между указанными краями остается константой (постоянным). С англ. языка Anchor — это якорь. Условно говоря, вы кидаете якорь от края дочернего контрола к краю родителя. У компонентов четыре стороны, поэтому может быть максимум 4 якоря.

На словах может не сразу понятно что к чему, поэтому проиллюстрирую то, о чем только что написал:

Я кинул на форму ComboBox. По умолчанию его Anchor = Top, Left. Т.е. расстояние от его левого и верхнего края до аналогичных краев формы всегда постоянно. На рисунке справа я потянул за правую границу формы, а ComboBox так и остался в левом верхнем углу.
Допустим, если бы вы задали Anchor = Bottom, Right, то при изменении размеров формы комбобокс всегда был ближе к правому нижнему краю. По аналогии с комбинациями Top, Right и Bottom, Left. Поэкспериментируйте прямо в дизайнере Visual Studio, задавайте различные комбинации Anchor и растягивайте, сжимайте форму.

Если вам необходимо, чтобы контрол растягивался по ширине, задайте Left, Right. По высоте — Top, Bottom. Вот скриншот для первого случая:

В заключении данного кратенького обзора по позиционированию контролов Winforms языка программирования C#, хочу заметить, если вы меняете свойство Anchor, то Dock сбрасывается в значение по умолчанию (None). Аналогично, меняете Dock, проперти Anchor становится Left, Top (по умолчанию).

Control. Dock Свойство

Определение

Возвращает или задает границы элемента управления, прикрепленные к его родительскому элементу управления, и определяет способ изменения размеров элемента управления с его родительским элементом управления. Gets or sets which control borders are docked to its parent control and determines how a control is resized with its parent.

Значение свойства

Одно из значений перечисления DockStyle. One of the DockStyle values. Значение по умолчанию — None. The default is None.

Исключения

Назначенное значение не является одном из значений DockStyle. The value assigned is not one of the DockStyle values.

Примеры

В следующем примере кода создается GroupBox и задаются некоторые общие свойства. The following code example creates a GroupBox and sets some of its common properties. В примере создается TextBox и задается Location в поле группы. The example creates a TextBox and sets its Location within the group box. Затем задается Text свойство поля группы и закрепляет поле группы в верхней части формы. Next, it sets the Text property of the group box, and docks the group box to the top of the form. Наконец, он отключает поле группы, присвоив Enabled свойству значение false , которое приводит к отключению всех элементов управления, содержащихся в поле группы. Lastly, it disables the group box by setting the Enabled property to false , which causes all controls contained within the group box to be disabled.

Комментарии

Используйте Dock свойство, чтобы определить, как автоматически изменяется размер элемента управления при изменении размера его родительского элемента управления. Use the Dock property to define how a control is automatically resized as its parent control is resized. Например, если задать Dock для параметра значение, DockStyle.Left то элемент управления будет выключаться по левому краю родительского элемента управления и изменять его размер при изменении размера родительского элемента управления. For example, setting Dock to DockStyle.Left causes the control to align itself with the left edges of its parent control and to resize as the parent control is resized. Элементы управления закрепляются в Z-порядке, который является визуальным слоем элементов управления на форме вдоль оси Z формы (глубина). Controls are docked in their Z-order, which is the visual layering of controls on a form along the form’s Z-axis (depth).

Элемент управления можно закрепить на одной границе родительского контейнера или прикрепить ко всем краям и заполнить родительский контейнер. A control can be docked to one edge of its parent container or can be docked to all edges and fill the parent container.

Установка Margin свойства для закрепленного элемента управления не влияет на расстояние элемента управления от границ контейнера. Setting the Margin property on a docked control has no effect on the distance of the control from the edges of its container.

AnchorСвойства и Dock являются взаимоисключающими. The Anchor and Dock properties are mutually exclusive. В каждый момент времени может быть задан только один, а последний набор имеет приоритет. Only one can be set at a time, and the last one set takes precedence.

Примечания для тех, кто наследует этот метод

При переопределении Dock свойства в производном классе используйте свойство базового класса Dock для расширения базовой реализации. When overriding the Dock property in a derived class, use the base class’s Dock property to extend the base implementation. В противном случае необходимо предоставить всю реализацию. Otherwise, you must provide all the implementation. Переопределение методов и для свойства не требуется get set ; при Dock необходимости можно переопределить только одно из них. You are not required to override both the get and set methods of the Dock property; you can override only one if needed.

Dock Style Перечисление

Определение

Задает позицию и способ закрепления элемента управления. Specifies the position and manner in which a control is docked.

Нижний край элемента управления закрепляется в нижней части содержащего его элемента управления. The control’s bottom edge is docked to the bottom of its containing control.

Все края элемента управления закрепляются у краев содержащего его элемента управления, а их размеры изменяются соответствующим образом. All the control’s edges are docked to the all edges of its containing control and sized appropriately.

Левый край элемента управления закрепляется в левой части содержащего его элемента управления. The control’s left edge is docked to the left edge of its containing control.

Элемент управления не закреплен. The control is not docked.

Правый край элемента управления закрепляется в правой части содержащего его элемента управления. The control’s right edge is docked to the right edge of its containing control.

Верхний край элемента управления закрепляется в верхней части содержащего его элемента управления. The control’s top edge is docked to the top of its containing control.

Примеры

В следующем примере создается GroupBox и задаются некоторые общие свойства. The following example creates a GroupBox and sets some of its common properties. В примере создается TextBox и задается Location в поле группы. The example creates a TextBox and sets its Location within the group box. Затем задается Text свойство поля группы и закрепляет поле группы в верхней части формы. Next, it sets the Text property of the group box, and docks the group box to the top of the form. Наконец, он отключает поле группы, присвоив Enabled свойству значение false , которое приводит к отключению всех элементов управления, содержащихся в поле группы. Lastly, it disables the group box by setting the Enabled property to false , which causes all controls contained within the group box to be disabled.

Комментарии

Когда элемент управления закрепляется на границе своего контейнера, он всегда позиционируется на эту сторону при изменении размера контейнера. When a control is docked to an edge of its container, it is always positioned flush against that edge when the container is resized. Если к границе прикрепляется несколько элементов управления, то элементы управления отображаются рядом в соответствии с их z-порядком; элементы управления, расположенные выше в z-порядке, располагаются дальше от границы контейнера. If more than one control is docked to an edge, the controls appear side by side according to their z-order; controls higher in the z-order are positioned farther from the container’s edge.

Если выбрано левое, правое, верхнее или нижнее, то размеры указанного и противоположного края элемента управления изменяются в соответствии с размерами соответствующих границ элемента управления. If Left, Right, Top, or Bottom is selected, the specified and opposite edges of the control are resized to the size of the containing control’s corresponding edges. Если выбран параметр Fill, размеры всех четырех сторон элемента управления изменяются в соответствии с краями содержащего его элемента управления. If Fill is selected, all four sides of the control are resized to match the containing control’s edges.

Control. Dock Property

Definition

Gets or sets which control borders are docked to its parent control and determines how a control is resized with its parent.

Property Value

One of the DockStyle values. The default is None.

Exceptions

The value assigned is not one of the DockStyle values.

Examples

The following code example creates a GroupBox and sets some of its common properties. The example creates a TextBox and sets its Location within the group box. Next, it sets the Text property of the group box, and docks the group box to the top of the form. Lastly, it disables the group box by setting the Enabled property to false , which causes all controls contained within the group box to be disabled.

Remarks

Use the Dock property to define how a control is automatically resized as its parent control is resized. For example, setting Dock to DockStyle.Left causes the control to align itself with the left edges of its parent control and to resize as the parent control is resized. Controls are docked in their Z-order, which is the visual layering of controls on a form along the form’s Z-axis (depth).

A control can be docked to one edge of its parent container or can be docked to all edges and fill the parent container.

Setting the Margin property on a docked control has no effect on the distance of the control from the edges of its container.

The Anchor and Dock properties are mutually exclusive. Only one can be set at a time, and the last one set takes precedence.

Notes to Inheritors

When overriding the Dock property in a derived class, use the base class’s Dock property to extend the base implementation. Otherwise, you must provide all the implementation. You are not required to override both the get and set methods of the Dock property; you can override only one if needed.