Layout a Form with StackPanel and Grid : Grid « Windows Presentation Foundation « C# / C Sharp

1. C# / C Sharp
2. Windows Presentation Foundation
3. Grid

Layout a Form with StackPanel and Grid

            
<Window x:Class="Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="UseExpander" Height="300" Width="300">
    <Grid>
        <StackPanel Name="StackPanel1" Margin="0,0,0,0">
            <Expander Header="Name" Margin="0,0,0,0" Name="Expander1" IsExpanded="True">
                <StackPanel Margin="20,0,0,0">
                    <StackPanel Height="Auto" Width="Auto" Orientation="Horizontal">
                        <Label Height="25.96" Width="84">First Name</Label>
                        <TextBox Height="25" Width="147" />
                    </StackPanel>
                    <StackPanel Height="Auto" Width="Auto" Orientation="Horizontal">
                        <Label Height="25.96" Width="84">Last Name</Label>
                        <TextBox Height="25" Width="147" />
                    </StackPanel>
                </StackPanel>
            </Expander>
            <Separator />
            <Expander Header="Address" Margin="0,0,0,0" IsExpanded="True">
                <StackPanel Margin="20,0,0,0" >
                    <StackPanel Height="Auto" Width="Auto" Orientation="Horizontal">
                        <Label Height="25.96" Width="84">Street</Label>
                        <TextBox Height="25" Width="147" />
                    </StackPanel>
                    <StackPanel Height="Auto" Width="Auto" Orientation="Horizontal">
                        <Label Height="25.96" Width="84">City</Label>
                        <TextBox Height="25" Width="147" />
                    </StackPanel>
                    <StackPanel Height="Auto" Width="Auto" Orientation="Horizontal">
                        <Label Height="25.96" Width="84">State</Label>
                        <TextBox Height="25" Width="147" />
                    </StackPanel>
                    <StackPanel Height="Auto" Width="Auto" Orientation="Horizontal">
                        <Label Height="25.96" Width="84">Zip</Label>
                        <TextBox Height="25" Width="147" />
                    </StackPanel>
                </StackPanel>
            </Expander>
            <Separator />
        </StackPanel>
    </Grid>
</Window>

   
    
    
    
    
    
    
    
    
    
    
    
  

Related examples in the same category

1.	GridSplitter Example
2.	GridSplitter as Entire Column or Row
3.	ColumnDefinition.Width=Auto
4.	ColumnDefinition.Width=*
5.	Grid With Splitter
6.	Bind to Grid Width and Height
7.	Simple Grid.xaml
8.	Use Grid to layout a Calendar
9.	Grid with Rectangle and GeometryDrawing
10.	Set Grid Row and Column for a Button
11.	Arrange UI Elements in a Grid
12.	Grid with Column Definition and Row definition
13.	Align Ellipses along with Grid
14.	Use GridSplitter
15.	Define rows / columns for Grid
16.	Using Grid.ColumnSpan
17.	Set Grid Row Height and Column Width to Auto
18.	Mixing row height styles
19.	Show Grid Lines
20.	Multiple Items in a Grid Cell
21.	Grid in ScrollViewer
22.	Margin vs Padding and Grid
23.	Without Panel.ZIndex
24.	Panel.ZIndex
25.	Stretched GridSplitter
26.	Window with Grid
27.	Arrange the children for Grid
28.	Set Row Height and column Width for Grid
29.	Set Row and Column Index when Adding Buttons to Grid
30.	Put more than one Object to one Grid Cell
31.	Set Column and Row index when adding Controls to a Grid
32.	Nested Grid
33.	Shared Size Group
34.	Empty RowDefinition and ColumnDefinition
35.	Grid Splitter and Alignment
36.	Use the Grid element to create a standard user interface (UI) dialog box.
37.	Place and size rectangles and ellipses in Grid cells
38.	Use Image as the Grid background
39.	Automatic Width and Height
40.	Grid with SharedSizeGroup
41.	Clear All Columns
42.	Clear All Rows
43.	Remove One Column
44.	Remove One Row
45.	The current number of Columns
46.	The current number of Rows
47.	Remove 5 Columns with ColumnDefinitions.RemoveRange
48.	Remove 5 Row with RowDefinitions.RemoveRange
49.	Contains Row
50.	Contains Column?
51.	Insert Row
52.	Insert Column
53.	Is Grid ReadOnly
54.	Grid mouse down event
55.	Grid Preview mouse down event
56.	Setting Grid row heights in code
57.	Layout Controls with Grid in code
58.	Set control to specific row and column in code
59.	Show Grid lines in code
60.	Programmatically use the positioning methods of Grid
61.	Add a ColumnDefinition to Grid
62.	Add a RowDefinition to Grid
63.	Grid PreviewMouseDown action and MouseDown action
64.	Grid MouseLeftButtonDown action and PreviewMouseLeftButtonDown action