Silverlight 4 Foreground ColorAnimation - PullRequest
Новая
       17

Silverlight 4 Foreground ColorAnimation

3 голосов
/ 23 августа 2010

Я пытаюсь анимировать цвет переднего плана кнопки гиперссылки, когда пользователь MouseOver элемента управления.Я создал собственный стиль, в котором я хочу анимировать цвет переднего плана.Цвет переднего плана установлен следующим образом: 

<Setter Property="Foreground" Value="#FF73A9D8"/>

В разделе visualStateManager у меня есть следующий элемент для анимации цвета 

<ColorAnimation Duration="0:0:0.5" 
              Storyboard.TargetName="contentPresenter" 
              Storyboard.TargetProperty="(Control.Foreground).(SolidColorBrush.Color)" 
              To="Black" />

Проблема в том, что я не могу понять, какое значениедолжно быть Storyboard.TargetName.

Текст задается в элементе управления ContentPresenter, который не имеет свойства Foreground

1 Ответ

4 голосов
/ 23 августа 2010

Вы правы.Нигде нельзя повесить анимацию внутри шаблона элемента управления.

Хотя HyperlinkButton имеет свойство переднего плана, которое наследуется его content , свойство не отображается как часть шаблона.

Лучше всего создать пользовательский элемент управления, который воспроизводит 2 раскадровки с помощью поведения MouseEnter / MouseLeave (XAML «GlowingHyperlinkButton» ниже).Вам, конечно, все еще нужно будет выставить контент через свойство зависимости: 

<UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity" xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
    mc:Ignorable="d"
    x:Class="SilverlightApplication1.GlowingHyperlinkButton"
    d:DesignWidth="94" d:DesignHeight="16">
    <UserControl.Resources>
        <Storyboard x:Name="MouseEnterStoryboard">
            <ColorAnimation Duration="0:0:0.5" To="#FFDF00EB" Storyboard.TargetProperty="(Control.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="hyperlinkButton" d:IsOptimized="True"/>
        </Storyboard>
        <Storyboard x:Name="MouseLeaveStoryboard">
            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Control.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="hyperlinkButton">
                <SplineColorKeyFrame KeyTime="0:0:0.5" Value="#FF49ED28"/>
            </ColorAnimationUsingKeyFrames>
        </Storyboard>
    </UserControl.Resources>

    <Grid x:Name="LayoutRoot">
        <HyperlinkButton x:Name="hyperlinkButton" Content="HyperlinkButton" Foreground="#FF49ED28" d:LayoutOverrides="Width, Height">
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="MouseEnter">
                    <ei:ControlStoryboardAction Storyboard="{StaticResource MouseEnterStoryboard}"/>
                </i:EventTrigger>
                <i:EventTrigger EventName="MouseLeave">
                    <ei:ControlStoryboardAction Storyboard="{StaticResource MouseLeaveStoryboard}"/>
                </i:EventTrigger>
            </i:Interaction.Triggers>
        </HyperlinkButton>
    </Grid>
</UserControl>

Извинения за ужасный выбор цветов.Надеюсь, это поможет:)

...