Introduction to common properties of WPF layout controls

Introduction to common properties of WPF layout controls

Others | huidu Control Network | 13:41:57 | read 0 useful (0) Comments (0)

 

Overview:The WPF layout controls are derived from system. windows. controls. the Panel class of the Panel abstract class inherits from frameworkelement, and the Panel class itself has nothing special, but many controls provided in WPF for layout inherit from the Panel class, such as stackpanel controls, wrappanel, dockpanel, grid, uniformgrid, canvas, etc.

 

The WPF layout controls are derived from system. windows. controls. the Panel class of the Panel abstract class inherits from frameworkelement, and the Panel class itself has nothing special, but many controls provided in WPF for layout inherit from the Panel class, such as stackpanel controls, wrappanel, dockpanel, grid, uniformgrid, canvas, etc.

　　Next, we will give a brief introduction to the layout control:

1. stackpanel control (arrange child elements in a row (along the horizontal or vertical direction ))

<Stackpanel name = "stackpanel1">
<Button content = "button" name = "button1"/>
<Button content = "button" name = "button2"/>
<Button content = "button" name = "button3"/>
<Button content = "button" name = "button4"/>
</Stackpanel>

By default, the stackpanel arranges elements from top to bottom to make each element highly suitable for the displayed content. You can set the orientation attribute to horizontal.

In this example, all the elements are stretched to the entire width of the stackpanel, which is also the width of the window, and the stackpanel is widened, the buttons also stretch themselves to adapt to their width changes.

　Common attributes of the stackpanel control:

(1) Public horizontalalignment {Get; set ;}

(Obtain or set the horizontal alignment feature that is applied to a parent element (such as a panel or item control) when this element is formed), which is an enumerated value, by default, stretch is fully filled with the entire container.

(2) Public verticalalignment verticalignment {Get; set ;}

(Gets or sets the vertical alignment feature that is applied to a parent element (such as a panel or item control) when this element is combined .) The default value is stretch.

Type: system. Windows. verticalalignment

(3) Public thickness margin {Get; set;} (get and set the margin of the element)

Type: system. Windows. Thickness

Margin value of the element. The default value is that all attributes are equal to 0. The default value is left, top, right, and bottom. If you set margin = "15", this setting sets all margins to the same width as 15, margin = "20, 50". In this way, you can set the left and right margins to 20 and the upper and lower margins to 50.

(4) set the height of the element. The other two minheight and waxheight are the minimum and maximum sizes respectively. If these three values conflict, minheight must be used first, and maxheight is used; finally, if the height is within the limit, this value is used.

(5) width is similar to the preceding height attribute.

All the above attributes are inherited from the frameworkelement base class, so all graphic elements used in WPF support these attributes.

2. warppanel panel and dockpanel panel

Warppanel: Positions sub-elements from left to right in sequence and disconnects content from the edge of the contained box to the next line.

You can set the layout through orientation. This control is mainly used to control the details of the user interface layout.

Dockpanel

<Dockpanel>
<Button content = "button" dockpanel. Dock = "Left"/>
<Button content = "button" dockpanel. Dock = "bottom"/>
<Button content = "button" dockpanel. Dock = "right"/>
<Button content = "button" dockpanel. Dock = "TOP"/>
<Button content = "button"/>
</Dockpanel>

You can use the above four additional attributes to define the location of the button in the dockpanel. Since stackpanel, wrappanel, and dockpanel are rarely used separately in WPF, they are usually used to layout part of the user interface. The following describes the grid panel.

3. grid panel

The grid panel is the most powerful layout control in WPF. It is a grid composed of rows and columns. S is similar to the table in HTML.

The grid panel creates columns and rows by filling the grid. rowdefinitions and grid. columndefinitions collections with objects.

<Grid X: Name = "layoutroot" background = "darkgray">
<Grid. rowdefinitions>
<Rowdefinition> </rowdefinition>
<Rowdefinition> </rowdefinition>
<Rowdefinition> </rowdefinition>
</Grid. rowdefinitions>
<Grid. columndefinitions>
<Columndefinition> </columndefinition>
<Columndefinition> </columndefinition>
</Grid. columndefinitions>

</GRID>

A table with three rows and two columns is created above. Evenly allocate space for all rows and columns in the grid table.

You can place controls in cells by adding row and column attributes.

The Grid Control supports three ways to change the size:

(1) <columndefinition width = "100"> </columndefinition> the method of absolute dimension change is useless and inflexible, it is difficult to handle text size changes and package container size changes.

(2) <columndefinition width = "Auto"> </columndefinition> automatically change the size, which is the most useful method.

(3) <columndefinition width = "*"> </columndefinition> proportional dimension change.

The rowspan and column attributes are used in the grid for cross-row and cross-Column Operations.

Introduction to common properties of WPF layout controls