Как изменить визуальное состояние из просмотра прокрутки в wpf xaml

Question

Я дергаю себя за волосы, пытаясь заставить это работать. Я пытаюсь научиться делать переходы и немного борюсь. В основном я делаю комбо-бокс, состоящий из сетки, содержащей 2 строки. верхний ряд представляет собой кнопку, при нажатии открывается нижний ряд, показывающий scrollviewer динамически добавленных кнопок. При нажатии нижняя строка сетки будет свернута.

Проблема в том, что событие Click, похоже, не запускается из средства просмотра прокрутки или не может найти визуальное состояние в области видимости или что-то в этом роде. Так что это SelectionMode работает нормально при нажатии кнопки 11, но ничего не происходит, когда я нажимаю кнопку элемента. Кнопки это scrollviewer отлично работают со своими собственными цветными анимациями, стрельбами и т. д.

Я был бы открыт для решения в коде позади, так как я могу сделать событие перенаправленного клика без проблем, но мне не повезло с

VisualStateManager.GoToState(gridContent, "HiddenMode", true);

В идеале я хотел бы, чтобы это был пользовательский элемент управления, который я могу добавить как local:CustomComboBox но мне сложно на данном этапе иметь элементы управления внутри элементов управления в пользовательском элементе управления.

MyButton1 это просто кнопка, но с цветными переходами и т. д.

Нет исключений / ошибок, просто ничего не происходит, когда я нажимаю кнопку

<Window.Resources>

    <Storyboard x:Key="sb1">
        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="gridContent" Storyboard.TargetProperty="Height">
            <EasingDoubleKeyFrame KeyTime="0" Value="30" />
            <EasingDoubleKeyFrame KeyTime="0:0:1" Value="160" />
        </DoubleAnimationUsingKeyFrames>
        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="scrItems" Storyboard.TargetProperty="Height">
            <EasingDoubleKeyFrame KeyTime="0" Value="0" />
            <EasingDoubleKeyFrame KeyTime="0:0:1" Value="130" />
        </DoubleAnimationUsingKeyFrames>
    </Storyboard>
    <Storyboard x:Key="sb2">
        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="gridContent" Storyboard.TargetProperty="Height">
            <EasingDoubleKeyFrame KeyTime="0" Value="160" />
            <EasingDoubleKeyFrame KeyTime="0:0:1" Value="30" />
        </DoubleAnimationUsingKeyFrames>
        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="scrItems" Storyboard.TargetProperty="Height">
            <EasingDoubleKeyFrame KeyTime="0" Value="130" />
            <EasingDoubleKeyFrame KeyTime="0:0:1" Value="0" />
        </DoubleAnimationUsingKeyFrames>
    </Storyboard>
</Window.Resources>


<Grid Name="Grid1" Margin="0,22,0,0" RenderTransformOrigin="0.5,0.5">
        <Grid Name="gridContent" HorizontalAlignment="Left" Margin="187,74,0,0" VerticalAlignment="Top" Width="140" Height="30" RenderTransformOrigin="0.5,0.5">
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="VisualStateGroup">
                <VisualState x:Name="SelectionMode" Storyboard="{StaticResource sb1}" />
                <VisualState x:Name="HiddenMode" Storyboard="{StaticResource sb2}" />
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>

        <Grid.RowDefinitions>
                <RowDefinition Height="30"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>


        <local1:Button1 Name="Button11" Content="Click" Height="30" Grid.Row="0" Margin="0,0,0,30">
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="Click">
                        <ei:GoToStateAction TargetName="gridContent" StateName="SelectionMode" />
                    </i:EventTrigger>
                </i:Interaction.Triggers>
            </local1:Button1>
        <ScrollViewer Name="scrItems"  VerticalScrollBarVisibility="Hidden" HorizontalScrollBarVisibility="Hidden" Margin="0" Width="140" Height="0" Grid.Row="1">

            <ItemsControl x:Name="stkItems">

                    <ItemsControl.ItemsPanel>
                        <ItemsPanelTemplate>
                            <StackPanel Orientation="Vertical"/>
                        </ItemsPanelTemplate>
                    </ItemsControl.ItemsPanel>
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>

                        <local1:Button1 Content="Click" Height="30">
                            <i:Interaction.Triggers>
                                <i:EventTrigger EventName="Click">

                                    <ei:GoToStateAction TargetName="gridContent" StateName="HiddenMode" />
                                </i:EventTrigger>
                            </i:Interaction.Triggers>
                        </local1:Button1>
                    </DataTemplate>

                    </ItemsControl.ItemTemplate>
                </ItemsControl>
            </ScrollViewer>
        </Grid>
</Grid>




private void Window_Loaded(object sender, RoutedEventArgs e)
    {
        lstItems = new ObservableCollection<MyButton.Button1>();
        for (int i = 0; i <= 999; i++)
        {
            MyButton.Button1 item1 = new Button1();
            item1.Content = "Item " + i;
            item1.Width = stkItems.Width;
            item1.Height = 30;
            //item1.Click += new RoutedEventHandler(Button_Item_Click);
            lstItems.Add(item1);
        }
        stkItems.DataContext = this.stkItems;
        stkItems.ItemsSource = lstItems;
    }

Answer 1

РЕШИТЬ!!!

Я переместил visualStateManager в корневой элемент - Grid1, но не знаю, влияет ли это на него

private void Button_Item_Click(object sender, RoutedEventArgs e)
    {
        bool g = ExtendedVisualStateManager.GoToElementState(this.Grid1 as FrameworkElement, "HiddenMode", true);
    }