0

我有两个堆栈面板，其中第二个面板是额外的信息，可以在单击按钮时向下滑动并显示（如 jQuerys slideDown 效果）。然后在再次单击按钮时向上滑动。

我以前从未摆弄过动画，但一直在做一些研究。不过，我仍然很困惑，无法弄清楚这个简单的问题。

当我只听 Visibility=Visible 属性时，它工作正常。但是当我也想向上滑动面板时，它的行为很奇怪。

这是我的 XAML 代码：

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

                    <StackPanel Grid.Row="0" Width="600" Orientation="Horizontal">
                        <TextBlock Style="{StaticResource Heading4}">Panel 1</TextBlock>
                        <Button Width="300" Margin="30,0,0,0" Click="Button_OnClick">Click to slide other panel down</Button>
                    </StackPanel>

                    <StackPanel Name="StackPanelShowHide" Grid.Row="1" Width="500" Orientation="Vertical" Background="Beige" Height="70">
                        <StackPanel.Style>
                            <Style TargetType="StackPanel">
                                <Style.Triggers>
                                    <Trigger Property="Visibility"  Value="Visible">
                                        <Trigger.EnterActions>
                                            <BeginStoryboard>
                                                <Storyboard>
                                                    <DoubleAnimation Storyboard.TargetProperty="Height" From="0" To="70" Duration="0:0:1" />
                                                </Storyboard>
                                            </BeginStoryboard>
                                        </Trigger.EnterActions>
                                    </Trigger>
                                    <Trigger Property="Visibility"  Value="Collapsed">
                                        <Trigger.EnterActions>
                                            <BeginStoryboard>
                                                <Storyboard>
                                                    <DoubleAnimation Storyboard.TargetProperty="Height" From="70" To="0" Duration="0:0:1" />
                                                </Storyboard>
                                            </BeginStoryboard>
                                        </Trigger.EnterActions>   
                                    </Trigger>
                                </Style.Triggers>
                            </Style>
                        </StackPanel.Style>
                        <TextBlock Style="{StaticResource Heading4}">New panel</TextBlock>

                    </StackPanel>

                </Grid>

这是我的代码隐藏：

private void Button_OnClick(object Sender, RoutedEventArgs E) {
        if (StackPanelShowHide.Visibility == Visibility.Collapsed) {
            StackPanelShowHide.Visibility = Visibility.Visible;
        } else {
            StackPanelShowHide.Visibility = Visibility.Collapsed;
        }

    }

真的希望你能帮忙:)

亲切的问候，拉斯

4

2 回答 2

0

我相信您的问题是，当 的StackPanel值为Visibility时Collapsed，它会从 UI 中删除。因此，即使Animation发生了，您也不会看到它。

于 2013-10-14T13:56:34.020 回答
0

我猜它不是在折叠时向上滑动动画而是立即消失。这是因为您将 Visibility 设置为 Collapsed，因此没有可显示的内容。

要解决这个问题：

a) 使用 MVVM：向 ViewModel 添加一些属性并在其上触发。通过 ICommand 修改属性。

b）不要设置可见性，只需在事件处理程序中启动正确的情节提要。

于 2013-10-14T13:58:41.650 回答