在切换IsChecked时触发父动画。

时间:2016-03-25 18:30:25

标签: wpf xaml

当我检查其中一个子切换按钮时,我试图为网格的宽度设置动画。但是,当我单击切换按钮时出现错误,说明样式中的故事板树无法指定TargetName。删除TargetName' MainGrid'。

这是我到目前为止的XAML:

 <Grid Margin="0" HorizontalAlignment="Left"
          TextOptions.TextFormattingMode="Display" x:Name="MainGrid">
        <Grid.Resources>
            <Style TargetType="Grid">
                <Style.Setters>
                    <Setter Property="Width" Value="300"/>
                </Style.Setters>
            </Style>

            <!--This is the animation-->
            <Storyboard x:Key="CollapseGrid">
                <DoubleAnimation Duration="0:0:0.200" Storyboard.TargetName="MainGrid" Storyboard.TargetProperty="Width" To="16" />
            </Storyboard>

            Visibility="{Binding ElementName=CollapseIcon, Path=IsChecked, Converter={StaticResource boolConverter}}"-->
        </Grid.Resources>
        <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" x:Name="FirstColumn" />
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="0" x:Name="LastColumn"/>
            </Grid.ColumnDefinitions>

            <DockPanel Margin="0,0,0,0" >

                <Grid DockPanel.Dock="Top" Width="Auto" >


                    <Grid VerticalAlignment="Top" Height="25" Background="#B4BBC1">
                        <TextBlock VerticalAlignment="Center" Foreground="Black" FontWeight="Bold" Padding="4" Margin="4,2,0,0" Text="HOME" HorizontalAlignment="Left" FontSize="10.667" />
                    </Grid>
                    <Grid VerticalAlignment="Bottom" Height="25" Background="#00355A">

                        <TextBlock VerticalAlignment="Center" Padding="4" Foreground="Gainsboro" Margin="209,1,30,1" Background="#00355A" Text="Change" HorizontalAlignment="Right" TextDecorations="Underline" Panel.ZIndex="1"/>
                        <TextBlock VerticalAlignment="Center" HorizontalAlignment="Left" Padding="4" Foreground="White" Margin="22,0,0,0" Text="{Binding DatabaseLabel}" Panel.ZIndex="2"/>
                    </Grid>
                    <Grid HorizontalAlignment="Right" Width="17" Background="{DynamicResource {x:Static SystemColors.ControlBrushKey}}" >
                        <ToggleButton Name="CollapseIcon" BorderThickness="0" Background="Transparent"  VerticalAlignment="Center" Width="auto" Padding="4,0,0,0" Margin="0,19" FontFamily="Segoe UI Symbol" Content="&#9664;" HorizontalAlignment="Center" FontSize="9.333">

                        <ToggleButton.Style>
                            <Style TargetType="ToggleButton">
                                    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}"/>

                                    <Style.Triggers>

                                    <!--Here's where I try to call the animation--> 
                                    <Trigger Property="IsChecked" Value="True">
                                        <Trigger.EnterActions>
                                            <BeginStoryboard Storyboard="{StaticResource CollapseGrid}"  />
                                        </Trigger.EnterActions>
                                    </Trigger>

                                    <Trigger Property="IsMouseOver" Value="True">
                                            <Setter Property="Foreground" Value="DimGray" />
                                        </Trigger>
                                    </Style.Triggers>

                                </Style>
                            </ToggleButton.Style>
                        </ToggleButton>
                    </Grid>
                </Grid>

有没有人知道我哪里出错了?

1 个答案:

答案 0 :(得分:0)

您无法在样式中引用UIElement,这就是您收到以下错误的原因&#39;样式中的Storyboard树无法指定TargetName。删除TargetName&#39; MainGrid&#39;。您可以考虑使用EventTrigger或DataTrigger。