locked
Animation in DataTemplate of a ListView - problem with scrolling when virtualization is used RRS feed

  • Question

  • Hello,

    I encounter problems with an animation in a datatemplate in a listviewitem when virtualization is used. The Animation works fine as Long as I do not scroll up or down. If I start to scroll up or doewn, the Animation is jumping to another ListviewItem ... This Problem occurs when e.g. VirtualizingStackPanel is used, if no virtualization is used, everything works fine. Following some code snippets ... How can I fix my Problem when virtualization is used?

     XAML:

    ...
    <ListView.ItemsPanel>
     <ItemsPanelTemplate>
       <VirtualizingStackPanel />
      </ItemsPanelTemplate>
       </ListView.ItemsPanel>
      <ListView.ItemTemplate>
      <DataTemplate>
        <Grid x:Name="GridConvItem" >
      <Grid.ColumnDefinitions>
       <ColumnDefinition Width="10" />
       <ColumnDefinition Width="1*" />
       ...
       
       
      <Grid x:Name="AnimationGridConv" Grid.Column="2" Grid.RowSpan="2">
       <Grid.Resources>
        <Storyboard x:Name="Storyboard1">
         <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="cani" RepeatBehavior="1x">
          <DiscreteObjectKeyFrame KeyTime="0">
           <DiscreteObjectKeyFrame.Value>
            <Visibility>Visible</Visibility>
           </DiscreteObjectKeyFrame.Value>
          </DiscreteObjectKeyFrame>
          <DiscreteObjectKeyFrame KeyTime="0:0:35">
           <DiscreteObjectKeyFrame.Value>
            <Visibility>Collapsed</Visibility>
           </DiscreteObjectKeyFrame.Value>
          </DiscreteObjectKeyFrame>
         </ObjectAnimationUsingKeyFrames>
         ....
         
        </Storyboard>
       </Grid.Resources>

                <Image Source="{Binding Image}"  Height="50" Width="50" />
                <Canvas x:Name="cani" Width="50" Height="12" VerticalAlignment="Bottom" Margin="0,0,0,6" Background="Black" Opacity="0.6" Visibility="Collapsed" > 
      <Grid>
      ....
         
    Code:

      // ListView conv
      ItemContainerGenerator generator = conv.ItemContainerGenerator;
      ListViewItem selectedItem = (ListViewItem)generator.ContainerFromIndex(i);

      if (selectedItem != null)
      {
       Grid tbFind = Helpers.GetDescendantByType(selectedItem, typeof(Grid), "AnimationGridConv") as Grid;
       Storyboard typingAnimation = (Storyboard)tbFind.Resources["Storyboard1"];
       typingAnimation.Begin();
      ....

    Thursday, October 10, 2013 2:27 PM

All replies

  • Can you please post your app to Skydrive and post a link to it? 

    Matt Small - Microsoft Escalation Engineer - Forum Moderator
    If my reply answers your question, please mark this post as answered.

    NOTE: If I ask for code, please provide something that I can drop directly into a project and run (including XAML), or an actual application project. I'm trying to help a lot of people, so I don't have time to figure out weird snippets with undefined objects and unknown namespaces.

    Friday, October 11, 2013 1:22 PM
    Moderator