2012-03-19 78 views
2

当按钮“显示详细信息”/“隐藏详细信息”被点击后,当再次点击该按钮时回到其初始值,我试图在高度上切换动画。在触发器上触发大小动画

我有一个DataControls:用的DataForm预定义的风格,开始时,我想在单击按钮时“高度” - 属性动画到一个较大的值。

DataControl:Dataform看起来像这样。

<DataControls:DataForm x:Name="DataEdit" 
          Grid.Row="1" 
          ItemsSource="{Binding}" 
          Style="{DynamicResource CommonDataFormStyle}" 
          ContentLoaded="OnContentLoaded" 
          Height="150"> 

按钮本身就是这样的DataForm内部。

<DataControls:DataForm.ReadOnlyTemplate> 
    <DataTemplate>   
     <Grid> 
      <Grid.RowDefinitions>... 
       <StackPanel Grid.Column="0" Grid.Row="0">    
        <Button Command="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl} }, Path=DataContext.ToggleDetailsCommand, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}" x:Name="ToggleDetailsButton"          
          Content="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl} }, Path=DataContext.ToggleDetailsButtonText}"/> 
... 

我只得到了这个由usina一个名为“显示详细信息”标签和一个EventTrigger为RoutedEvent =“Label.MouseLeftButtonDown”工作的一个标签上展开细节。 然后有另一个名为“隐藏详细信息”的标签再次将动画归档。

我有阿尔斯托试图把这种风格的按钮和数据触发器试图切换动画。但是,不管StoryBoard.Target =“{Binding ElementName = DataEdit}”属性如何,该按钮的高度都是动画效果。

<Style TargetType="{x:Type Button}" x:Key="ExpandDetailsStyle" >    
     <Style.Triggers> 
      <DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl} }, Path=DataContext.IsOpened}" Value="true"> 
       <DataTrigger.EnterActions> 
        <StopStoryboard BeginStoryboardName="EndAnimation" /> 
        <BeginStoryboard Name="NewAnimation"> 
         <Storyboard> 
          <DoubleAnimation Storyboard.Target="{Binding ElementName=DataEdit}" Storyboard.TargetProperty="Height" From="150" To="300" Duration="0:0:0.1" /> 
         </Storyboard> 
        </BeginStoryboard> 
       </DataTrigger.EnterActions> 
       <DataTrigger.ExitActions> 

       </DataTrigger.ExitActions> 

      </DataTrigger> 
      <DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl} }, Path=DataContext.IsOpened}" Value="false"> 
       <DataTrigger.EnterActions> 
        <StopStoryboard BeginStoryboardName="NewAnimation" /> 
        <BeginStoryboard Name="EndAnimation"> 
         <Storyboard> 
          <DoubleAnimation Storyboard.Target="{Binding ElementName=DataEdit}" Storyboard.TargetProperty="Height" From="300" To="150" Duration="0:0:0.1" /> 
         </Storyboard> 
        </BeginStoryboard> 
       </DataTrigger.EnterActions> 
      </DataTrigger> 

     </Style.Triggers> 
    </Style> 

另外我对WPF来说还是比较新的,所以如果我在这里留下了一些东西,请原谅我。 林不能因为它已经使用了共同的风格,换上新的自定义样式的数据形,它wouldnt让我用“支持算法FMP”属性要么。

我得到的最接近是按钮高度的动画,如果我只能得到它,而不是动画数据形height属性。

在此先感谢

回答

4

相当长的一段时间后,环顾四周,我发现我的,我的想法,复杂的问题一个简单的解决方案。

<UserControl.Resources> 
    <Storyboard x:Key="ExpandDetails"> 
     <DoubleAnimation Storyboard.TargetProperty="Height"              
                Storyboard.TargetName="DataEdit" 
                From="120" To="230" Duration="0:0:0.05" /> 
    </Storyboard> 
    <Storyboard x:Key="CollapsDetails"> 
     <DoubleAnimation Storyboard.TargetProperty="Height"              
               Storyboard.TargetName="DataEdit" 
               From="230" To="120" Duration="0:0:0.05" /> 
    </Storyboard>     
    <Style TargetType="{x:Type ToggleButton}" x:Key="ToggleButtonStyle"> 
     <Setter Property="Content" Value="Show Details"/> 
     <Style.Triggers> 
      <Trigger Property="IsChecked" Value="true"> 
       <Setter Property="Content" Value="Hide Details"/> 
      </Trigger> 
     </Style.Triggers> 
    </Style>  
</UserControl.Resources> 


<UserControl.Triggers> 
    <EventTrigger RoutedEvent="ToggleButton.Checked" SourceName="DetailsToggleButton"> 
     <BeginStoryboard Storyboard="{StaticResource ExpandDetails}"/> 
    </EventTrigger> 
    <EventTrigger RoutedEvent="ToggleButton.Unchecked" SourceName="DetailsToggleButton"> 
     <BeginStoryboard Storyboard="{StaticResource CollapsDetails}"/> 
    </EventTrigger> 
</UserControl.Triggers> 

我不能弄清楚如何有因为示波器这将是它无法找到任何与我已知的结合技术“DataEdit”数据形的在这种情况下,数据表单中的按钮。

因此,这必须放在数据形之外。

<ToggleButton x:Name="DetailsToggleButton" Style="{StaticResource ToggleButtonStyle}" /> 

源到我的解决方案:
WPF: how to fire an EventTrigger (or Animation) when binding changes?
WPF - Changing the content of a ToggleButton when checked