Добавить изображение Silverlight Hovereffect от codebehind - PullRequest
Новая
       7

Добавить изображение Silverlight Hovereffect от codebehind

3 голосов
/ 30 мая 2010

У меня есть панель стека с динамическим количеством изображений, которые добавляются программно. Есть ли способ, которым я могу программно установить эффект наведения / щелчка на этих изображениях. Я хотел бы, чтобы изображение "светилось" при нажатии. Как мне сделать это в Silverlight? Я заметил свойство Image.Effect, но я не совсем уверен, как его использовать.

Ответы [ 2 ]

2 голосов
/ 30 мая 2010

Что вам нужно сделать, это создать новый пользовательский элемент управления с элементом управления изображением внутри, к которому прикреплены визуальные состояния. Таким образом, вы можете динамически добавлять usercontrol в панель стека и вызывать анимации, не присоединяя их к событиям из вашего основного приложения.

Я использовал DropShadowEffect на Image.Effect для создания пульсирующей анимации.

Например, Это внутри вашего usercontrol:

1010 * XAML *

    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="ImageState">
            <VisualState x:Name="NormalImageState">
                <Storyboard>
                    <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="(UIElement.Effect).(DropShadowEffect.BlurRadius)" Storyboard.TargetName="image1" d:IsOptimized="True"/>
                </Storyboard>
            </VisualState>
            <VisualState x:Name="GlowingImageState">
                <Storyboard AutoReverse="True">
                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Effect).(DropShadowEffect.BlurRadius)" Storyboard.TargetName="image1">
                        <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                        <EasingDoubleKeyFrame KeyTime="0:0:1" Value="20"/>
                        <EasingDoubleKeyFrame KeyTime="0:0:2" Value="0"/>
                    </DoubleAnimationUsingKeyFrames>                        
                </Storyboard>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>

    <Image Name="image1" MouseEnter="image1_MouseEnter" MouseLeave="image1_MouseLeave" >
        <Image.Effect>
            <DropShadowEffect Color="Red" BlurRadius="0" ShadowDepth="0"/>
        </Image.Effect>
    </Image>

C # 

    public ImageSource ImageSource
    {
        get;
        set
        {
            image1.Source = value;
        }
    }
    private void image1_MouseEnter(object sender, System.Windows.Input.MouseEventArgs e)
    {
        VisualStateManager.GoToState(this, "GlowingImageState", true);
    }

    private void image1_MouseLeave(object sender, System.Windows.Input.MouseEventArgs e)
    {
        VisualStateManager.GoToState(this, "NormalImageState", true);
    }

Затем вы можете добавить этот элемент управления на панель стека следующим образом: 

 MyUC uc= new MyUC(); //control we just created
 uc.ImageSource = sourceOfImg; //the source of the intended image
 myStack.Children.Add(uc); //adding it to the stackpanel.

Скажите, если это работает.

1 голос
/ 30 мая 2010

Вы можете использовать преобразование для создания анимации, чтобы изменить цвет вашего изображения при нажатии.

Взгляните на страницу MSDN: Обзор анимации . На этой странице содержатся сведения о том, как сделать это программно ( Создание анимации в процедурном коде ).

...