首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

歌词显示控件的实现(上)——歌词解析

最近打算仿网易云音乐的音乐播放器,除了网络框架、接口数据、界面效果等这些因素外,最核心的就是音乐的播放和歌词显示。...考虑到歌词显示控件涉及到歌词解析,自定义控件的实现等等诸多方面,可能文章的篇幅上会比较冗长,同时也为了方便自己和码友们能够根据自己的需求和爱好各取所需,将《歌词显示控件的实现上》这篇文章分成上、下两篇,...分别是《歌词显示控件的实现上——歌词解析》和《歌词显示控件的实现下——歌词展示自定义View》。...ok,开始切入正题 01 — 了解歌词文件结构 写过音乐播放器的朋友可能都了解过歌词文件的规范格式,既然是歌词显示的控件,就必然需要清楚地了解歌词文件的组成规范,才能准确无误的解析歌词文件,得到我们想要的信息...下面就是实现歌词文件的解析工作: 1、实体类 首先,需要准备两个类主要用于歌词解析结果的缓存: LineInfo:歌词行信息:包含行开始时间和歌词行内容 LyricInfo:歌词信息:包含标题、歌手、专辑等等

2K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    Android实现音乐播放器歌词显示效果

    这两天有个任务,说是要写一个QQ音乐播放器歌词的那种效果,毕竟刚学自定义View,没有什么思路,然后就Google.写了一个歌词效果,效果图在后面,下面是我整理的代码。...这里动态的向第二个布局里面添加了显示歌词的TextView,并利用ViewTreeObserver得到每个textview的高度,方便知道每个textview歌词所要滑动到的高度。...所要显示的高度 int height;//控件高度 int width;//控件宽度 int prevSelected = 0;//前一个选择的歌词所在的item public LycicView(Context...=null){ rootView.addView(lycicList);//加入一个歌词显示布局 rootView.addView(blank2,params); } } /** *设置歌词, */ void...{ final TextView textView = new TextView(getContext()); textView.setText(lyricTextList.get(i)); //居中显示

    2.7K10

    歌词显示控件的实现(下)——自定义View

    接下来我想和大家分享的就是如何通过自定义View实现炫酷的LyricView歌词显示控件。...01 — 分析 我们最重要的目的是将文字绘制在View中,并设置各种效果和动画,而在绘制之前我们需要计算出文字的位置,而歌词又是以 行 为单位来显示,所以,计算行高和行间距,当然,还需要一些文字颜色等属性...需要明确一点,当偏移量scrollY的值为零的时候,歌词的首行将显示在整个LyricView的正中间 。...在上篇中,我们也知道每一句歌词中都包含着开始时间,而我们也就可以通过当前歌曲播放进度匹配当前播放的行数 mCurrentPlayLine,并通过当前播放所在行,计算偏移量scrollY的值,控制歌词播放滚动和当前播放位置的高亮显示...到了这一步,歌词显示、滑动查看都已经完成。 09 — 绘制指示器 ? 到这里,歌词显示器就算完成了,有不对的地方还望大家指出。

    1.1K10

    macbook 软件-LyricsX for Mac 下载-桌面歌词显示

    LyricsX for Mac被誉为是一款功能强大、易于使用的歌词软件。它的主要功能是为用户提供高质量的歌词显示,可以让用户更加方便地欣赏音乐。...id=MzI1OTY2图片主要功能1.自动匹配歌词:LyricsX for Mac可以自动匹配iTunes库中的所有歌曲的歌词,并可以在播放音乐时自动显示歌词,让用户更加方便地欣赏音乐。...3.快捷键控制:LyricsX for Mac提供了多种快捷键和自定义功能,可以让用户方便地快速控制歌曲播放以及歌词显示等功能。4.歌词编辑功能:LyricsX for Mac允许用户对歌词进行编辑。...使用过程中不仅不会出现歌词显示错误等问题,也不会对用户的Mac电脑造成任何损害。适用场景1.音乐欣赏:LyricsX for Mac是一款专门为用户提供歌词显示的软件,可以让用户更轻松地欣赏音乐。...2.教学和学习:对于音乐老师或学生来说,可以使用LyricsX for Mac来显示歌词,以帮助学生更加方便地学习发音。

    2.5K30

    java写一个音乐播放程序,同时显示歌词

    java写一个音乐播放程序,同时显示歌词 总的来说分为两部分:1.音乐播放 2.显示歌词(这里介绍一个好理解的算法,就不进行优化了) 一、音乐播放(这里我们在网上先下载一个wav文件来播放) 这里我们使用...(FileNotFoundException e) { // TODO Auto-generated catch block e.printStackTrace(); } } 二、显示歌词...(这里我们先解析已有的lrc歌词文件,存放到data里面再进行操作) public class Demo1 { // 定义两个存放分钟和秒的数组 private static double[] d1...countLine3++; if (countLine3 <= 4) continue; // 延迟判断 for (int i = 0; i < 55; i++) { // 歌词...countLine3++; if (countLine3 <= 4) continue; // 延迟判断 for (int i = 0; i < 55; i++) { // 歌词

    1.9K10

    Mac小而美的软件LyricsX for Mac(桌面歌词显示器)下载

    LyricsX for Mac是一款可以帮助用户实时获取音乐歌词的软件。...它可以在你播放任何音乐时显示相应的歌词,让你可以随时随地欣赏歌曲的歌词,同时还可自定义歌词显示的字体、颜色、大小等,从而让你享受更好的视听体验。图片LyricsX for Mac的使用非常简单。...打开软件后,只需在支持的音乐播放器(如iTunes、Spotify、网易云等)中播放音乐即可显示相应的歌词。...软件还支持手动搜索歌曲歌词,只需输入歌名或专辑名即可搜索到相应的歌词,并在播放音乐的同时显示。此外,LyricsX for Mac还支持在线同步歌词,保证你获得最新和最准确的歌词。...软件还支持多语言歌词,因此无论你是从哪个国家或地区,你都可以轻松地找到你喜欢的音乐,享受到完美的音乐视听体验。

    1K30

    iOS音频播放器锁屏歌词显示与性能优化 原

    iOS音频播放器锁屏歌词显示与性能优化 一、引言     前边有博客探讨了有关iOS开发中音频播放的技术与进行后台音频播放并在后台与用户进行交互的方法,本篇将探讨一种在锁屏界面同步显示歌词歌词的方法,...二、在锁屏界面同步显示歌词    我们知道,在音频后台播放时,锁屏界面的信息是由MPNowPlayingInfoCenter来设置的,其中的歌曲信息字典可以设置类似歌曲封面,艺术家,歌曲名,歌曲时间等。...然而,对于MPNowPlayingInfoCenter中可以由开发者掌握的接口十分有限,若要在锁屏界面同步的显示歌曲歌词,一个比较简单的方法是不停的将当前歌词与封面进行图片合成,之后刷新锁屏界面的图片。... * lineLRC = [(LRCItem *)array[index] lrc];     //提高性能 进行判断 当前显示歌词有无变化 如果没变化 不进行后续操作     if ([_lrcLabel.text...: 同步显示锁屏歌词的音乐播放器:https://github.com/ZYHshao/MyPlayer。

    1.1K20

    【教程】纯前端做一个歌词显示的音乐播放器

    节目:08-1202L/08-1203K:【教程】纯前端做一个歌词显示的音乐播放器 [效果] 用到的文件: Bootstrap 4.6.0 CSS:https://cdn.bootcdn.net/ajax...audio" src="mp3/Flower - 秋風のアンサー.mp3" controls style="width:100%"> 注意,audio要指定一个id,方便后续获取 歌曲显示...class="jumbotron"> 秋風のアンサー Flower 歌词显示...匹配音频和歌词时间点 这部分我想了很久,一直没办法找到方法,现在有个问题,我想让每句播放的时候来个动画,但是现在刷新频率太快,各位大佬支个招吧 html里添加个显示歌词的元素,我用span,并且用Bootstrap...浏览器获取的音频进度] [应该对应的歌词] {"time":122.09,"lrc":"不安なのよ だからお願い"}, 所以只能用模糊搜索 当当前时间大于数组里某个数组的时间大小时,判定就是该数组,通过该数组就能获取到时间和歌词从而显示

    5.7K62

    JavaScript 解析 lrc 歌词

    最近打算做播放器,研究了下解析lrc歌词的算法,百度基本没有现成的,所以自己各种搜索各种折腾然后写了个~~~特分享给大家 我们看到的lrc歌词一般都是这样的: [ti:听妈妈的话] [ar:周杰伦] [...02:06.91]因为过两天你会在操场上捡到 [02:09.18]你会开始喜欢上流行歌 [02:11.35]因为张学友开始准备唱吻别 [03:58.07]美丽的白发 幸福总发芽 可以看到,歌词是由时间标签和歌词本身构成的...,至于那些歌曲信息这些我就忽略了 大概思路是: 按行把歌词拆成数组 遍历这个数组,将每一行的歌词和时间标签一道转换为数组 遍历数组的每一次循环要干的事情: 用正则匹配出这行的时间标签和对应的歌词 以时间标签为单位...,将标签转换为以秒为单位的时间再与该行对应的歌词一同push入数组 由于多时间标签的存在顺序会打乱,所以我们最后还要将保存歌词和时间的数组按时间从小到大排序 js代码如下: function parseLyric...var _lrc = lyric[i].replace(/[d{2}:d{2}((.|:)d{2})]/g,""); //过滤掉空行等非歌词正文部分

    2K21

    每次记歌词——使用Python自动发邮件提醒你记歌词

    前言 前几天在Python交流群里边,【冫马讠成】大佬分享了一个有趣的代码,用于定时发送歌词到邮箱,觉得挺有意思,这里拿出来给大家分享。...实现思路 实现思路倒是不难,其一是Python网络爬虫,将网页上的歌词信息抓取到,然后存起来到一个变量中,其二是编写发送邮件的逻辑,编辑好邮寄模板,然后将抓到的内容发送出去即可,定时任务可以使用Windows...content = '亲爱的,今天歌名是:'+lyric1 message = MIMEText(content, 'plain', 'utf-8') subject = '今天听什么(附歌词...你也可以定时给自己发,使用定时任务工具,做个定时任务,每天提醒自己,看看歌词啥的,看的歌词多了,这样在歌词大赛中也许能拿个好名次呢!...这篇文章主要基于Python网络爬虫和Python自动化办公中的邮件发送知识,实现歌词自动发送邮件的小项目。 最后感谢【冫马讠成】大佬的代码分享,也欢迎大家积极尝试,有好的内容也可以分享给我噢!

    41430

    iOS 音乐播放器之锁屏歌词+歌词解析+锁屏效果

    功能描述:锁屏歌曲信息、控制台远程控制音乐播放:暂停/播放、上一首/下一首、快进/快退、锁屏状态下列表菜单弹框和拖拽控制台的进度条调节进度(结合了QQ音乐和网易云音乐在锁屏状态下的效果)、歌词解析并随音乐滚动显示..., copy) NSString * lrc ; @end 接下来就是要让歌词随歌曲的进度来滚动显示,主要代码如下: self.tableView 显示歌词的 currentTime...当前播放时间点 self.currentRow 当前时间点歌词的位置 //歌词滚动显示 for ( int i = (int)(self.lrcArray.count...更新于2017/9/13 iOS11系统正式发布后 , iOS11上不能像iOS11以下那样锁屏歌词和海报,iOS11把海报显示位置放到了左上方,而且大小变成了头像大小,可能是苹果为了锁屏界面的简洁,...iOS11网易云音乐锁屏界面.PNG 更新于2018/3/7 上面提到 iOS11系统上 ,不能像以往那样显示锁屏歌词了,那锁屏歌词该怎么显示呢,网易云音乐给出了如下图的设计:她是把当前唱到的歌词放到了锁屏的副标题处

    2.8K70

    FlashFlex学习笔记(32):播放音乐并同步显示lyc歌词(适用于Silverlight)

    goes on [03:40.16][02:34.09] [04:05.13][03:52.01](edit by Nathan_na@msn.com) 基本上就是: [时:分.秒](一个或多个) + 本句歌词...(豪)秒数,而value即为对应的歌词,然后将其按key(即歌词出现的时间)升序排序 注:对于"[02:52.99][01:42.80]So, I'm going home"这种写法的歌词,在数组中要拆分成二条...,即相当于: [02:52.99]So, I'm going home [01:42.80]So, I'm going home 播放时,根据当前播放的时间进度,找到对应的数组元素,然后显示 Flash...Array();//全局数组 var sc:SoundChannel; var sound:Sound;         public function LycPlayer() { //定位歌词显示文本框...evt:Event):void { var list:String=evt.target.data; var listarray:Array=list.split("\r\n"); //分析歌词

    77470

    Winform零基础入门教程-实现音乐播放器的歌词显示功能

    上一课链接:Winform零基础入门教程-开发美女音乐播放器软件 程序员 歌词显示分析 如果想要进行歌词显示,则需要后缀名为lrc的歌词文件。通过读取歌词文件进行显示。...为何他能显示的呢?据我猜测,肯定是此类播放器,会在后台默认下载lrc文件到本地。通过一定逻辑进行显示的。事实上,这并不假。下面我打开酷我音乐播放器的歌词文件。发现了我听过的歌曲lrc歌词文件。 ?...设置文件后缀名显示2 歌词显示 歌词显示我们就实现读取,当对应的时间的时候显示歌词就够了。下面看下lrc歌词文件的内容是什么(文本编辑器打开)? ?...lrc歌词文件内容 不难发现除第一行和第二行之外,是以一个时间和歌词的形式保存的。所以,对于歌词显示,我们只需要不断的去判断当前歌曲播放的进度,并且按照时间显示歌词就好了。...在进行播放音乐的时候,搜索一下对应目录是否含有歌词文件: ? 读取歌词文件显示 读取歌词文件,默认规定:歌曲名和歌词名一致。

    1.6K40
    领券