Question

我在按钮控件外创建了一个边框，然后我的按钮有了圆角：

<Border  Margin="0,-15,5,0" Height="50" CornerRadius="20"  BorderThickness="2" BorderBrush="#2b4e9f" >
                    <Border.Background>
                       White
                    </Border.Background>
                    <Button  Content="{Binding Path=StringFile.Match_Lens, Source={StaticResource LocalizedStrings }}"   Style="{StaticResource ButtonStyle}" FontWeight="Bold" FontSize="24" x:Name="button1" VerticalAlignment="Center" Width="156" Click="button1_Click"   Foreground="#2b4e9f" >

 </Button>
</Border>

所以我的按钮包含在一个白色背景的边框中。我想按下按钮时改变边框背景的颜色。

这适用于按钮的背景......我无法弄清楚如何使用边框控件...

 <Style x:Key="ButtonStyle" TargetType="Button">
            <Setter Property="OverridesDefaultStyle" Value="True"/>
            <Setter Property="Margin" Value="5"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border Name="border"  
                        Background="{TemplateBinding Background}"

                                >
                            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter Property="Background" TargetName="border">
                                    <Setter.Value>
                                       Green

                                    </Setter.Value>
                                </Setter>

                            </Trigger>

                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

Answer 1

您不会更改外部Border的背景，而是更改ControlTemplate内部的背景，您可以使用BorderBrush执行相同操作，因此无需使用外部{{1}进行更改}}。只需将所有内容放入Border和Style

即可

Template

然后只需将<Style TargetType="Button" x:Key="ButtonStyle"> <Setter Property="OverridesDefaultStyle" Value="True"/> <Setter Property="Margin" Value="5"/> <Setter Property="Background" Value="White"/> <Setter Property="BorderBrush" Value="#2b4e9f"/> <Setter Property="BorderThickness" Value="2"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="Button"> <Border Name="border" CornerRadius="20" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"> <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" /> </Border> <ControlTemplate.Triggers> <Trigger Property="IsPressed" Value="True"> <Setter Property="Background" TargetName="border" Value="Green"/> <Setter Property="BorderBrush" TargetName="border" Value="GreenYellow"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style>应用到您的Style，就像没有外Button

一样

Border

Answer 2

在这里，你可以在这种情况下利用DataTriggers

<Border  Margin="0,-15,5,0"
         Height="50"
         CornerRadius="20"
         BorderThickness="2"
         BorderBrush="#2b4e9f">
    <Button  Content="{Binding Path=StringFile.Match_Lens, Source={StaticResource LocalizedStrings }}"
             Style="{StaticResource ButtonStyle}"
             FontWeight="Bold"
             FontSize="24"
             x:Name="button1"
             VerticalAlignment="Center"
             Width="156"
             Click="button1_Click"
             Foreground="#2b4e9f">
    </Button>
    <Border.Style>
        <Style TargetType="Border">
            <Setter Property="Background"
                    Value="White" />
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsPressed,ElementName=button1}"
                             Value="true">
                    <Setter Property="Background"
                            Value="Green" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Border.Style>
</Border>

需要注意的一点是，当您通过样式触发器设置某个属性时，无法在线设置相同的属性，因此我将Background属性移动到setter。也许您可能还想了解Dependency Property Setting Precedence List

Answer 3

试试这个，

    <Border x:Name="border1"
            Margin="0,-15,5,0"
            Height="50"
            CornerRadius="20"
            BorderThickness="2"
            BorderBrush="#2b4e9f"
            Background="{Binding ElementName=Button1, Path=IsPressed, Converter={StaticResource ResourceKey=ColorConverter}}">
        <Button x:Name="Button1"
                Content="foo"
                FontWeight="Bold"
                FontSize="24"
                VerticalAlignment="Center"
                Width="156" />
    </Border>

这是转换器，

public class ColorConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        bool flag = (bool)value;
        if (flag)
        {
            return Brushes.Green;
        }
        else
        {
            return Brushes.Red;
        }
    }

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

按下按钮时更改按钮的圆角边框背景

3 个答案: