Reduzieren Sie den Rand der Schaltfläche, wenn die Schaltfläche fokussiert ist

Question

Ich habe ein Szenario, in dem ich den Rand eines Button-Steuerelement reduzieren möchte, wenn es den Fokus erhält. Dies liegt daran, dass ich die Rahmeneigenschaft dieses Button-Steuerelements erhöhen und gleichzeitig die Schaltfläche beibehalten möchte, um dieselbe Größe (Höhe und Breite) beizubehalten. Ein bisschen Aufwand im Web hat mich dazu gebracht, einen ValueConverter zu schreiben und die Marge zu reduzieren. Aber ich bin immer noch nicht in der Lage, den Arbeitscode bis jetzt aufzustellen. Hier ist, was ich durcheinandergebracht haben bis

XAML

<ControlTemplate.Triggers> <!--ControlTemplate for the Button--> 
         <Trigger Property="IsFocused" Value="True"> 
          <Setter Property="BorderBrush" TargetName="bdrButton" Value="Wheat"/> 
          <Setter Property="BorderThickness" TargetName="bdrButton" Value="2"/> 
          <Setter Property="Margin" TargetName="bdrButton" > 
           <Setter.Value> 
           <Binding ElementName="bdrButton" Path="Margin" Converter="{StaticResource N_MarginReducer}"> 
             <Binding.ConverterParameter> 
              <Thickness>1,1,1,1</Thickness> 
             </Binding.ConverterParameter> 
            </Binding> 
           </Setter.Value> 
          </Setter> 
         </Trigger> 
        </ControlTemplate.Triggers> 

Converter:

public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) { 
    Thickness newMargin = new Thickness(); 
    Thickness margin = (Thickness)value; 
    Thickness reduceBy = (Thickness)parameter; 

    newMargin.Left = margin.Left - reduceBy.Left; 
    newMargin.Top = margin.Top - reduceBy.Top; 
    newMargin.Right = margin.Right - reduceBy.Right; 
    newMargin.Bottom = margin.Bottom - reduceBy.Bottom; 

    return newMargin; 
} 

Die obigen Code Ergebnisse in Stackoverflow für die Margin.Left rekursiv aufgerufen werden. Jeder hat eine bessere Idee oder Umsetzung für das Szenario, das ich erreichen möchte.

Answer 1

Sie möchten eine ThicknessAnimation für die Margin und eine DoubleAnimation für die Höhe/Breite verwenden, anstatt einen Konverter zu verwenden.

http://msdn.microsoft.com/en-us/library/system.windows.media.animation.thicknessanimation.aspx

http://msdn.microsoft.com/en-us/library/system.windows.media.animation.doubleanimation.aspx

Beispiel:

<StackPanel> 
    <StackPanel.Resources> 
     <Thickness x:Key="unfocusedThickness" Top="15" Left="15" Right="15" Bottom="15"/> 
     <Thickness x:Key="focusedThickness" Top="5" Left="5" Right="5" Bottom="5"/> 
    </StackPanel.Resources> 
    <Button Height="100" Width="100" Margin="15"> 
     <Button.Triggers> 
      <EventTrigger RoutedEvent="Button.GotFocus"> 
       <BeginStoryboard> 
        <Storyboard> 
         <DoubleAnimation Storyboard.TargetProperty="Height" From="100" To="120" Duration="0:0:0"/> 
         <DoubleAnimation Storyboard.TargetProperty="Width" From="100" To="120" Duration="0:0:0"/> 
         <ThicknessAnimation Storyboard.TargetProperty="Margin" From="{StaticResource unfocusedThickness}" To="{StaticResource focusedThickness}" Duration="0:0:0"/> 
        </Storyboard> 
       </BeginStoryboard> 
      </EventTrigger> 
      <EventTrigger RoutedEvent="Button.LostFocus"> 
       <BeginStoryboard> 
        <Storyboard> 
         <DoubleAnimation Storyboard.TargetProperty="Height" From="120" To="100" Duration="0:0:0"/> 
         <DoubleAnimation Storyboard.TargetProperty="Width" From="120" To="100" Duration="0:0:0"/> 
         <ThicknessAnimation Storyboard.TargetProperty="Margin" To="{StaticResource unfocusedThickness}" From="{StaticResource focusedThickness}" Duration="0:0:0"/> 
        </Storyboard> 
       </BeginStoryboard> 
      </EventTrigger> 
     </Button.Triggers> 
    </Button> 
    <TextBox /> 
</StackPanel>