WPF，Grid划分界面区域

 

<Grid.ColumnDefinitions>和<Grid.ColumnDefinitions>定义界面中行列的数量, 使用GridSplitter作为分隔线可以调整相连区域的大小，注意GridSplitter也要占用一行或一列。

 

            <Grid Grid.Column="0">

                <Grid.RowDefinitions>

                    <RowDefinition Height="auto"/>

                    <RowDefinition Height="100*"/>

                    <RowDefinition Height="auto"/>

                </Grid.RowDefinitions>

                <!--address bar-->

                <Grid Grid.Row="0" VerticalAlignment="Top">

                    <Grid.ColumnDefinitions>

                        <ColumnDefinition Width="auto"/>

                        <ColumnDefinition Width="auto"/>

                        <ColumnDefinition Width="100*"/>

                        <ColumnDefinition Width="auto"/>

                    </Grid.ColumnDefinitions>

                    <Button Grid.Column="0">back</Button>

                    <Button Grid.Column="1">forward</Button>

                    <TextBox Grid.Column="2" HorizontalAlignment="Stretch"></TextBox>

                    <Button Grid.Column="3">Go</Button>

                </Grid>

                <!-- file panel-->

                <Grid Grid.Row="1">

                    <Grid.ColumnDefinitions>

                        <ColumnDefinition Width="30*"/>

                        <ColumnDefinition Width="Auto"/>

                        <ColumnDefinition Width="70*"/>

                    </Grid.ColumnDefinitions>

                    <TreeView Grid.Column="0" x:Name="directoryTree">

                    </TreeView>

                    <GridSplitter Grid.Column="1" Width="2" HorizontalAlignment="Center" VerticalAlignment="Stretch"/>

                    <ListView Grid.Column="2">

                        <ListView.View>

                            <GridView x:Name="detailView">

                            </GridView>

                        </ListView.View>

                    </ListView>

                </Grid>

                <!-- status bar-->

                <Label Grid.Row="2" Background="White">status bar</Label>

            </Grid>