WPF炫酷UI及动画
偶然看见了一张图,感觉挺好看的,花了点时间将他转化成了我代码仓库的一部分。虽然不难但也费时间。其中除了背景是百度的一张底图,其他所有内容均通过WPF的Path、Line、TextBlock、Border以及DoubleAnimation来实现。
效果如下:
纯黑色背景也还蛮好看的。
我的博客中大多都会阐述实现思路或原理。本Demo实现逻辑如下:
1、闪烁的边框主要通过Path来绘制,颜色binding了自定义的依赖属性,然后通过对颜色写相关的ColorAnimationUsingKeyFrames实现。Path不熟练可借助Blend中的画笔绘制。 我用的比较多,大多Path中的Data的相关Point点几乎都是手动输入。
2、中间“I Copy the MIUI”下面的若隐若现的虚线,其实就是一个简单的Line, 我给它附加了MaskOpacity属性,然后对他的OpacityMask值进行了TranslateTransform.X位移动画。
3、虚线移动动画也不复杂,设置StrokeDashOffset属性,并对该属性写DoubleAnimation即可。
4、闪烁的内容为针对Xaml中的元素写的Opacity动画。
5、下方类似进度条的东西也是用Line实现,我定义了依赖属性binding到Line的X2上,每次修改的时候不直接赋值,而是用DoblueAnimation去处理,实现平滑滑动效果。
工具:Visual Studio 2017
工程:WPF C#
源码下载链接:
WPF炫酷UI及动画的更多相关文章
- 8个超炫酷仿HTML5动画源码
1.jQuery万年历插件 带农历老皇历功能 这是一款基于jQuery的日历插件,这款日历插件和之前分享的日历控件有很大差异,它是一本万年历,包含了农历已经老皇历的功能,是一个挑好日子的工具.同时日历 ...
- 来瞧瞧,WPF 炫酷走马灯!
来瞧瞧,WPF 炫酷走马灯! 控件名:SpotLight 作者:WPFDevelopersOrg 原文链接: https://github.com/WPFDevelopersOrg/WPFDevelo ...
- FIR.im Weekly - 让炫酷 UI 为 APP 增色
上周我看到一些不错的设计分享,挑选了几个比较全的 GitHub 资源推荐给大家.此外,还精选了一些实用的 iOS,Android 干货文章. iOS 炫酷动画资源 @荧星诉语 收集整理了主流炫酷动画框 ...
- 手把手带你做一个超炫酷loading成功动画view Android自定义view
写在前面: 本篇可能是手把手自定义view系列最后一篇了,实际上我也是一周前才开始真正接触自定义view,通过这一周的练习,基本上已经熟练自定义view,能够应对一般的view需要,那么就以本篇来结尾 ...
- C# Winform实现炫酷的透明动画界面
做过.NET Winform窗体美化的人应该都很熟悉UpdateLayeredWindow吧,UpdateLayeredWindow可以实现窗体的任意透明,效果很好,不会有毛边.不过使用这个API之后 ...
- HTML5 Canvas 超炫酷烟花绽放动画教程
这是一个很酷的HTML5 Canvas动画,它将模拟的是我们现实生活中烟花绽放的动画特效,效果非常逼真,但是毕竟是电脑模拟,带女朋友看就算了,效果还是差了点,呵呵.这个HTML5 Canvas动画有一 ...
- 如何在你的blog中添加炫酷的飘雪动画效果
将下面的代码复制到你的设置栏下页眉html代码框中即可 <script> (function($){$.fn.snow=function(options){,maxSize:,newOn: ...
- 8个经典炫酷的HTML5 Canvas动画欣赏
HTML5非常强大,尤其是Canvas技术的应用,让HTML5几乎可以完成所有Flash能完成的效果.本文精选了8个经典炫酷的HTML5 Canvas动画欣赏,每一个都提供全部的源代码,希望对你有所帮 ...
- 使用Three.js实现炫酷的赛博朋克风格3D数字地球大屏 🌐
声明:本文涉及图文和模型素材仅用于个人学习.研究和欣赏,请勿二次修改.非法传播.转载.出版.商用.及进行其他获利行为. 背景 近期工作有涉及到数字大屏的需求,于是利用业余时间,结合 Three.js ...
随机推荐
- 安装部署MySQL主从复制
Environment:{ CentOS 7 两台 安装MySQL(mariadb mariadb-server) } !!!关闭防火墙SELinux 1.查看版本信息 2.启动mysql服务,查 ...
- Python中 * 与 **, *args 与 **kwargs的用法
* 用于传递位置参数(positional argument) ** 用于传递关键字参数(keyword argument) 首先,先通过一个简单的例子来介绍 * 的用法: def add_funct ...
- h5-面试题
干货!各种常见布局实现+知名网站实例分析 前端面试考点多?看这些文章就够了(2019年6月更新版) 前端面试:这50个经典前端面试题面试者必看! Vue面试中,经常会被问到的面试题/Vue知识点整理 ...
- 洛谷 P2764(最小路径覆盖=节点数-最大匹配)
给定有向图G=(V,E).设P 是G 的一个简单路(顶点不相交)的集合.如果V 中每个顶点恰好在P 的一条路上,则称P是G 的一个路径覆盖.P 中路径可以从V 的任何一个顶点开始,长度也是任意的,特别 ...
- 【React】345- React v16.9 新特性[译]
今天我们发布了 React 16.9.它包含了一些新特性.bug修复以及新的弃用警告,以便与筹备接下来的主要版本. 一.新弃用 重命名 Unsafe 生命周期方法 一年前,我们宣布 unsafe 生命 ...
- 【Git】远程分支
[Git]远程分支 转载:https://www.cnblogs.com/yangchongxing/p/10239270.html 目录 ============================ 1 ...
- 成为java高手的成长历程想学好java必看
1:J2SE入门阶段(3-6个月) 学习内容:J2SE常用类,JDBC等等 动态绑定,反射机制等 2:J2EE入门阶段(3个月) 学习内容:JSP/Servlet/JavaBean MVC结构的概念 ...
- Java虚拟机堆和栈详细解析,以后面试再也不怕问jvm了!
堆 Java堆是和Java应用程序关系最密切的内存空间,几乎所有的对象都放在其中,并且Java堆完全是自动化管理,通过垃圾收集机制,垃圾对象会自动清理,不需自己去释放. 根据垃圾回收机制的不同,Jav ...
- Websphere 重置admin 控制台密码
By way of wsadmin command: <WAS_INSTALL_DIR>/bin/> wsadmin -conntype NONE wsadmin> secur ...
- Java 复制Excel工作表
本文归纳了关于Java如何复制Excel工作表的方法,按不同复制需求,可分为: 1. 复制工作表 1.1 在同一个工作簿内复制工作表 1.2 在不同工作簿间复制工作表 2. 复制指定单元格数据 对于复 ...