BYR Achieve · 镜像论坛

最近在B站上偶然看到了一个up主用Unity做的音乐播放器，惊为天人~正好本人大创内容也是使用Unity做关于音乐的项目，所以产生了浓厚的兴趣，下决心仿制一个。但由于自身时间安排较紧，所以只花两天做了皮毛，但能力不足可见一斑= =……视频地址如下。梦想：https://www.bilibili.com/video/av3654640 现实：https://www.bilibili.com/video/av21411549 我：照不动照不动…… 我之前把自己的思路整理后私信给了up，但考虑到视频年代略显久远（16年的视频），up至今还没回复（也许已经凉凉）于是在此求问pyq的Unity大手子们，如果对这个播放器有什么可行的实现思路（什么都可以），不妨交流一下~最近一个月内随时关注。 ======================================================================================== 附我的思路： 1.歌曲栏 - 我之前也用Unity做过传统模式的播放器，用Unity的UI自带的scroll list作为容器（LayoutManager自然是有的）。把PS好的button图像导入后转为prefab，在添加歌曲时Instantiate并SetParent..就可以往ButtonList里添加button。但是up主的button list感觉很漂亮，很想知道怎么做的~ 2.中间的连续谱图 - 先说说我自己用的办法吧——用Sprites做一条2DRope，sprite之间用HingeJoint2D联结，然后为了产生波动，先读取float[] samples（用AudioListener/AudioSource.GetSpectrumData均可），然后把samples经过特定比例放缩后，作为Force施加到各个sprites的Rigidbody上……再后来，为了使sprite unit归零，我在中轴线上放了一条隐形的Rope（即一排隐形的Sprites...），与可见的sprite unit“一一对应”——即在可见的Sprites上添加SpringJoint2D，与中轴线上隐形的Sprites相连（做成若干个弹簧）……再然后……调一调质量，改一改Force的scaling factor，再来点BeatDetection，如此云云，就可以实现Rope随节奏起伏了~ ——BUT，这离预期相距甚远！！！至少有两个问题：一是绳子各个部分受力相当不均匀，产生了大量不规则运动，完全没有美感！二是基本只在一侧运动，没法实现UP主视频中那样两侧平滑抖动。 3.上下端的频谱 - 嗯如果没猜错的话……是用Cube做的（当然，有上面的例子，用2D Sprite也是肯定可以的），但这种平滑的感觉是真的模仿不来。我视频中使用的方法是：直接读取samples的值赋给cubes的scale.y，简单粗暴，也很傻。除此之外我在之前做过的“八频段”播放器中使用过一种cube缓冲方法，是读取samples后创建一个等size的Buffer和BufferDecrease，当sample值大于buffer值，直接赋给buffer，当sample值小于buffer值，则buffer以一定速率减少（也就是BufferDecrease了）——这样可以实现平滑下落……但是每次sample增大时无法平滑化【难道还是用Force？不清楚】） 4.背景的Album Cover，在选中歌曲后专辑封面有一个平滑移动的入场动作，我没做过类似的……但猜测可以通过类似cCurve的轨迹插件设计曲线，让sprite随轨迹运动？又或者利用Animation，那我就真的不懂了。 5.节奏检测 - 在视频中，我自己也用了别人写的Beat Detection算法，但是感觉上还是差了点意思（正如视频里表现的那样，就是精确度不敢恭维），up的视频里，封面面积变化、光线变化（我猜也是Animation..?）与节奏的对应真是令人惊叹的准确，所以特地来向各位请教。 ============================================================================== 4.12日更新经过将近一星期的研究，在学习前人经验的基础上结合自己的知识做出了一个本地音乐播放器，也即人生第一个勉强能用的小玩具……用以同志趣相投的大家进行交♂流和学♂习百度云：链接：https://pan.baidu.com/s/1Gby8q1-omDcFnKavLFCF8A 密码：hs37 由于赶大创工期的缘故，写代码的时候引用关系相当混乱，所以项目源文件估计得修饰修饰，过段时间才能放出来……请见谅 ========================================================= 作为网易云音乐的忠实粉丝，当然是默认读取D:\CloudMusic下的本地音乐了，名字也叫作“网易云本地播放器”——当然也可以将目标音频目录添加到MusicDirectory.txt文件中，算是一个难得的user-friendly之处了~ 注：因为种种原因，对电脑配置要求恐怕有点高（尴尬脸）……所以在低配电脑上运行时可能偶尔出现一些神鬼莫测的bug，比如慢动作、闪现、若隐若现……但都暂且无伤大雅，应该不会出现电脑蓝屏之类的恶性事故（滑稽） ========================================================== 简单说下实现原理：借鉴了UP主的UI设计和频谱函数，并用自己擅长的UnityEngine.UI/Canvas实现了包括专辑封面、进度条、歌曲列表等元素，依靠自己之前制作音乐播放器的基础添加了控制按钮和简单的音效~ UI就没有麻烦好基友——校内鼎鼎大名的"Magnum工作室"帮忙设计（微信号:baoshijie356a，对我就是在打广告（滑稽）），而是直接照搬了up主的风格，根据自己的审美略作修改，而且因为实现方法完全不同，所以细节上也有些区别。说到频谱，之前我还纳闷怎么会有电脑在Unity里跑实时8192点FFT还能如此流畅，原来人家实现visualizator压根没用传统的Cube Scaling，用的是Texture Drawing~不得不说令人大开眼界。此外值得一提的是，本以为Unity没有绘制连续频谱的能力，因此被迫使用Cube和Joint2D，依靠物理引擎强行DIY了一条“绳子”……结果发现自己压箱底的Vectrosity插件就可以绘制，而且有很大的研究价值，之前从taobao买回来就一直没用过，可以说是非常尴尬了…… 专辑封面——为了节省时间，选择用人们耳熟能详的UI.Image实现（UP非常喜欢用Plane和Texture2D，而许多变化过程只在脚本中可见，在SceneView里是不可见的，所以本人没有采用这种方法，虽然这可能使项目看上去臃肿一些）。简单起见，直接使用RotateAround函数，外加IEnumerator，让AlbumCover绕着某个中心点晃呀晃地晃到正中间。至于封面尺寸和亮度变化，UP使用了Directional Light（单向光），但我使用的是2D UI Element，所以没法体现光照效果，只能用Image自身的R/G/B/A了~节奏点用了最简单的AudioBand算法，详细的可以Google "PeerPlay"，这是一个非常有趣的擅长音频可视化的Unity讲师【当然淘宝上也有一些可供选择的插件卖】。善用IEnumerator，可以用最简单粗暴的手段做出相对能接受的动态效果。播放器基本功能——这个讲起来麻烦，说起来容易，做起来不那么简单……如果没有基础的话，上淘宝挑一个看着顺眼的Unity MusicPlayer项目，把Canvas下的UIEvents(Event System)研究个透就差不多搞明白每个button/slider的行为逻辑了。歌曲列表——直接用UI.Text，里面每行是一首歌名。一开始给Text定一个初始位置。用Text的preferredHeight除以播放器从本地获取的“总曲目数”，得到“每次位移宽度”，你就知道每次检测到滚轮活动要移动多少距离了……然后在特定条件下触发“显示/隐藏列表”、“切歌”等事件即可。音效——这里用的是下拉框——UI.Dropdown。具体音效的实现方法有很多，如果你有相关的算法基础，完全可以引用外部dll，然后用自己熟悉的算法实现。我是图省事，直接用Unity自带的AudioMixer、AudioMixerSnapshot，通过调整参数，实现了几种我个人比较常用的音效（日常下饭用……不需太花哨）。 =========================================================== （握手）同志们有空多多交流~ 毕竟在北邮折腾游戏，大概真的是为了一种叫“情怀”的东西了吧……愿大家共同学习共同进步

【讨论】关于Unity3D的问题诚心请教（4.12进度更新）