npm 包 midijssf-timgm6mb-pmb 使用教程

阅读时长 5 分钟读完

midijssf-timgm6mb-pmb 是一个 npm 包,提供了 MIDI JS 格式的音乐文件播放器,使用的是 TimGM6mb 乐器音源,可以直接在前端项目中引入使用。

安装

使用 npm 安装 midijssf-timgm6mb-pmb:

引入

在需要使用的地方引入 MIDIPlayer 类和解析 MIDI JS 文件的函数:

使用

解析 MIDI JS 文件

使用 loadRemote 函数解析远程 MIDI JS 文件:

也可以使用直接从字符串解析 MIDI JS 文件:

播放控制

可通过 player 控制播放:

事件监听

使用 on 和 off 方法监听播放事件:

-- -------------------- ---- -------
----------------- -- -- -
  --------------------
---

----------------- -- -- -
  --------------------
---

------------------- -- ------

配置选项

也可在创建 player 实例时传入配置选项:

选项列表:

  • loop - 是否循环播放,默认为 false

示例代码

-- -------------------- ---- -------
--------- -----
----- ----------
  ------
    ---------------------------- ----------
  -------
  ------
    ------------------------- -------
    ------- ---------------------
    ------- ----------------------
    ------- -----------------------
    ------- ---------------------
    ------- --------------
      ------ - ----------- ---------- - ---- ------------------------

      ----- ------- - --------------------------------
      ----- -------- - ---------------------------------
      ----- --------- - ----------------------------------
      ----- ------- - --------------------------------

      --------------------------------- -- -- ---------------
      ---------------------------------- -- -- ----------------
      ----------------------------------- -- -- -----------------
      --------------------------------- -- -- ---------------

      ----------------------------------------------------------------------------------------------------------- ---- -- -
        ----- ------ - --- -----------------
        ----------------- -- -- ---------------------
        ----------------- -- -- ---------------------
        ---------------- -- -- ---------------------
      ---
    ---------
  -------
-------

意义和总结

midijssf-timgm6mb-pmb 可以使前端项目更方便地播放 MIDI JS 格式的音乐文件,提高用户体验。同时,它也提供了一种优秀的扩展和学习路径,鼓励各类前端开发者将其应用于自己的项目之中,以提高自身技能水平,更好地服务于用户需求。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/6005626a81e8991b448dfb41

纠错
反馈