仅对齐停靠面板中的可见元素

Question

<DockPanel Grid.Row="1" HorizontalAlignment="Right" Width="300">
    <Button x:Name="startPackageSendButton" Command="{Binding StartPackageSendingProcessCommand}"  Style="{StaticResource blueButtonStyle}" Content="Start" Width="100" VerticalAlignment="Top" Margin="0,0,0,0" Visibility="Visible" HorizontalAlignment="Right"/>
    <Button x:Name="clearPackageSendButton" Command="{Binding ClearPackageSendingProcessCommand}"  Style="{StaticResource blueButtonStyle}" Content="Clear" Width="100" VerticalAlignment="Top" Margin="0,0,0,0" Visibility="Collapsed" HorizontalAlignment="Right"/>
    <Button x:Name="cancelPackageSendButton" Command="{Binding CancelPackageSendingProcessCommand}" Style="{StaticResource blueButtonStyle}" Content="Stop" Width="100" VerticalAlignment="Top" Margin="0,0,0,0" Visibility="Visible" HorizontalAlignment="Right"/>
</DockPanel>

我正在使用Dockpanel 来堆叠一些水平对齐的按钮。 如果某些按钮不是Visible 我在按钮之间有空格。

如果按钮没有将Visibility 设置为可见，我如何消除空格？ 有没有什么技术可以达到这个效果？

编辑：我按照建议将隐藏更改为折叠。

Answer 1

我怀疑您通过设置Visibility.Hidden 隐藏了控件。

你应该使用Visibility.Collapsed。

阅读更多here:

不同的是Visibility.Hidden隐藏了控件，但是 保留它在布局中占据的空间。所以它呈现空白 而不是控件。

Visibilty.Collapsed 不呈现 控制并且不保留空白。控制空间 会采取“折叠”，因此得名。

编辑后，很明显您使用的是Hidden。改用折叠：

<DockPanel Grid.Row="1" HorizontalAlignment="Right" Width="300">
    <Button Visibility="Collapsed"/>
    <Button Visibility="Visible"/>
    <Button Visibility="Collapsed"/>
</DockPanel>

编辑：

我在删除样式和命令部分后检查了您的示例代码，发现了一些问题：

1. 从 DockPanel 中移除硬编码宽度（它将自动从子控件中选择大小）。
2. 从 DockPanel 中删除 HorizontalAlignment="Right"。
3. 将LastChildFill 设置为False，以防您不希望最后添加的孩子占用所有空间。

这就是它应该的样子，它完美地工作：

<DockPanel Grid.Row="1" LastChildFill="False">
   <Button x:Name="startPackageSendButton" Content="Start" Width="100" 
           VerticalAlignment="Top" Margin="0,0,0,0" Visibility="Collapsed" 
           HorizontalAlignment="Right"/>
   <Button x:Name="clearPackageSendButton" Content="Clear" Width="100" 
           VerticalAlignment="Top" Margin="0,0,0,0" Visibility="Visible" 
           HorizontalAlignment="Right"/>
   <Button x:Name="cancelPackageSendButton" Content="Stop" Width="100" 
           VerticalAlignment="Top" Margin="0,0,0,0" Visibility="Collapsed" 
           HorizontalAlignment="Right"/>
 </DockPanel>