按下时更改按钮的边框

时间:2018-01-08 12:33:33

标签: c# wpf button triggers styles

我的按钮已经有了这种风格:

<Style x:Key="ControlButtons">
    <Setter Property="Button.Height" Value="25" />
    <Setter Property="Button.Width" Value="60" />
    <Setter Property="Button.Background" Value="#FF373E48" />
    <Setter Property="Button.Foreground" Value="White" />
    <Setter Property="Button.Margin" Value="3,15,0,5" />
    <Setter Property="Button.HorizontalAlignment" Value="Left" />
    <Setter Property="Button.VerticalAlignment" Value="Center" />
    <Setter Property="Button.Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border Background="{TemplateBinding Background}" BorderThickness="0.5" BorderBrush="White">
                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsEnabled" Value="False">
                        <Setter Property="Background" Value="#FF3D4959" />
                        <Setter Property="Foreground" Value="#FF7B7F84" />
                    </Trigger>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Background" Value="#FF3A3F4C" />
                        <Setter Property="Foreground" Value="White" />
                    </Trigger>
                    <Trigger Property="IsPressed" Value="True">
                        <Setter Property="Background" Value="#FF373E48" />
                        <Setter Property="Foreground" Value="#FF000000" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

现在我想在按下按钮时更改它的边框,我无法弄清楚它是如何放入代码的...... 我发现这已经WPF changing button background on click,但我似乎无法找到将其融入我的代码的方法......

任何帮助表示赞赏!

编辑:

我改变了我的风格,现在它正在工作:

<Style x:Key="ControlButtons">
    <Setter Property="Button.Height" Value="25" />
    <Setter Property="Button.Width" Value="60" />
    <Setter Property="Button.Background" Value="#FF373E48" />
    <Setter Property="Button.Foreground" Value="White" />
    <Setter Property="Button.Margin" Value="3,15,0,5" />
    <Setter Property="Button.HorizontalAlignment" Value="Left" />
    <Setter Property="Button.VerticalAlignment" Value="Center" />
    <Setter Property="Button.Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border Name="brdbutton"  Background="{TemplateBinding Background}" BorderThickness="0.5" BorderBrush="White">
                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsEnabled" Value="False">
                        <Setter Property="Background" Value="#FF3D4959" />
                        <Setter Property="Foreground" Value="#FF7B7F84" />
                    </Trigger>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Background" Value="#FF3A3F4C" />
                        <Setter Property="Foreground" Value="White" />
                    </Trigger>
                    <Trigger Property="IsPressed" Value="True">
                        <Setter Property="Background" Value="#FF373E48" />
                        <Setter Property="Foreground" Value="#FF000000" />
                        <Setter Property="Border.BorderThickness" Value="0.5" TargetName="brdbutton" />
                        <Trigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <ColorAnimation Storyboard.TargetName="brdbutton"  Storyboard.TargetProperty="(Button.BorderBrush).(SolidColorBrush.Color)" To="LawnGreen"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </Trigger.EnterActions>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

3 个答案:

答案 0 :(得分:2)

您必须按照我在下面编辑的内容更改您的代码:

<Style x:Key="ControlButtons">
            <Setter Property="Button.Height" Value="25" />
            <Setter Property="Button.Width" Value="60" />
            <Setter Property="Button.Background" Value="#FF373E48" />
            <Setter Property="Button.Foreground" Value="White" />
            <Setter Property="Button.BorderBrush" Value="White" />
            <Setter Property="Button.Margin" Value="3,15,0,5" />
            <Setter Property="Button.HorizontalAlignment" Value="Left" />
            <Setter Property="Button.VerticalAlignment" Value="Center" />
            <Setter Property="Button.Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Border Background="{TemplateBinding Background}" BorderThickness="0.5" BorderBrush="{TemplateBinding BorderBrush}">
                            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsEnabled" Value="False">
                                <Setter Property="Background" Value="#FF3D4959" />
                                <Setter Property="Foreground" Value="#FF7B7F84" />
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Background" Value="#FF3A3F4C" />
                                <Setter Property="Foreground" Value="White" />
                            </Trigger>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter Property="Background" Value="#FF373E48" />
                                <Setter Property="Foreground" Value="#FF000000" />
                                <Setter Property="BorderBrush" Value="Red" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

答案 1 :(得分:1)

我这样做了:

<Style x:Key="ControlButtons">
        <Setter Property="Button.Height" Value="25" />
        <Setter Property="Button.Width" Value="60" />
        <Setter Property="Button.Background" Value="#FF373E48" />
        <Setter Property="Button.Foreground" Value="White" />
        <Setter Property="Button.Margin" Value="3,15,0,5" />
        <Setter Property="Button.HorizontalAlignment" Value="Left" />
        <Setter Property="Button.VerticalAlignment" Value="Center" />
        <Setter Property="Button.Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Border Name="brdbutton" Background="{TemplateBinding Background}" BorderThickness="0.5" BorderBrush="White">
                        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsEnabled" Value="False">
                            <Setter Property="Background" Value="#FF3D4959" />
                            <Setter Property="Foreground" Value="#FF7B7F84" />
                        </Trigger>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="Background" Value="#FF3A3F4C" />
                            <Setter Property="Foreground" Value="White" />
                        </Trigger>
                        <Trigger Property="IsPressed" Value="True">
                            <Setter Property="Background" Value="#FF373E48" />
                            <Setter Property="Foreground" Value="#FF000000" />
                            <Setter Property="Border.BorderBrush" Value="Yellow" TargetName="brdbutton" />
                            <Setter Property="Border.BorderThickness" Value="3" TargetName="brdbutton" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

答案 2 :(得分:1)

Border元素添加x:Name并指定TargetName的{​​{1}}:

Setter