音乐播放器
这个范例会使用 Scratch 实作一个“音乐播放器”，音乐播放器的功能包含：播放、暂停、停止、上一首、下一首、循环播放、单首循环和显示播放进度等功能。
快速导览：
绘制角色造型
使用绘画方式建立第一个角色“play”，负责控制音乐的播放、暂停和继续播放，替角色绘制三组造型，造型名称分别是 stop ( 黑色三角 )、play ( 绿色三角 ) 和 pause ( 两条红色直线 )。
使用绘画方式建立第二个角色“stop”，负责将音乐停止，造型使用一个黑色正方形。
使用绘画方式建立第三个角色“next”，负责播放下一首，造型使用一个两个较薄的“向右”黑色三角形。
使用绘画方式建立第四个角色“pre”，负责播放上一首，造型使用一个两个较薄的“向左”黑色三角形。
使用绘画方式建立第五个角色“repeat”，负责控制音乐的不循环、单首循环和全部循环，替角色绘制三组造型，造型名称分别是 no ( 灰色停止循环标志 )、one ( 黑色循环一次标志 ) 和 all ( 黑色循环标志 )。
使用绘画方式建立第六个角色“line”，负责进度条的底色，造型绘制一个 382x15 的灰色长条形，对齐画布中心。
使用绘画方式建立第七个角色“line_color”，负责进度条的进度颜色，造型绘制一个 14x14 的橘色圆形，对齐画布中心。
建立音乐角色并上传音乐
使用绘画方式建立第八个角色“music”，建立角色后，切换到“音效”页签，上传自己要播放的音乐。
接着切换到“造型”页签，上传几首音乐就建立几个造型，造型的顺序必须对应音乐的顺序，并使用“音乐长度”作为造型名称。
在舞台上排列角色
八个角色都绘制完成后，按照下图，在舞台上排列这八个角色。
程序原理 ( music )
编辑“music”角色的程序，从左侧积木选单里，建立一个名为“音乐时间清单”的函数，并勾选“执行完毕再更新画面”，再来将会透过这个函数，“自动”快速纪录目前的歌曲数量。
点击绿旗时，新增一个变数 music_num 为 1，表示目前要播放的音乐为第一首，并根据 music_num 更换造型，同时使用函数纪录所有造型名称，纪录完成后，清单的长度就是音乐的数量。
函数执行后，发送 stop 广播信号，并在接收到 stop 广播信号时，设定变数 state 为 stop ( 从左侧积木里新增一个变数 state )，且停止所有音效。
编辑收到广播消息 pause 和 play 的程序，使用“降低播放速度和静音”模拟音乐暂停，并透过 state 的内容判断音乐是否从头开始播放。
新增一个名为“切换”的函数，“不用勾选”执行完毕再更新画面。
使用接收广播 next 和 pre 的做法，实作上一首和下一首的程序，不论是收到哪种信号，都会先透过 music_num 变数取得播放的音乐项目号码，接着根据号码播放音乐。
程序原理 ( play )
编辑“play”角色的程序，内容大多是点击角色后，改变造型并发送对应的广播消息，主要逻辑规则如下：
| 造型 | 目前状态 | 点击后的行为 |
|---|---|---|
| stop 造型 ( 黑色三角 ) | 停止状态 | 广播 play 后呈现 pause 造型 ( 红色双杠 )。 |
| play 造型 ( 绿色三角 ) | 暂停状态 | 广播 play 后并呈现 pause 造型 ( 红色双杠 )。 |
| pause 造型 ( 红色双杠 ) | 播放状态 | 发送 pause 开始播放，并呈现 play 造型 ( 色三角 )。 |
程序原理 ( stop )
编辑“stop”角色的程序，点击角色后广播 stop。
程序原理 ( next )
编辑“next”角色的程序，点击角色后广播 next。
程序原理 ( pre )
编辑“pre”角色的程序，点击角色后广播 pre。
程序原理 ( repeat )
编辑“repeat”角色的程序，点击绿旗时，默认使用 all 造型标示“全部循环”，并新增一个 repeat 变数，变数值为目前的造型名称 ( all )，点击角色后切换造型，再将 repeat 设定为目前的造型名称。
程序原理 ( line )
编辑“line”角色的程序，点击绿旗时进行定位和移到最下层 ( 避免盖住进度颜色 )，接着加入画笔积木，在收到 stop 广播时，进行“盖章”的动作并隐藏角色，就能在每次停止时，重置进度条“底色”。
程序原理 ( line_color )
编辑“line_color”角色的程序，首先是收到 stop 广播时，将进度点移动到进度条最前方，图层移动到最上层，并设定画笔的颜色和粗细与造型相同。
当收到 play 广播时，使用 step 变数表示“每一秒移动的距离”，计算方式为“灰色进度底色的长度，除以目前的音乐长度”，利用清单 music_time 搭配目前第几首音乐的 music_num 就能读取音乐长度，读取每一秒移动的距离后，让 line_color 每隔 0.5 秒移动半步 ( step/2 )，搭配画笔的“下笔”，就能制作出音乐播放的进度条。
当进度条完成后，根据目前 repeat 变数的内容，决定接下来要继续播放下一首、停止播放还是重复播放这一首。
完成效果
程序完成后，点击绿旗，就可以透过音乐播放器的按钮，控制音乐播放、暂停、停止、上一首、下一首、循环播放、单首循环和显示播放进度。
范例解答
小结
虽然这个音乐播放器可以做到基本的控制，但美中不足的是不能“真正暂停”音乐，也不能让音乐跳转到指定的位置，不过整篇范例使用了不少有趣的技巧，例如造型名称、广播沟通、画笔...等，是相当有意思的范例喔！
微信扫码关注
抖音扫码关注