在WPF中以定时间隔暂停动画

时间:2016-07-06 20:35:39

标签: c# wpf xaml animation

我有几个课程:

public class Project
{
    public string Code { get; set; }
    public List<Session> Sessions { get; set; }
    public ObservableCollection<Session> ScrollSessions { get; set; }
    public int ScrollLength { get; set; }
    public Duration ScrollDuration { get; set; }
}
public class Session
{
    //FullText contains multiple lines of text:
    public string FullText { get; set; }
}

我有一个ItemsControl,它将动态填充绑定到ObservableCollection项目的自定义按钮。每个按钮顶部都有一个TextBlock,显示Project.Code。按钮的其余部分填充了Canvas,其中包含另一个带有水平StackPanel ItemsPanelTemplate的ItemsControl。第二个ItemsControl将使用绑定到每个项目的Obssions的ObservableCollection的TextBlocks动态填充。

如果Sessions只有一个元素,那么就没有动画,但是如果它有多个动画,我希望TextBlocks作为Marquis从右到左滚动,在连续循环中暂停每个元素。在给出here的第二个答案之后,我已经达到了可以让它们连续滚动的程度。我首先将Sessions复制到ScrollSessions中,然后将第一个Session的第二个副本添加到它的末尾。我将DoubleAnimation To属性绑定到ScrollLength,将Duration属性绑定到ScrollDuration。

当我有这么多工作时,我记得最好的xaml:

<ScrollViewer Grid.Column="1" Margin="4,64,10,78">
<ItemsControl x:Name="projectItemsControl" ItemsSource="{Binding Projects}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapPanel/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Button Style="{DynamicResource ProjectButtonStyle}" BorderBrush="{x:Null}">
                <Button.Background>
                    <ImageBrush ImageSource="baseIconLargeDouble.png"/>
                </Button.Background>
                <DockPanel Style="{DynamicResource ProjectDockPanelStyle}">
                    <TextBlock Text="{Binding ProjectCode}" Foreground="White" FontFamily="Arial" FontSize="24" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Top" Margin="0,10,0,0" DockPanel.Dock="Top"/>
                    <Canvas>
                        <ItemsControl Margin="0,3,0,18" ItemsSource="{Binding ScrollSessionSettings}">
                            <ItemsControl.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <StackPanel Orientation="Horizontal"/>
                                </ItemsPanelTemplate>
                            </ItemsControl.ItemsPanel>
                            <ItemsControl.ItemTemplate>
                                <DataTemplate>
                                    <TextBlock Text="{Binding Path=FullText}" Style="{DynamicResource SessionTextBlockStyle}"/>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                            <ItemsControl.Triggers>
                                <EventTrigger RoutedEvent="Loaded">
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <DoubleAnimation Storyboard.TargetProperty="(Canvas.Left)" From="0" To="{Binding Scroll}" FillBehavior="Stop" RepeatBehavior="Forever"/>
                                        </Storyboard>
                                    </BeginStoryboard>
                                </EventTrigger>
                                <!--<EventTrigger RoutedEvent="{x:Static local:PlantLauncher.StartEvent}">
                                    <PauseStoryboard BeginStoryboardName="Animation"/>
                                </EventTrigger>
                                <EventTrigger RoutedEvent="{x:Static local:PlantLauncher.StopEvent}">
                                    <ResumeStoryboard BeginStoryboardName="Animation"/>
                                </EventTrigger>-->
                            </ItemsControl.Triggers>
                        </ItemsControl>
                    </Canvas>
                </DockPanel>
            </Button>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

我说的最好,因为我开始在代码背后创建所有这些东西并且它仍然没有工作。我是WPF的新手,特别是在将xaml与背后的代码链接时遇到了麻烦。

所以我的问题是如何让这个动画按照定时间隔暂停?我可以在xaml中完全完成,还是需要Timer后面的代码?我甚至尝试了一个自定义的RoutedEvent,但事件没有被标记为已处理(你可以看到它在上面的xaml中被注释掉了)......必须有一个简单的方法来做到这一点。

0 个答案:

没有答案