0

i am showing a kind list using itemsControl in my windows phone 7 app, but i am very new to animation and storyBoard etc so my itemsControl is given below

    <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>

now i want to add an animation so that whenever an item being adding to this itemsControl it (item) should be moving from bottom to up an d than add

i googled alot but not found any satiable answer, so if anyone having knowledge about storyboard and animation plZ put an answer -: thanks

4

2 回答 2

1

要实现这样的动画，您需要： 1. 添加TranslateTransform到一个项目StackPanel并设置Y为 900；Loaded2. 为事件添加事件处理程序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();
    }
于 2013-06-07T08:44:35.673 回答
0

现在只需查看这个混合动画教程并应用您自己的想法。在混合中做动画是非常好的。 在 windows phone 中为卡片制作动画

而对于项目控制的动画，这个工作：项目控制动画

于 2013-06-07T07:32:09.893 回答