Выравнивание только видимых элементов в док-панели

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,

Узнайте больше здесь:

Разница в том, что Visibility.Hidden скрывает элемент управления, но резервирует место, которое он занимает в макете. Таким образом, он отображает пробелы вместо элемента управления.

Visibilty.Collapsed не отображает элемент управления и не резервирует пробелы. Пространство, которое займет элемент управления, "свернуто", отсюда и название.

После вашего редактирования становится очевидным, что вы используете Hidden, Вместо этого используйте Collapsed:

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

РЕДАКТИРОВАТЬ:

Я проверил ваш пример кода после удаления части Style и Command и обнаружил несколько проблем:

1. Удалите жестко заданную ширину из DockPanel (он автоматически выберет размер из дочерних элементов управления).
2. Удалить HorizontalAlignment="Right" из DockPanel.
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>