如题所述
第1个回答 推荐于2016-09-26
针对设计师 使用DragonBones在Flash Pro中创建骨骼动画
作为设计师，你只需要准备好动画角色的各个部分，在Flash Pro的时间轴中把他们有序组装起来、设置好动作关键帧并运用DragonBones的骨骼动画编辑面板搞定一切。
在下载并安装完毕骨骼面板的Flash Pro扩展插件后，启动Flash Pro。打开教程源码下载包中的DragonBones_tutorial_Start.fla文件。
打开库面板，你可以看到此示例的相关资源。
在parts目录中包含的是组成动画Dragon的各个元件，从命名可以直观的了解到它们对应的龙的各个部分。良好的元件命名是个好习惯，不是么？:)
双击库面板中的MovieClip元件Dragon进入时间轴编辑模式。我们需要详细了解这个动画的组成，它有助于后面骨骼动画编辑。
注意：1，请留意时间轴上的各层的命名，我们是以骨骼各个部分来命名的。骨骼动画面板将自动根据层的命名来识别组成骨骼的各个部分。
,2，需要注意的是层label，我们添加了标签“walk”用来说明当前时间轴表示的动作。如果由多个动作，请在对应动作起始位置添加标签来说明。这一步非常重要！骨骼动画面板将按照标签来读取并设定动作。
你发现时间轴上并没有添加补间？是的，你仅仅需要在时间轴上设置关键帧上各元件的位置，剩下的工作都可以在骨骼面板中完成。
当然，作为设计师的你，可以按你的习惯做好完整的补间动画，骨骼面板同样可以按照你的动画原样导入。（注：目前版本的DragonBones仅支持传统补间，新补间将在后续版本中支持）
当你按上述要求准备好动画，就可以点击Flash Pro菜单中的Window>Other Panels>SkeletonAnimationDesignPanel打开骨骼动画编辑面板。我们将在接下来的操作中详细说明骨骼动画编辑面板的使用。
在此面板中点击“Import”按钮，此时将出现下图所示窗口：
在导入面板中你可以设置贴图排序、贴图高度及贴图间距。在导入选项中，你可以导入选中的库元件、所有库元件以及通过骨骼面板导出的PNG/SWF/ZIP文件等。
选中Flash Pro库中的MovieClip元件Dragon，然后在骨骼动画编辑面板中选择导入选中的项目，点击OK按钮。
骨骼动画编辑面板导入动画元件Dragon后如下图：
Armature List: 导入动画MovieClip的列表，与MovieClip在库中的名称一致，程序中将以此名称来创建动画对象。每个包含动作的MovieClip，在DragonBones里我们称之为“骨架”（Armature）。
Behavior. List: 对应动画对象的各个动作/行为名称，与MovieClip中帧标签名称一致，程序中将以此名称来动态播放各种动作。
Bone Tree: 动画对象的各个骨骼组成部分，与MovieClip中各层名称一致。
Texture List: 动画对象中各部分对应的材质名称。
对于每个动作，首先要设置的参数如下：
Total Frame: 当前动作的总帧数。帧数越大，动作越慢。
Tween Frame: 设置其他动作切换到此动作需要的帧数。比如，你的游戏角色有个动作为蹲下，此动作在时间轴上仅有1帧。假如设置此参数为6，那么当游戏中从其他动作切换到蹲下时候，程序会自动增加6帧的过渡，让各个动作切换更加自然。
Keyframe. Ease: 当前动作各关键帧之间的缓动系数。
Loop: 当前动作是否循环播放。比如角色的走、跑步等。
A当设置好上述参数，你可以在左下方的预览区域中看到当前编辑动作的动画。
预览窗口左上角可以缩放预览对象，便于观察的动作。
OK，接下来我们在Bone Tree面板中设置动作中各个骨骼的从属关系。下图可以看到在默认导入的动画中，各个骨骼没有关联：
在此面板中右上角的 可以设置在预览窗口里当前选中骨骼的高亮颜色。
在列表里我们可以拖拽的方式，将子骨骼附着在父骨骼上。如下图，我们将身体设置为主骨骼，而头、尾巴、上肢和下肢都为其子骨骼。而上肢中又包含了上臂、下臂和手等。通过树形结构我们可以非常直观的看到他们的从属关系。
我们可以对每个骨骼的运动参数进行单独设置。在Bone Tree面板中选中你需要设置的骨骼，调节下列参数。
Tween Time Scale: 设置当前骨骼运动时间相对动作总时间（总帧数）的增加或减少。
Tween Time Delay: 设置当前骨骼开始运动时间相对所属动作的延迟或提前。
别小看这2个参数，各个骨骼通过这2个参数微调后，你会发现角色动作哪怕在时间轴上仅有2个关键帧，也会产生非常复杂的动作。
例如本例中，我们把龙的尾巴tail的Tween Delay设置为-10，尾巴尖tailTip的Tween Delay设置为-50，你可以明显看到尾巴随着身体的运动甩动起来，非常的生动。;)
当你调整完骨骼动画，就可以点击”Export”按钮导出。
在导出格式选项中，包含多种数据格式供你实际项目需求。
例如在本例中，我们选择PNG(XML Merged)，点击OK导出文件DragonWalk.png到指定的目录。
你会发现导出的就一个PNG文件？是的，我们选择了合并XML数据的PNG格式，所以此文件中包含了骨骼动画需要的所有数据。
作为设计师，到此你的工作圆满完成。
SWF (XML Merged): 包含骨骼XML数据的SWF格式，如果游戏需要矢量的骨骼动画可以采用此格式导出，当然前提是原始素材都是矢量的。
PNG(XML Merged): 包含骨骼XML数据的PNG格式。
Zip(XML and SWF): 分开保存的骨骼XML数据和SWF资源。
Zip(XML and PNG): 分开保存的骨骼XML数据和PNG图片。
Zip(XML and PNGs): 分开保存的骨骼XML数据和按每个骨骼独立的PNG图片包。本回答被提问者和网友采纳
作为设计师，你只需要准备好动画角色的各个部分，在Flash Pro的时间轴中把他们有序组装起来、设置好动作关键帧并运用DragonBones的骨骼动画编辑面板搞定一切。
在下载并安装完毕骨骼面板的Flash Pro扩展插件后，启动Flash Pro。打开教程源码下载包中的DragonBones_tutorial_Start.fla文件。
打开库面板，你可以看到此示例的相关资源。
在parts目录中包含的是组成动画Dragon的各个元件，从命名可以直观的了解到它们对应的龙的各个部分。良好的元件命名是个好习惯，不是么？:)
双击库面板中的MovieClip元件Dragon进入时间轴编辑模式。我们需要详细了解这个动画的组成，它有助于后面骨骼动画编辑。
注意：1，请留意时间轴上的各层的命名，我们是以骨骼各个部分来命名的。骨骼动画面板将自动根据层的命名来识别组成骨骼的各个部分。
,2，需要注意的是层label，我们添加了标签“walk”用来说明当前时间轴表示的动作。如果由多个动作，请在对应动作起始位置添加标签来说明。这一步非常重要！骨骼动画面板将按照标签来读取并设定动作。
你发现时间轴上并没有添加补间？是的，你仅仅需要在时间轴上设置关键帧上各元件的位置，剩下的工作都可以在骨骼面板中完成。
当然，作为设计师的你，可以按你的习惯做好完整的补间动画，骨骼面板同样可以按照你的动画原样导入。（注：目前版本的DragonBones仅支持传统补间，新补间将在后续版本中支持）
当你按上述要求准备好动画，就可以点击Flash Pro菜单中的Window>Other Panels>SkeletonAnimationDesignPanel打开骨骼动画编辑面板。我们将在接下来的操作中详细说明骨骼动画编辑面板的使用。
在此面板中点击“Import”按钮，此时将出现下图所示窗口：
在导入面板中你可以设置贴图排序、贴图高度及贴图间距。在导入选项中，你可以导入选中的库元件、所有库元件以及通过骨骼面板导出的PNG/SWF/ZIP文件等。
选中Flash Pro库中的MovieClip元件Dragon，然后在骨骼动画编辑面板中选择导入选中的项目，点击OK按钮。
骨骼动画编辑面板导入动画元件Dragon后如下图：
Armature List: 导入动画MovieClip的列表，与MovieClip在库中的名称一致，程序中将以此名称来创建动画对象。每个包含动作的MovieClip，在DragonBones里我们称之为“骨架”（Armature）。
Behavior. List: 对应动画对象的各个动作/行为名称，与MovieClip中帧标签名称一致，程序中将以此名称来动态播放各种动作。
Bone Tree: 动画对象的各个骨骼组成部分，与MovieClip中各层名称一致。
Texture List: 动画对象中各部分对应的材质名称。
对于每个动作，首先要设置的参数如下：
Total Frame: 当前动作的总帧数。帧数越大，动作越慢。
Tween Frame: 设置其他动作切换到此动作需要的帧数。比如，你的游戏角色有个动作为蹲下，此动作在时间轴上仅有1帧。假如设置此参数为6，那么当游戏中从其他动作切换到蹲下时候，程序会自动增加6帧的过渡，让各个动作切换更加自然。
Keyframe. Ease: 当前动作各关键帧之间的缓动系数。
Loop: 当前动作是否循环播放。比如角色的走、跑步等。
A当设置好上述参数，你可以在左下方的预览区域中看到当前编辑动作的动画。
预览窗口左上角可以缩放预览对象，便于观察的动作。
OK，接下来我们在Bone Tree面板中设置动作中各个骨骼的从属关系。下图可以看到在默认导入的动画中，各个骨骼没有关联：
在此面板中右上角的 可以设置在预览窗口里当前选中骨骼的高亮颜色。
在列表里我们可以拖拽的方式，将子骨骼附着在父骨骼上。如下图，我们将身体设置为主骨骼，而头、尾巴、上肢和下肢都为其子骨骼。而上肢中又包含了上臂、下臂和手等。通过树形结构我们可以非常直观的看到他们的从属关系。
我们可以对每个骨骼的运动参数进行单独设置。在Bone Tree面板中选中你需要设置的骨骼，调节下列参数。
Tween Time Scale: 设置当前骨骼运动时间相对动作总时间（总帧数）的增加或减少。
Tween Time Delay: 设置当前骨骼开始运动时间相对所属动作的延迟或提前。
别小看这2个参数，各个骨骼通过这2个参数微调后，你会发现角色动作哪怕在时间轴上仅有2个关键帧，也会产生非常复杂的动作。
例如本例中，我们把龙的尾巴tail的Tween Delay设置为-10，尾巴尖tailTip的Tween Delay设置为-50，你可以明显看到尾巴随着身体的运动甩动起来，非常的生动。;)
当你调整完骨骼动画，就可以点击”Export”按钮导出。
在导出格式选项中，包含多种数据格式供你实际项目需求。
例如在本例中，我们选择PNG(XML Merged)，点击OK导出文件DragonWalk.png到指定的目录。
你会发现导出的就一个PNG文件？是的，我们选择了合并XML数据的PNG格式，所以此文件中包含了骨骼动画需要的所有数据。
作为设计师，到此你的工作圆满完成。
SWF (XML Merged): 包含骨骼XML数据的SWF格式，如果游戏需要矢量的骨骼动画可以采用此格式导出，当然前提是原始素材都是矢量的。
PNG(XML Merged): 包含骨骼XML数据的PNG格式。
Zip(XML and SWF): 分开保存的骨骼XML数据和SWF资源。
Zip(XML and PNG): 分开保存的骨骼XML数据和PNG图片。
Zip(XML and PNGs): 分开保存的骨骼XML数据和按每个骨骼独立的PNG图片包。本回答被提问者和网友采纳
