C# WPF | Зависимость расстояния между кнопками
Пишу прогу на C# используя WPF, и в ходе задался вопросом, как сделать зависимость расстояния между двумя кнопками, то есть если при наведении курсора на одну кнопку, увеличивается ее размер, а кнопка, которая находится рядом должна сохранить расстояние между двумя этими кнопками, и передвинуться вправо для этого. На данный момент при увеличении первой кнопки, вторая остается на месте, и поэтому первая кнопка просто заползает на нее и перекрывает.
Сразу говорю, сделал чисто для демонстрации наброску стиля и кнопок.
- Фотография, когда кнопки в иходном положении:
- Фотография, когда курсор наведён на одну из кнопок:
То есть как можно заметить, я навелся на первую кнопку и она "раскрылась", т.е. увеличила размер в ширину, и тем самым заползла на вторую кнопку. Подскажите, как сделать так, чтобы она не заползала, и вторая кнопка автоматически передвигалась в право, для того чтобы сохранить расстояние между ними
Мой код: XAML:
<Button Width="32" Height="32" Style="{StaticResource testButtonStyle}" Margin="-80,18,100,0" materialDesign:ButtonAssist.CornerRadius="13" Padding="6">
<StackPanel Width="115" Height="32" Margin="-16,-4,0,0">
<Image Source="/resources/emailIcon.png" Width="20" Height="20" Margin="-63,4,0,0" />
<TextBlock Text="Настройки" Margin="36,-20,0,0" />
</StackPanel>
</Button>
<Button Width="32" Height="32" Style="{StaticResource testButtonStyle}" Padding="6" Margin="-90,-32,0,0">
<StackPanel>
<Image Source="/resources/emailIcon.png" Width="20" Height="20" />
<TextBlock Text="Оптимиз" Width="100" />
</StackPanel>
</Button>
Код стиля, прописанный в App.xaml:
<Style x:Key="testButtonStyle" TargetType="Button" BasedOn="{StaticResource MaterialDesignFlatMidBgButton}">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="BitmapEffect">
<Setter.Value>
<DropShadowBitmapEffect Color="#A978FF" Opacity="0.6" ShadowDepth="0" />
</Setter.Value>
</Setter>
<Trigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="Width" To="115" Duration="0:0:0.2" >
<DoubleAnimation.EasingFunction>
<CircleEase />
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetProperty="Height" To="32" Duration="0:0:0.2" >
<DoubleAnimation.EasingFunction>
<CircleEase />
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
<Trigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="Width" To="32" Duration="0:0:0.2" >
<DoubleAnimation.EasingFunction>
<CircleEase />
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetProperty="Height" To="32" Duration="0:0:0.2" >
<DoubleAnimation.EasingFunction>
<CircleEase />
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
</Storyboard>
</BeginStoryboard>
</Trigger.ExitActions>
</Trigger>
</Style.Triggers>
</Style>

