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

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

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

绿色

在这种情况下，您可以利用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。也许您还想了解

在这里，您可以在这种情况下利用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。也许您还想知道，

您不需要更改外部

边框的背景，而是更改
控件模板内的背景，您可以使用
边框笔刷
执行相同操作，因此无需使用外部
边框将其包裹起来。只需将所有内容纳入您的
风格
和
模板

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

试试这个

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

试试这个

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