AdobeEdgeAnimate

AdobeEdgeAnimate

HTML5动画神器Edge Animate为现代网站创建动画，交互式内容。Edge Animate是Adobe最新出品的制作HTML5动画的可视化工具，简单的可以理解为HTML5版本的Flash Pro。Edge Animate 可让网路设计人员制作适用於

Adobe Edge Animate 主要是通过 

精确的动画

直觉化的使用者界面

绘图和文字工具

移动路径

可重复使用的符号

丰富的互动性

渐层支援

CSS 筛选器支援

适用于行动装置的内容

原生 HTML

adobe edge安装序列号

1582-0185-6601-7300-3963-3218

主界面

从主界面我们可以直接进入：

1.工程操作（Project Commands）：打开之前保存的工程（Open File...）或者新建一个工程（Create New...）；

2.从最近使用

软件官方设计为紫色，文件扩展名如下：

1.工程文件扩展名为（.an）；

2.元件输出文件

Adobe Edge Animate的强大之处在于它提供了精确的编辑工具和可视化的时间线。

工具栏：（1-3）元素操作工具；（4-7）创建元素的工具；（8-10）元素细节调节工具，使用HTML5和CSS。

1.选择（V）

4.长方形（M）

8.背景色

2.拉伸变换（Q）

5.圆角长方形（R）

9.边缘色

3.裁剪（C）

6.椭圆形（O）

10.新元素默认布局

7.文本（T）

下面这张截图显示的是Edge Animate的主要工作区：

1.工具栏：用于对舞台中的元素进行

Adobe Edge Animate提供了三种发布方式（如何发布：File-Publishing菜单）

1.发布到Web：将最终工程渲染完成并导出到指定目录，你可以上传（ftp）到你的Web服务器查看。

附加web发布功能：启用“google chrome frame”，你的发布在IE旧版本上也可以查看。通过CDN简化加载的框架

将内容发布为静态的HTML和HTML标签，而不是通过搜索引擎优化和内置Javascript来提高兼容性

2.发布为Deployment Package：用于其他Adobe产品如Adobe Indesign

3.发布为Apple iBooks Author 

Adobe Edge Animate

1.启用标尺（Rulers）：（

Adobe Edge Animate的强大之处在于它能获得舞台中元素的标签（即ID）和这个元素样式属性（CSS）的变化，并将这些变化在时间线上以关键帧的形式“标记”。这样必然导致关键帧之间属性值的变化，这个中间阶段会被转化为一个过渡阶段，或者说一段动画（如图片透明度Opacity的变化，淡入淡出、一个元件的移动Location和缩放Scale等等）。

以下截图显示的是一个元素的属性，这些属性都可以调整，每一个元素都有自己的属性值：

1.元素ID（Element ID）：元素的身份标记，可以通过代码直接访问这个元素的属性值，并修改它们。

2.元素标签（Element Tag）：有div、img等等。

3.元素类别（Class）

4.动作事件（Actions）：可添加对元素的动作事件控制代码。

5.显示（Display）：元素在舞台中是否显示。

6.显示设定（overflow）：包括

visible :默认值。不剪切内容也不添加滚动条。假如显式声明此默认值，对象将以包含对象的       window 或 frame 的尺寸裁切。并且 clip 属性设置将失效。 auto : 在必需时对象内容才会被裁切或显示滚动条。 hidden:不显示超过对象尺寸的内容。 scroll : 总是显示滚动条。

7.添加关键帧（Keyframe Maker）：点击即可在时间线上添加一个透明度的关键帧。

8.透明度（Opacity）：拖动调整或者直接输入

Adobe Edge Animate元素面板显示的是节点式的树形结构，表示元素与父元件Stage的联系。

放置（或堆叠）在上方的元素具有更高的Z-index值，会显示在其他元素（堆叠在下方的元素）上方。

以下截图指示了元素面板的主要功能、图解和使用案例。

1.每个元素都具有用户定义的ID和标签、用一个与元素类型相关联的图标表示；

2.堆叠的元素可以使用Adobe Edge Animate中的组、嵌套或符号实例功能。

3.点击动作事件

Adobe Edge Animate的时间线融合了元素的节点式树状结构和与元素属性关联的关键帧，这些信息显示在时间线左侧，而右侧则显示时间信息表。元素属性值（关键帧）被标记在时间线确切的时间点，当

代码管理器使用一个单独完整的窗口界面来展示所有事件控制代码和时间线触发器。（快捷键Ctrl/Command + E或者通过菜单Window-Code打开）所被编辑的控制代码或触发器会被高亮显示。

1.点击“+”图标添加全局、局部、时间线控制代码或者触发器；

2.点击“Full Code”按钮可以显示并编辑单个文件的全部代码，而不仅仅是单个功能函数内部代码；

3.可以通过下方的代码错误提示窗进行错误快速排除检测。