学习HTML5插入曲线变形动画的步骤

     相信大家都已经听说过HTML5了吧，接下来我们课课家教育就来介绍下HTML5软件。而这次我们课课家教育为大家带来的是：HTML5教程之插入曲线变形动画步骤。我们知道，其实mugeda最新添加了一些新的功能中，并且还有一个曲线变形动画的功能，这一节我们来具体讲述怎么使用。所谓曲线变形动画指景物的形体变化，它是使一幅图像在多帧内逐步变化到另一幅完全不同图像的处理方法。因为这是一种较复杂的二维图像处理，而且需要对各像素点的颜色、位置作变换。变形的起始图像和结束图像分别为两幅关键帧，从起始形状变化到结束形状的关键在于自动地生成中间形状，也即自动生成中间帧。

　　软件简介：

　　①：HTML标准自1999年12月发布的HTML4.01后，后继的HTML5和其它标准被束之高阁，为了推动web标准化运动的发展，一些公司联合起来，成立了一个叫做WebHypertextapplicationTechnologyWorkingGroup（Web超文本应用技术工作组-WHATWG）的组织。WHATWG致力于Web表单和应用程序，而W3C（WorldWideWebConsortium，万维网联盟）专注于XHTML2.0。在2006年，双方决定进行合作，来创建一个新版本的HTML。

　　②：Mugeda（木疙瘩）是一个基于云平台，供设计人员在云端快速开发和发布基于H5移动富媒体内容的工具。Mugeda（木疙瘩）可以显著提高开发的内容，该平台有广泛的兼容性，可以在PC、智能手机、平板电脑和智能电视都要可以使用Mugeda（木疙瘩）来开发富媒体内容，不需要设计人员了解编程和技术细节，就可以高效地生成H5贺卡、H5动画和H5小游戏等，一个设计人员就可以在很短的周期内完成之前好几个H5开发人员才能完成的任务。

　　步骤1：首先我们看一个例子，那么以便有个直观的了解：

　　其实在这个动画中，从一个圆逐渐地变为了一个不规则的图形。

　　我们将通过这个动画的制作过程来讲解变形动画的使用。

　　首先在第一帧画一个圆，然后在该图层的后面数帧后插入帧：

　　步骤2：然后在该处右击选择“插入曲线变形动画”：

　　步骤3：此时该时间单元的颜色会改变，如下图：

　　步骤4：与此同时该帧会产生一个红色的关键帧。而在该关键帧处，选中舞台上的圆形后，点击左侧工具条中的节点按钮：

　　步骤5：若然此时舞台上的圆形的节点会显示出来：

　　步骤6：我们就要选中节点，并通过拖动节点改变图形的形状：

　　步骤7：其实我们修改完后，我们就可以明显地看出，这个圆已经变成一个完全不同的图形：

　　步骤8：最后便可以完成，然后保存，并预览动画。（这样就大功告成了）

　　小编结语：相信大家看完之后，都不会觉得太难吧，而且我们也向大家介绍HTML5的软件介绍，其实这个是非常简单的，只要大家用心去学，那么一切困难都能克服，不过这个也是日积月累的过程，如果大家还需要更多更精彩的教程，那么请继续关注我们课课家教育，我们将为大家带来更多更精彩的教育咨询，谢谢大家的支持。