Question

I’m trying to perform animation of an element when a certain button, which exists elsewhere in the window, is clicked.

Here is what I have tried:

    <Border Grid.Column="0" BorderThickness="1" BorderBrush="Blue"
                CornerRadius="30" Margin="4">
            <Border.Triggers>
                <EventTrigger **SourceName="btnSearch"  RoutedEvent="UIElement.MouseUp"**>
                    <EventTrigger.Actions>
                        <BeginStoryboard>
                            <Storyboard TargetProperty="Opacity">
                                <DoubleAnimation From="0" To="1" Duration="0:0:2"/>
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger.Actions>
                </EventTrigger>
            </Border.Triggers>
            <ScrollViewer VerticalScrollBarVisibility="Auto">
                <ItemsControl x:Name="itmsSearch" ItemsSource="{Binding}" Padding="4"
                              ItemTemplate="{StaticResource SearchResultItemDT}">
                </ItemsControl>
            </ScrollViewer>
        </Border>

The properties for my EventTrigger seem to have the wrong values which leads to an exception being thrown stating that no element with the name btnSearch can be found.

The said button resides elsewhere in my window:

    <StackPanel
        Height="30"
        Orientation="Horizontal"
        Margin="5">

        <TextBox
            x:Name="txtSearch"
            Width="650"
            FontFamily="Comic Sans MS"
            Foreground="Chocolate" />
        <Button
            x:Name="btnSearch"
            Width="100"
            Content="Go!"
            Click="BtnSearch_Click" />
    </StackPanel>

I just assumed that setting SourceName to the name of the required button would do the trick. But it’s not working 🙁

Answer 1

Try setting StoryBoard.TargetName property to the element name you want to animate.You have already set the StoryBoard.TargetProperty. When the TargetName property is not set, it assumes the current element.

You dont need to set the SourceName.

Example:

<Grid xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
    <Grid.Triggers>
        <EventTrigger  RoutedEvent="Grid.Loaded">
            <BeginStoryboard>
                <Storyboard TargetName="jim2" TargetProperty="Opacity">
                    <DoubleAnimation From="1" To="0" Duration="0:0:4" 
AutoReverse="True" RepeatBehavior="Forever"/>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Grid.Triggers>
    <Image Name="jim1" Source="jim1.gif"/>
    <Image Name="jim2" Source="jim2.gif"/>
</Grid>