正文
[WPF]有滑动效果的进度条
小程序：扫一扫查出行【扫一扫了解最新限行尾号】
复制小程序
先给各位看看效果，可能不太完美，不过效果还是可行的。
我觉得，可能直接放个GIF图片上去会更好。
我这个不是用图片，而是用DrawingBrush画出来的。接着重做ProgressBar控件的模板，把一个矩形放进名为PART_Indicator的可视化元素中，该命名元素用来指示进度条的当前进度。
1、放一个ScrollViewer，把水平和垂直的滚动条都隐藏。
2、ScrollViewer里面放Rectangle，把矩形的宽度设置为其容器宽度的N倍，这样在动画中对矩形平移时，就不会出现空白区域。试了许久，我还是把矩形放在ScrollViewer中，如果不这样做，在用动画对矩形实行平移后，矩形在界面以外的部分会被截去，导致产生空白区域。使用ScrollViewer正是防止这种情况出现。
3、应用动画。
<ScrollViewer VerticalScrollBarVisibility="Hidden" HorizontalScrollBarVisibility="Hidden" x:Name="Indicator" ClipToBounds="False">
<Rectangle x:Name="rect" Width="{Binding ElementName=Indicator,Path=ActualWidth,Converter={StaticResource acthCvt},ConverterParameter=5}" Fill="{TemplateBinding Foreground}" HorizontalAlignment="Stretch">
<Rectangle.RenderTransform>
<TranslateTransform X="0"/>
</Rectangle.RenderTransform>
</Rectangle>
<ScrollViewer.Triggers>
<EventTrigger RoutedEvent="Rectangle.Loaded" >
<BeginStoryboard>
<Storyboard RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="rect"
Storyboard.TargetProperty="(UIElement.RenderTransform).(TranslateTransform.X)" From="0" To="{Binding ElementName=Indicator,Path=ActualWidth,Converter={StaticResource ttCvt}}" Duration="0:0:2"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</ScrollViewer.Triggers>
</ScrollViewer>
EventTrigger可以通过路由事件来触发动画，Loaded事件是在对应元素装入内存后引发，这时候可以启动动画。
好了，原理其实就是自行绘制画刷 + 动画平移来实现的。代码我会上传，大家参考一下即可。
下载地址：http://files.cnblogs.com/tcjiaan/%E6%BB%91%E5%8A%A8%E8%BF%9B%E5%BA%A6%E6%9D%A1.zip
