XAML Storyboard animation baset on EventTrigger from another element

Question

I want to fire an animation on one element by interaction with another. I have a following code:

<Grid Name="grid1" Height="100"/>
<ItemsControl>
   <ItemsControl.ItemTemplate>
      <DataTemplate>
          <Grid>
            <Grid.Triggers>
                <EventTrigger RoutedEvent="Grid.MouseDown">
                    <BeginStoryboard>
                        <Storyboard>
                            <DoubleAnimation
                                Storyboard.TargetName="grid1"
                                Storyboard.TargetProperty="Height"
                                From="100"
                                To="60"
                                Duration="0:0:5">
                            </DoubleAnimation>
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Grid.Triggers>
        </Grid>
       </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

Every time, whet EventTrigger is fired, application goes into break mode. Why?

Oh, my bad. But it still doesn't work. App goes into break mode. — kolorowezworki, Mar 23 '18 at 11:52
Try changing `Storyboard.TargetName="grid1"` into `Storyboard.Target="{Binding ElementName=grid1}"`. [Source](https://stackoverflow.com/questions/27714597/name-cannot-be-found-in-the-name-scope-of-system-windows-controls-button) — Jack, Mar 23 '18 at 11:56
Also, post the error messages you receive. It will help identify the source of the problem. — Jack, Mar 23 '18 at 11:57
Thank you a lot! There was no any error messages, only page "the application is in break mode", but after change TargetName to Target, it works :) — kolorowezworki, Mar 23 '18 at 12:03
Possible duplicate of [Name cannot be found in the name scope of 'System.Windows.Controls.Button'](https://stackoverflow.com/questions/27714597/name-cannot-be-found-in-the-name-scope-of-system-windows-controls-button) — Jack, Mar 23 '18 at 12:04

score 0 · Accepted Answer · answered Mar 23 '18 at 12:52

Your problem is that each item in your itemscontrol will have it's own namescope. grid1 will not be found because it's not in that namescope. This is necessary otherwise you wouldn't be able to reference things by name in such a template.

This code works, because there's just the one itemscontrol and it's in the same namescope as grid1:

<StackPanel>
    <Grid Name="grid1" Height="100"/>
    <ItemsControl  ItemsSource="{Binding Items}"

             >
        <ItemsControl.Triggers>
            <EventTrigger RoutedEvent="Grid.MouseDown">
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation
                            Storyboard.TargetName="grid1"
                            Storyboard.TargetProperty="Height"
                            From="100"
                            To="60"
                            Duration="0:0:5">
                        </DoubleAnimation>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </ItemsControl.Triggers>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Grid>
                    <TextBlock Text="{Binding}"/>
                </Grid>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</StackPanel>

XAML Storyboard animation baset on EventTrigger from another element

1 Answers1