DockPanel 不可见，即使它设置为可见答案

【问题标题】：DockPanel is not visible even though it is set to visibleDockPanel 不可见，即使它设置为可见
【发布时间】：2021-08-10 13:40:06
【问题描述】：

我在另一个DockPanel 里面有一个DockPanel 第一个设置为停靠在整个表单上，但第二个设置在表单的顶部，它里面有三个按钮，背景颜色其中设置为灰色，我可以在编辑器中看到内容蓝色边框，但它没有颜色或文本，当我运行应用程序时，没有任何东西没有按钮没有颜色。

这是 XAML 代码：

<Grid Background="White">
    <DockPanel Name="MainBackground">
        <DockPanel Name="Top" Height="32" Background="#FF707070" DockPanel.Dock="Top" Margin="0, 0, 0, 1000">

            <Button
            Width="46"
            Height="32"
            DockPanel.Dock="Right"
            Margin="687,0,0,398"
            Background="White" Click="Button_Click_1">

                <StackPanel Orientation="Horizontal">
                    <Image Source="Res/RDI.png" Width="20" Height="20"/>
                </StackPanel>

            </Button>
            <Button
            Width="46"
            Height="32"
            Content="×" 
            FontSize="20" DockPanel.Dock="Right" Click="Button_Click" Margin="734,0,0,398" Background="White"/>

        </DockPanel>
    </DockPanel>
</Grid>

【问题讨论】：

不要使用Margin来定位控件，而是使用容器创建类似table的布局。检查您的位置是否在可见区域内，边距1000 是否是问题的原因？

标签： c# wpf xaml dockpanel

【解决方案1】：

问题是您尝试使用Margin定位所有控件，这违背了DockPanel 的目的。您可以选择 XAML 中的每个按钮并查看 Visual Studio 中的设计器。它们都位置偏远。并不是每个人都在 WPF 中使用这种脆弱的定位。有很多面板已经可以更轻松地处理这种方式并且对调整大小做出响应。

例如，试试下面的代码。我删除了所有的Margins，只是将按钮的DockPanel.Dock 设置为Right。请注意，您必须将LastChildFill 设置为false，否则放置在DockPanel 中的最后一个控件将占用剩余空间并居中，无论是否设置DockPanel.Dock 值。

如果您将LastChildFill 属性设置为默认设置true，则DockPanel 的最后一个子元素始终填充剩余空间，而不管您在最后一个子元素上设置的任何其他停靠值元素。要将子元素停靠在另一个方向，您必须将 LastChildFill 属性设置为 false 并且还必须在最后一个子元素上指定显式停靠方向。

对于外部DockPanel，我只是添加了一个新的最后一个Grid，它占用了剩余空间。如果它不存在，您还必须设置LastChildFill，否则该栏将在窗口中居中。

<Grid Background="White">
   <DockPanel Name="MainBackground">
      <DockPanel Name="Top" Height="32" Background="#FF707070" DockPanel.Dock="Top" LastChildFill="False">
         <Button
            Width="46"
            Height="32"
            DockPanel.Dock="Right"
            Background="White" Click="Button_Click_1">
            <StackPanel Orientation="Horizontal">
               <Image Source="Res/RDI.png" Width="20" Height="20"/>
            </StackPanel>
         </Button>
         <Button
            Width="46"
            Height="32"
            Content="×" 
            FontSize="20" DockPanel.Dock="Right" Click="Button_Click" Background="White"/>
      </DockPanel>
      <StackPanel>
         <TextBlock Text="This is where your content would be placed."/>
         <TextBlock Text="Alternatively, set the last child fill of the dock panel to false."/>
      </StackPanel>
   </DockPanel>
</Grid>

现在按钮会自动定位到右侧，彼此相邻。

当然，您也可以使用其他面板创建相同的布局，但是由于不清楚您的最终布局应该是什么样子，所以我只能使用您的结构提供这个示例。

【讨论】：

非常感谢，它就像我希望的那样工作。

【解决方案2】：

这里很确定，但有Margin="0, 0, 0, 1000" 的边距可能在任何地方。

我认为这是问题所在。

[编辑] 我看到更多这些“3 位数的边距”。避免这种情况，这不是 WPF 的使用方式。使用边距作为“元素周围的一点空间”

【讨论】：