4

Доброго времени суток, Хешкодовцы

В продолжение предыдущего моего вопроса по поводу анимации с использованием триггеров.

Хочется сделать анимацию цветом при наведении курсора мышки на кнопку. Для этого разработал стиль, который должен применяться при наведении мышки на кнопку. Но тут появилось 2 проблемы:

  • Как применить стиль к кнопки при срабатывании триггера? Что-то никак не получается.
  • Если не использовать стиль, то происходит нечто странное: триггер срабатывает и фон кнопки красится в желтый цвет (ну так и задумано), но после этого практически сразу (менее чем через секунду) он заливается ярко-серым градиентом, как будто где-то перекрывается моя анимация еще какой-то. Как это можно отследить, кто перекрывает мои стили?..

Заранее спасибо за Вашу помощь.


Update

Ну вот и опять появилось время для самообучения. Попытался вспомнить, на чем остановился, еще нашел неплохую статью в MSDN, делаю аналогично, но другие стили, и на тригерах опять столкнулся с проблемой. То ли читаю криво, то ли в windows 7 как-то особенно получается.

В общем суть проблемы как было написано раньше осталась. Код XAML:

<Window x:Class="WpfApplication2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="150" Width="150">
    <Window.Resources>
        <Style x:Key="testBtn" TargetType="Button">
            <Setter Property="Background" Value="Skyblue">
            </Setter>
            <Style.Triggers>
                <EventTrigger RoutedEvent="MouseEnter">
                    <EventTrigger.Actions>
                        <BeginStoryboard>
                            <Storyboard Storyboard.TargetProperty="Background.Color">
                                <ColorAnimation To="Red" Duration="0:0:0:5"></ColorAnimation>
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger.Actions>
                </EventTrigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <Grid>
        <Button Style="{StaticResource testBtn}"></Button>
    </Grid>
</Window>

А вот результат. Изначально окно с растянутой кнопкой:

alt text

После наведения курсора мышки:

alt text

Убрали курсор мышки:

alt text

Итого видим, что изначальный цвет соответствует задуманному, окончательный цвет должен был появиться при наведении курсора, однако в момент наведения курсора видим какие-то стили от семёрки. Ну и окончательный вариант соответствует ожиданию, так как не обрабатываем уход курсора.

В общем, где я проглядел что-то?

1
  • Подменять стиль не очень хорошо, ведь вместе со стилем вы уберёте и триггер. Дайте код вашего стиля, подумаем.
    – VladD
    28 янв 2013 в 18:40

1 ответ 1

5

Смотрите, в чём дело.

Стиль для Button определяется примерно так, как в этом примере: http://msdn.microsoft.com/en-us/library/ms753328.aspx. Вы видите, что анимация на MouseOver реализована в переопределённом ControlTemplate через VisualStateManager (почитайте про него, полезная штука). Что происходит на самом деле:

  • срабатывает ваш триггер и переключает Background
  • срабатывает VisualStateManager, переходит в состояние CommonStates.MouseOver, и применяет поверх ваших изменений свои вычисленные значения (которые определены в Template, унаследованном от системного стиля.)

То есть так сделать не получится, т. к. два фрагмента кода «сражаются» за цвет фона.

Мораль отсюда такова: если уж меняете стиль контрола, перекрывайте его полностью. Или пользуйтесь выставленными наружу свойствами, это предусмотренные дизайном точки кастомизации.

2
  • Как все запутано :-) но вроде помогла, надо самому сделать такое и по каждому телу почитать... Спасибо. 2 окт 2013 в 7:22
  • @pincher1519: пожалуйста!
    – VladD
    2 окт 2013 в 7:57

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.