ItemsControl вставки элемент анимации

Question

я показываю список рода, используя itemsControl в моих окнах телефон 7 приложений, но я очень новой для animation и storyBoard т.д. поэтому мой itemsControl приводится ниже

<ItemsControl x:Name="ListContainer"> 

         <ItemsControl.ItemTemplate>       
          <DataTemplate x:Name="listTemplate">         
            <StackPanel Margin="25,0,0,0" MaxHeight="100"> 
             <TextBlock Text="{Binding DisplayName}" FontSize="21"></TextBlock>        
             <Button Name="btn" Tag="{Binding ID}" Content="request" FontSize="21" Width="183" Click="btn_Click" Padding="0"></Button> 
            </StackPanel>         
          </DataTemplate>        
         </ItemsControl.ItemTemplate> 

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

    </ItemsControl> 

теперь я хочу добавить animation так, чтобы каждый раз, когда элемент является добавлением к этому itemsControl него (item) должно быть переход от bottom к up зву, чем add

я гугл ALOT но не нашел никакого насыщенного ответа, поэтому, если кто-то, кто знает о раскадровке и анимации, положит ответ -: спасибо

Answer 1

Для реализации такой анимации вам необходимо: 1. Добавить TranslateTransform к пункту StackPanel и установить Y 900; 2. Добавить обработчик события Loaded событие StackPanel; Ваш XAML теперь будет выглядеть следующим образом:

<ItemsControl x:Name="ListContainer" VerticalAlignment="Top"> 
       <ItemsControl.ItemTemplate> 
        <DataTemplate x:Name="listTemplate"> 
         <StackPanel Margin="25,0,0,0" MaxHeight="100" Loaded="FrameworkElement_OnLoaded"> 
          <StackPanel.RenderTransform> 
           <TranslateTransform Y="900"/> 
          </StackPanel.RenderTransform> 
          <TextBlock Text="{Binding}" FontSize="21"></TextBlock> 
          <Button Name="btn" Content="request" FontSize="21" Width="183" Padding="0"></Button> 
         </StackPanel> 
        </DataTemplate> 
       </ItemsControl.ItemTemplate> 
       <ItemsControl.ItemsPanel> 
        <ItemsPanelTemplate> 
         <StackPanel Orientation="Vertical"/> 
        </ItemsPanelTemplate> 
       </ItemsControl.ItemsPanel> 
      </ItemsControl> 

3. В Loaded обработчик события необходимо создать Storyboard, который собирается переместить новый пункт:

private void FrameworkElement_OnLoaded(object sender, RoutedEventArgs e) 
    { 
     var storyboard = new Storyboard(); 
     var animation = new DoubleAnimation 
          { 
           From = 900, 
           To = 0 
          }; 

     var translatTransform = new TranslateTransform 
            { 
             Y = 900 
            }; 

     var panel = (StackPanel) sender; 
     panel.RenderTransform = translatTransform; 

     Storyboard.SetTarget(animation, translatTransform); 
     Storyboard.SetTargetProperty(animation, new PropertyPath("Y")); 
     storyboard.Children.Add(animation); 
     storyboard.Begin(); 
    }  

Answer 2

Теперь просто ознакомьтесь с этим учебником по анимации и смешайте свои собственные идеи. Выполнение в смеси очень полезно для анимации. Animating a card in windows phone

И для анимации контроля пункта, это работает: Item control animation