Question

我有一个场景，我想在收到焦点时减少Button控件的边距。这是因为我不想增加Button控件的border属性，同时也不要让按钮保持相同的大小（高度和宽度）。因此，在网络上的一些努力指导我编写ValueConverter并减少保证金。但到目前为止，我仍然无法提出工作代码。这是我混乱的原因

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

转换器：

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被递归调用。任何人都有更好的想法或实现我想要实现的场景。

Answer 1

你需要使用厚度和动画的厚度和动画的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>

按钮聚焦时减少按钮的边距

1 个答案: