Общий шаблон для изображения со стилем и триггерами - PullRequest
Новая
       3

Общий шаблон для изображения со стилем и триггерами

1 голос
/ 18 декабря 2011

Я видел этот пост Учитывая элемент управления WPF Image, как я могу увеличить его с помощью анимации на MouseEnter?

, и мне было интересно, хочу ли я повторно использовать этот код на многих изображенияхв моем проекте, как я могу применить шаблон для этого?

Я попытался создать стиль, но у меня возникло исключение, что я не могу использовать TargetName в Storyboard.TargetName = "scale"

Код:

<Image Width="100" Height="100" Source="...">
    <Image.RenderTransform>
        <ScaleTransform 
            x:Name="scale" 
            CenterX="50" 
            CenterY="50" 
            ScaleX="1" 
            ScaleY="1" />
    </Image.RenderTransform>

    <Image.Triggers>
        <EventTrigger RoutedEvent="Image.MouseEnter">
            <BeginStoryboard>
                <BeginStoryboard.Storyboard>
                    <Storyboard Duration="0:0:0.2">
                        <DoubleAnimation 
                            Storyboard.TargetName="scale" 
                            Storyboard.TargetProperty="ScaleX" 
                            To="1.5" />
                        <DoubleAnimation 
                            Storyboard.TargetName="scale" 
                            Storyboard.TargetProperty="ScaleY" 
                            To="1.5" />
                    </Storyboard>
                </BeginStoryboard.Storyboard>
            </BeginStoryboard>
        </EventTrigger>

        <EventTrigger RoutedEvent="Image.MouseLeave">
            <BeginStoryboard>
                <BeginStoryboard.Storyboard>
                    <Storyboard Duration="0:0:0.2">
                        <DoubleAnimation 
                            Storyboard.TargetName="scale" 
                            Storyboard.TargetProperty="ScaleX" 
                            To="1" />
                        <DoubleAnimation 
                            Storyboard.TargetName="scale" 
                            Storyboard.TargetProperty="ScaleY" 
                            To="1" />
                    </Storyboard>
                </BeginStoryboard.Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Image.Triggers>
</Image>

1 Ответ

0 голосов
/ 18 декабря 2011

это не окончательный ответ, но я пытаюсь с этого утра (я должен идти сейчас :-)), но я подумал, что это может привести вас к поиску ответа.У меня все еще есть ошибка времени выполнения, но она, кажется, на правильном пути. 

<Window.Resources>
    <ScaleTransform x:Key="Scale" 
        CenterX="50" 
        CenterY="50" 
        ScaleX="1.5" 
        ScaleY="1.5" />
    <Style x:Key="ImageStyle" TargetType="Image">
        <Style.Setters>
            <Setter Property="Image.RenderTransform" Value="{StaticResource Scale}" />
        </Style.Setters>
        <Style.Triggers>
            <EventTrigger RoutedEvent="Image.MouseEnter">
                <BeginStoryboard>
                    <BeginStoryboard.Storyboard>
                        <Storyboard Duration="0:0:0.2">
                            <DoubleAnimation 
                                Storyboard.Target="{DynamicResource Scale}"
                                Storyboard.TargetProperty="ScaleX" 
                                To="1.5" />
                            <DoubleAnimation 
                              Storyboard.Target="{DynamicResource Scale}"
                              Storyboard.TargetProperty="ScaleY" 
                              To="1.5" />
                        </Storyboard>
                    </BeginStoryboard.Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Style.Triggers>
    </Style>


</Window.Resources>

   <Image Grid.Row="2" Width="100" Height="100" Source="C:\WindowPhoneApp7_1.PNG" Style="{StaticResource ImageStyle}">
...