乐趣区

关于动画:TIL-学习骨骼动画

理解了下骨骼动画的场景和常见工具,走通 H5 中实现骨骼动画的能力。

成绩 demo:

常用工具

  • dragonbones 收费
  • spine 免费
  • blender+doatools 收费

综合我的场景和费用和易用性,抉择 dragonbones 进一步理解

demo

要学习 Dragonbones 根本用法,倡议间接看视频教程

https://www.bilibili.com/vide…

为了实现下面 gif demo 成果,我大略做了上面这些事:

  1. 理解 Dragonbones 界面:https://docs.egret.com/dragon…
  2. 理解骨骼动画基本概念:https://docs.egret.com/dragon…
  3. 学习网格:https://docs.egret.com/dragon…
  4. 学习蒙皮权重:https://docs.egret.com/dragon…
  5. 查看部份视频教程:https://www.bilibili.com/vide…
  6. 转到”骨骼拆卸“模式:https://docs.egret.com/dragon…
  7. 导入图片
  8. 为图片创立网格

    • 举荐用边线工具创立网格,十分不便
    • (可选)进一步细调
  9. 创立骨架

    • (可选)进一步细调
  10. 主动调配权重

    • (可选)手动细调
  11. 转到“动画制作”模式
  12. 制作动画

    • 举荐关上主动关键帧性能
    • (疑难)没有如文档中所说呈现缩放骨骼的管制柄,只能通过底部输入框调整数值

  13. 能够在浏览器中预览
  14. 导出,并在 cocos creator 中应用
退出移动版