ボタンがフォーカスされているときのボタンのマージンを減らす

Question

フォーカスを受け取ったときにButtonコントロールの余白を減らしたいシナリオがあります。なぜなら、私はそのButtonコントロールのボーダープロパティを増やすことはできませんし、同時に同じサイズ（高さと幅）を維持することもできないからです。そこで、Web上での少しの努力は私にValueConverterを書いてマージンを減らすように案内しました。しかし、私はまだ作業コードを立てることができません。

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; 
} 

再帰的に呼び出されてMargin.LeftためStackOverflowExceptionが上記のコードの結果：ここで私はコンバータ

<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> 

XAML

をごちゃ混ぜにしたものです。誰でも私が達成しようとしているシナリオのより良いアイデアや実装があります。

Answer 1

マージンにはThicknessAnimationを使用し、高さ/幅にはDoubleAnimationを使用することをお勧めします。

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

例：

<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>