Layout of WPF--stackpanel

1. StackPanel is to display controls in a stacked way (left to right, or top to bottom)

The default is displayed from top to bottom, and the width is stackpanel width, height automatically adapts to the height of the content in the control (when the control is not set)

The code is as follows:

1<window x:class="Readremoteregistry.mainwindow"2xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"3xmlns:x="Http://schemas.microsoft.com/winfx/2006/xaml"4title="MainWindow"height=" -"Width="525">5<Grid>6<StackPanel>7<button content="First button"click="Button_Click"/>8<button content="a second button"click="Button_click_1"/>9<button content="a third button"click="button_click_2"/>Ten</StackPanel> One<button content="Button"Horizontalalignment=" Left"margin="220,199,0,0"Verticalalignment="Top"Width="176"height=" A"click="Button_click_3"/> A  -</Grid> -</Window>

View Code2. You can use Orientation [or?? n ' te?? N] n. Directionproperty to set the style of the layout (horizontal or vertical, that is, from left to right, or top to bottom)

The optional values for the Orientation property are: horizontal horizontal, Vertical vertical (default),

The code is as follows: Height is stackpanel height, Width automatically adapts to the width of the content in the control

1<window x:class="Readremoteregistry.mainwindow"2xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"3xmlns:x="Http://schemas.microsoft.com/winfx/2006/xaml"4title="MainWindow"height=" -"Width="525">5<Grid>6<stackpanel orientation="Horizontal">7<button content="First button"click="Button_Click"/>8<button content="a second button"click="Button_click_1"/>9<button content="a third button"click="button_click_2"/>Ten</StackPanel> One<button content="Button"Horizontalalignment=" Left"margin="220,199,0,0"Verticalalignment="Top"Width="176"height=" A"click="Button_click_3"/> A  -</Grid> -</Window>

View Code3. Control the properties and status of StackPanel controls 3.1. Width and Height of internal controls

If these two properties are not set for internal controls, the above will appear:

Vertical layout (top to bottom): Width is stackpanel wide, height automatically adapts to the height of the content in the control;

Horizontal layout (left to right): height is stackpanel high, Width automatically adapts to the width of the content in the control;

3.2. Margin property, controlling margins for internal controls

3.2.1. margin= "10": all margins are 10;

3.2.2.margin= "10,20,30,40": Set left, top, right and bottom edges are 10, 20, 30, 40, respectively

3.2.3. Using split-mode settings (using complex attributes), such as 10 on top and bottom, 20 for left and right

<button content= "button A" >
<Button.Margin>
<thickness top= "Ten" bottom= "left=" "right= "
</Button.Margin>
</Button>

3.3. Set the alignment of internal controls

3.3.1. HorizontalAlignment, (Need to orientation= "Vertical" in the overall context)
Sets the vertical alignment of the control, such as setting the horizontal alignment to left, right, or center

3.3.2. VerticalAlignment attribute (required for overall orientation= "horizontal")

Sets the horizontal alignment of the control, setting the horizontal alignment to top, Center, stretch, or bottom

3.4. Setting dynamic values for internal controls

MinWidth: Minimum allowable width

MinHeight: Minimum allowable height

MaxWidth: Maximum allowable width when changing with control

MaxHeight: Maximum allowable height when changing with control

4. Use StackPanel to allow control to adapt with content changes

such as:"OK" and "Cancel" button dialog box, because the text on the button may change depending on the font size changes,

We should avoid fixing the size of the button (that is, do not set the value of the width of the control, but instead use the MinWidth property).

StackPanel automatically adjusts the size of the internal controls based on the size of the panel.

We don't have to worry about the buttons being too big or too small.

  <stackpanel margin= "8" orientation= "Horizontal" > "                   minwidth=" >OK</Button>       minwidth= "margin=" "10,0,0,0" >Cancel</Button>   </StackPanel>

Reference: http://blog.sina.com.cn/s/blog_6c81891701017a34.html

Layout of WPF--stackpanel