Grid之 好玩的GridSplitter

这样子的一个Grid，画好了行列：

<Grid   Background="LightGreen"  Width="300" Height="150" HorizontalAlignment="Center">

            <Grid.ColumnDefinitions>

                <ColumnDefinition Width="30*" />

                <ColumnDefinition Width="70*" />

            </Grid.ColumnDefinitions>

            <Grid.RowDefinitions>

                <RowDefinition Height="80"/>

                <RowDefinition Height="*"/>

            </Grid.RowDefinitions>

            <Rectangle Fill="LightCoral"  Margin="10"  Grid.Column="0"/>

            <Rectangle Fill="LightGoldenrodYellow" Margin="10"  Grid.Column="1"/>

 

            <Rectangle Fill="LightSteelBlue"  Grid.Row="1" Margin="10"  Grid.Column="0"/>

            <Rectangle Fill="LightSalmon"  Grid.Row="1"  Margin="10"  Grid.Column="1"/>

</Grid>

行列尺寸也许不能修改了，忽然发现有个GridSplitter，可以动态修改列宽或者行高，赶紧加进来，如下

 

        <!--调整行高-->

            <GridSplitter Background="LightSteelBlue"  Grid.ColumnSpan="2" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Bottom"  Height="2"/>

            <!--调整列宽-->

            <GridSplitter  Background="LightGoldenrodYellow" Grid.RowSpan="2" Width="2" />

运行起来后，鼠标滑过下图中的黄线，出现左右箭头，可以拖住箭头调正行高或者列宽了。