Eventtriggers XAML WPF Animation

Question

I have such question. I want to resize window and change margin of some grid by clicking on button, and animate that back by clicking another button using eventtriggers and XAML. These buttons are in window, but not in that grid.

I need to do this using storyboard.target or storyboard.targetname. For example I have this code:

<Window blabla
        x:Name="window">

    <Grid>
        <Button>
            <Button.Style>
                <Style TargetType="{x:Type Button}">
                    <Style.Triggers>
                        <EventTrigger RoutedEvent="Click">
                            <BeginStoryBoard>
                                <StoryBoard>
                                    <DoubleAnimation From="300"
                                                     To="500"
                                                     Duration="0:0:1"
                                                     StoryBoard.Target="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type Window}}}"
                                                     StoryBoard.TargetProperty="Height"/>
                                    <ThicknessAnimation From="0"
                                                        To="20"
                                                        Duration="0:0:1"
                                                        StoryBoard.TargetName="grid"
                                                        StoryBoard.TargetProperty="Margin"/>
                                </StoryBoard>
                            </BeginStoryBoard>
                        </EventTrigger>
                    </Style.Triggers>
                </Style>
            </Button.Style>
        </Button>
        <Button>
            <Button.Style>
                <Style TargetType="{x:Type Button}">
                    <Style.Triggers>
                        <EventTrigger RoutedEvent="Click">
                            <BeginStoryBoard>
                                <StoryBoard>
                                    <DoubleAnimation From="500"
                                                 To="300"
                                                 Duration="0:0:1"
                                                 StoryBoard.Target="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type Window}}}"
                                                 StoryBoard.TargetProperty="Height"/>
                                    <ThicknessAnimation From="20"
                                                    To="0"
                                                    Duration="0:0:1"
                                                    StoryBoard.TargetName="grid"
                                                    StoryBoard.TargetProperty="Margin"/>
                                </StoryBoard>
                            </BeginStoryBoard>
                        </EventTrigger>
                    </Style.Triggers>
                </Style>
            </Button.Style>
        </Button>
    </Grid>
    <Grid x:Name="grid"/>
</Window>

But this code does not work.

so, I have already searched on this forum, but I haven`t found any working solution for me.

Could you show me some code how to achieve this?

In your grid use a `DataTrigger` to begin your `Storyboard`, based on a `ToggleButton` property, I think it's called `Checked`. The words with background are what you need to "Google" from there you will get what you need. Another keyword for you would be `RelativeSource`. HTH — XAMlMAX, Dec 07 '16 at 23:02
also- http://stackoverflow.com/questions/1127933/wpf-databinding-how-do-i-access-the-parent-data-context — Oyiwai, Dec 08 '16 at 08:56

Eventtriggers XAML WPF Animation

0 Answers0