ВПФ:Изменить цвет фона границы при нажатии левой кнопки мыши

StackOverflow https://stackoverflow.com/questions/2208447

Вопрос

Ниже приведен стиль, который я использую для кнопок в своем приложении.Теперь я пытаюсь изменить цвет фона Border элемент, имеющий имя "Background" когда пользователь нажимает на кнопку левой кнопкой мыши.

Как мне это сделать?

<Style TargetType="{x:Type Button}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border BorderBrush="#6e6964" BorderThickness="1" CornerRadius="1" Margin="{TemplateBinding Margin}" SnapsToDevicePixels="True">
                    <Border BorderBrush="White" BorderThickness="1" CornerRadius="1" SnapsToDevicePixels="True">
                        <Border Padding="12,4,12,4" SnapsToDevicePixels="True" Name="Background">
                            <Border.Background>
                                <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                    <GradientStop Color="White" Offset="0"/>
                                    <GradientStop Color="#f1f1f1" Offset="1"/>
                                </LinearGradientBrush>
                            </Border.Background>
                            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                        </Border>
                    </Border>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Background" TargetName="Background">
                            <Setter.Value>
                                <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                    <GradientStop Offset="0" Color="#edf8fb"/>
                                    <GradientStop Offset="1" Color="#e2edf0"/>
                                </LinearGradientBrush>
                            </Setter.Value>
                        </Setter>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
Это было полезно?

Решение

Вам просто нужно следующее свойство курок:

            <ControlTemplate.Triggers>
                <Trigger Property="IsPressed" Value="True">
                    <Setter Property="Background" TargetName="Background" Value="Red"/>
                </Trigger>
            </ControlTemplate.Triggers>

Другие советы

Вам нужен EventTrigger

Дайте одному или обоим GradientStops вашего Border имя (а не имя в вашем триггере):

<GradientStop Color="#f1f1f1" Offset="1" x:Name="Stop2" />

И добавьте следующий EventTrigger в свой ControlTemplate.Triggers:

<EventTrigger RoutedEvent="Button.Click">
  <EventTrigger.Actions>
    <BeginStoryboard>
      <Storyboard>
        <ColorAnimation Storyboard.TargetName="Stop2" Storyboard.TargetProperty="Color" To="Red" Duration="0" />
      </Storyboard>
    </BeginStoryboard>
  </EventTrigger.Actions>
</EventTrigger>

Если вы хотите изменить обе точки градиента, обязательно дайте им имя и выполните ColorAnimation для каждой из них индивидуально (я думаю, вы можете сделать их обе в одной раскадровке).

Надеюсь, поможет!

Редактировать:Это сделает изменение постоянным в событии Click (я тестировал с VS 2010 Beta 2, и Button.MouseLeftButtonDown не работает, но Button.Click работает только при нажатии левой кнопки мыши, но не при нажатии правой кнопки мыши).Если вы хотите, чтобы изменения происходили только при нажатой мыши...но вернитесь к нормальному значению, когда кнопка больше не нажата...тогда вам следует использовать триггер свойства IsPressed, как указано в другом ответе.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top