[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
[WPF]有滑动效果的进度条的更多相关文章
- WPF利用动画实现圆形进度条
原文:WPF利用动画实现圆形进度条 这是我的第一篇随笔,最近因为工作需要,开始学习WPF相关技术,自己想实现以下圆形进度条的效果,逛了园子发现基本都是很久以前的文章,实现方式一般都是GDI实现的,想到 ...
- C# WPF 解压缩7zip文件 带进度条 sevenzipsharp
vs2013附件 :http://download.csdn.net/detail/u012663700/7427461 C# WPF 解压缩7zip文件 带进度条 sevenzipsharp W ...
- CSS3 中的按钮效果与进度条
效果如图
- ReactJS尝鲜:实现tab页切换和菜单栏切换和手风琴切换效果,进度条效果
前沿 对于React, 去年就有耳闻, 挺不想学的, 前端那么多东西, 学了一个框架又有新框架要学
- Android 三种方式实现自定义圆形页面加载中效果的进度条
转载:http://www.eoeandroid.com/forum.php?mod=viewthread&tid=76872 一.通过动画实现 定义res/anim/loading.xml如 ...
- 有3D效果的进度条
// The Unofficial Newsletter of Delphi Users - Issue #12 - February 23rd, 1996 unit Percnt3d; (* TPe ...
- WPF 下载网络文件 带进度条
附件:http://files.cnblogs.com/xe2011/WpfApplication3_downloadFile.rar 使用 private void Button ...
- WPF 简单的绕圈进度条(无cs代码)
方案: 图标位置不变化的情况下设置透明度实现 代码: <Window x:Class="WpfApp1.MainWindow" xmlns="http://sche ...
- 使用原生JS+CSS或HTML5实现简单的进度条和滑动条效果(精问)
使用原生JS+CSS或HTML5实现简单的进度条和滑动条效果(精问) 一.总结 一句话总结:进度条动画效果用animation,自动效果用setIntelval 二.使用原生JS+CSS或HTML5实 ...
随机推荐
- iOS开发零基础--Swift教程 字符串的利用
字符串的介绍 字符串在任何的开发中使用都是非常频繁的 OC和Swift中字符串的区别 在OC中字符串类型时NSString,在Swift中字符串类型是String OC中字符串@"" ...
- 【原创】JAVA并发编程——Callable和Future源码初探
JAVA多线程实现方式主要有三种:继承Thread类.实现Runnable接口.使用ExecutorService.Callable.Future实现有返回结果的多线程.其中前两种方式线程执行完后都没 ...
- AndroidManifest.xml中<activity></activity>相关属性说明
虽说,从事android开发有一定时间了,对于Activity大家也都不陌生,但是具体的对于Activity中相关属性的含义有必要做一个系统的总结: intent-filteraction: 来指定响 ...
- ASP.Net MVC跳转,分为form的submit提交跳转和ajax跳转
1,用jquery ajax跳转的话,需要在前台用window.location("跳转网址")来跳转,在success后使用 2,用原声的form的submit来跳转,如下图 3 ...
- angularjs ocLazyLoad分步加载js文件,angularjs ocLazyLoad按需加载js
用angular有一段时间了,平日里只顾着写代码,没有注意到性能优化的问题,而今有时间,于是捋了捋,讲学习过程记录于此: 问题描述:由于采用angular做了网页的单页面应用,需要一次性在主布局中将所 ...
- js 将long型字符串转换成日期格式
工作中难免会碰到日期的转换,往往为了方便,后台都是把时间以long型(形如1343818800000)返回给web前端.再有前端自己根据页面需求转换成相应的日期格式.这里将我常用的一个转换时间的函数贴 ...
- swift语言特性
最近苹果推出了他们新的开发语言,swift,他们自己的说法是,swift语言将会更快捷,更安全等等.但是具体的性能,还需要在后面的实践过程中去观察,但是就目前来说swift语言除了将大部分21世纪静态 ...
- BI先特技软件 Analyzer安装时的部分问题
废话不多,先看第一个问题,我先运行了 Analyzer.3.0.2357b.64.exe 然后就是傻瓜式地下一步 好的,现在问题来了,当我运行安装完毕的Analyzer时,页面给了我这样的提示“ HT ...
- storysnail的Linux串口编程笔记
storysnail的Linux串口编程笔记 作者 He YiJun – storysnail<at>gmail.com 团队 ls 版权 转载请保留本声明! 本文档包含的原创代码根据Ge ...
- Linux之RPM安装软件
源码包 (可以看到源代码) 脚本安装包(写好的xsheel一键安装.本质还是源码包和二进制包) 二进制包(RPM包.系统默认包) 包管理系统简单,通过命令就可以安装.卸载 ...