c # DataTrigger Проблема с раскадровкой

Question

Я хочу, чтобы моя сетка отображалась при нажатии кнопки и скрывалась при повторном нажатии.Когда я добавляю один DataTrigger в сетку, он работает нормально, однако для двух из них он работает только на последнем, а когда он предназначен для воспроизведения анимации для первого, он просто ничего не делает.Вот код

    <Grid Background="Red" HorizontalAlignment="Left" VerticalAlignment="Top">
        <Grid.Style>
            <Style TargetType="Grid">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding Open}" Value="True">
                        <DataTrigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <DoubleAnimation Duration="0:0:1" Storyboard.TargetProperty="Width" From="0" To="300"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </DataTrigger.EnterActions>
                    </DataTrigger>
                    <DataTrigger Binding="{Binding Open}" Value="False">
                        <DataTrigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <DoubleAnimation Duration="0:0:1" Storyboard.TargetProperty="Width" From="300" To="0"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </DataTrigger.EnterActions>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Grid.Style>
        <Button />
    </Grid>

И моя ViewModel

   public bool Open
    {
        get
        {
            return _open;
        }
        set
        {
            _open = value;
            RaisePropertyChanged("Open");
        }
    }

    public RelayCommand OpenButtonClicked
    {
        get;
        private set;
    }

    private bool _open;

    public AppMenuViewModel() : base()
    {
        _open = false;
        OpenButtonClicked = new RelayCommand(() => Open = !Open);
    }

В чем проблема, и если ее нет, что я могу сделать, чтобы добиться того, чего я хочу?

Answer 1

Ваша проблема в том, что анимация не останавливается.Добавьте FillBehavior="Stop" к анимации, и вы получите то, что вам нужно.

<Style TargetType="Grid">
    <Style.Triggers>
        <DataTrigger Binding="{Binding Open}" Value="True">
            <DataTrigger.EnterActions>
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation Duration="0:0:1" Storyboard.TargetProperty="Width" From="0" To="300" FillBehavior="Stop"/>
                    </Storyboard>
                </BeginStoryboard>
            </DataTrigger.EnterActions>
        </DataTrigger>
        <DataTrigger Binding="{Binding Open}" Value="False">
            <DataTrigger.EnterActions>
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation Duration="0:0:1" Storyboard.TargetProperty="Width" From="300" To="0" FillBehavior="Stop"/>
                    </Storyboard>
                </BeginStoryboard>
            </DataTrigger.EnterActions>
        </DataTrigger>
    </Style.Triggers>
</Style>