WPF制作歌词动画

最近再做一个UWP的音乐播放器,今天实现了歌词动画,不是滚动的,滚动的慢慢研究

思路:在右边放了三个textBlock,设置 textBlock的effect属性

<TextBlock.Effect>
                            <BlurEffect Radius="0"></BlurEffect>
                </TextBlock.Effect>

就是模糊效果。

中间的textBlock没有使用动画

动画播放时间就是歌词上一句跟下语句的时间差

下面放后台动画代码

 Storyboard DownLrcStory = new Storyboard();

                        DoubleAnimation up = new DoubleAnimation(0, 30, new Duration(TimeSpan.FromSeconds(time)));
                        DoubleAnimation next = new DoubleAnimation(30, 0, new Duration(TimeSpan.FromSeconds(nextTime)));
                        up.RepeatBehavior = RepeatBehavior.Forever;
                        DownLrcStory.Children.Add(up);
                        DownLrcStory.Children.Add(next);
                        Storyboard.SetTarget(up, lrcDown);
                        Storyboard.SetTarget(next, lrcNext);
                        Storyboard.SetTargetProperty(up, new PropertyPath("Effect.Radius"));
                        Storyboard.SetTargetProperty(next, new PropertyPath("Effect.Radius"));
                        DownLrcStory.Begin();

时间: 2024-08-24 07:32:41

WPF制作歌词动画的相关文章

WPF绘画和动画(原文:http://blog.csdn.net/fwj380891124/article/details/8177125 )

1.1   WPF绘图 与传统的.net开发使用GDI+进行绘图不同,WPF拥有自己的一套绘图API.使用这套API不但可以轻松绘制出精美的图形,还可以为各种图形添加类似与PhotoShop的"滤镜效果"及"变形效果".本节我们就一起研究WPF图形API绘图,效果和变形等功能. 先观察下面一组图片: 显然,这组图片是矢量图(Vector Image),无论怎样放大缩小都不会出现锯齿.你可能会想:"这是组PNG格式的图片吗?"答案是"NO

用svg制作loading动画

首先说明:由于各浏览器对svg动画事件支持不统一,此loading动画在Firefox,Opera,Chrome中均没有问题,IE和Safari中有问题,可能是不支持SIML写动画的语法, 但是用Canvas写的话,在颜色的渐变方面会有问题: 线性渐变需要传递四个参数 xstart:渐变开始点x坐标       ystart:渐变开始点y坐标       xEnd:渐变结束点x坐标       yEnd:渐变结束点y坐标 这样画出来的渐变只能用于矩形之类的图形,无法应用在诸如扇形内,此loadi

QQ概念版(WPF制作)

984 QQ概念版 编辑 QQ 概念版是腾讯首款NUI(自然用户交互)产品,全面实现了多点触摸操作.是腾讯利用微软最新一代的客户端展现层技术--WPF,打造的IM产品. 中文名 QQ 概念版 游戏类别 聊天软件NUI 游戏平台 QQ 开发商 腾讯 发行商 腾讯 目录 1简介 2系统要求 3用户评测 4产品介绍 5评测数据 6更新日志 ? Beta 1.3 ? Beta 1.2 ? Beta 1.1 1简介编辑 在实现IM的基础功能外,QQ概念版还推出了动感相框.动态背景.多Tab聊天窗口.3D交

PPT制作线条动画

0.小叙闲言 今天在用PPT做动画的时候小有心得,百度了一下线条动画制作,有一个贴子里面的讨论,也给了我一些灵感,贴子地址:http://www.rapidbbs.cn/thread-24577-1-1.html.但是还是没有做下图这样的效果的动画,这是自己纯想出来的,分享一下,或许对大家有点帮助.文章中的PPT下载地址:http://files.cnblogs.com/files/endlesscoding/PPT_Line_Animations.zip 1.PPT简单线条动画 平时做线条动画

go制作gif动画

今天看了golang中国社区翻译的"go语言圣经",在第一章1.4节讲到用go制作gif动画,感觉非常有意思,分享给大家 package main import (     "image"     "image/color"     "image/gif"     "io"     "math"     "math/rand"     "os" )

WPF 有趣的动画效果

WPF 有趣的动画效果 这一次我要呈上一个简单的文章,关于给你的WPF apps加入美丽的光线动画,可是我对动画这东西可能有点入迷了. 实际上.我对动画如此的入迷,以至于我最后做了之前从未打算做的东西,就是使用一些很实用的.NET代码,渐变填充生成背景动画.让我先给你看一些终于效果吧. WPF和元素定位 然而.在我们開始之前.我们须要考虑一件事情.这件事让我也有点原地转圈的感觉. 似乎当你使用WPF创建不论什么闭环形状时,你不能设置它的X和Y坐标.好吧.至少你不能在一般的WPF窗口(像VS开箱即

3D Grid Effect – 使用 CSS3 制作网格动画效果

今天我们想与大家分享一个小的动画概念.这个梦幻般的效果是在马库斯·埃克特的原型应用程序里发现的??.实现的基本思路是对网格项目进行 3D 旋转,扩展成全屏,并呈现内容.我们试图模仿应用程序的行为,因此创建了两个演示,分别演示垂直和水平旋转网格项. 温馨提示:为保证最佳的效果,请在 IE10+.Chrome.Firefox 和 Safari 等现代浏览器中浏览. 您可能感兴趣的相关文章 创意无限!一组网页边栏过渡动画[附源码下载] 真是好东西!13种非常动感的页面加载动画效果 你见过吗?9款超炫的

Adobe edge animate制作HTML5动画可视化工具(一)

Edge Animate for mac是Adobe最新出品的制作HTML5动画的可视化工具,简单的可以理解为HTML5版本的Flash Pro.在之后的文章中,我会逐一的介绍这款新的HTML5动画神器.这篇文章先说一说如何把Edge Animate制作的HTML5动画作品嵌入到Wordpress中. Adobe Edge Animate的目的是帮助专业设计师制作网页动画乃至简单游戏.目前该工具的重点放在动画引擎上,将增加更多HTML5功能,比如Canvas.HTML5音频/视频标签等.支持An

分享一个纯css制作的动画化,在网页(手机)加载等的时候可以引用!

CSS代码如下: /* Custom Stylesheet */ body, html { margin: 0; -webkit-font-smoothing: antialiased; background: #68ABAD; text-align: center; } /* DEMO 1 */ .loader1 { margin: 0 auto; height: 20px; width: 20px; position:relative; -webkit-animation:spin 1.5s