2021-08-16 WPF控件专题 DockPanel 控件详解

Posted 2021-09-06 微软MVP Eleven

1.DockPanel 控件介绍

停靠面板，顶部 左边 右边 下边 中间 Winform Dock: Top Left Right Bottom

特点：先添加的子元素，优先占用边角（优先占有权），所有子元素区域不会重叠

与其他布局控件结合使用，
应用：布局自适应页面

2.具体案例

<Grid>
<!--LastChildFill 默认为true  最后的元素完全填充剩余的部分-->
<!--如果在同一侧，依靠了多个元素，它们按顺序依次排列-->
    <DockPanel LastChildFill="True">
            <StackPanel DockPanel.Dock="Top" Background="LightBlue" Height="50">
                    <Label Content="Top"/>
            </StackPanel>
            <StackPanel DockPanel.Dock="Bottom" Background="OrangeRed"  Height="50">
                    <Label Content="Bottom"/>
            </StackPanel>
            <StackPanel DockPanel.Dock="Left" Background="LightGray" Width="100">
                    <Label Content="Left"/>
            </StackPanel>
            <StackPanel DockPanel.Dock="Left" Background="LightGray" Width="100">
                    <Label Content="Left2"/>
            </StackPanel>
            <StackPanel DockPanel.Dock="Right" Background="Green" Width="100">
                    <Label Content="Right"/>
            </StackPanel>

            <Grid Background="BlueViolet">
                    <Label Content="Content"/>
            </Grid>
            <Grid Background="Orange">
                    <DockPanel LastChildFill="True">
                            <Button  Content="top" Height="30" DockPanel.Dock="Top"/>
                            <Button  Content="bottom" Height="30" DockPanel.Dock="Bottom"/>
                            <Button  Content="left" Width="30" DockPanel.Dock="Left"/>
                            <Button  Content="right" />
                    </DockPanel>
            </Grid>
    </DockPanel>
</Grid>