Merge pull request wayee#4 from andycai/master

增加第8章内容

Author: wayee

0.md

@@ -42,6 +42,13 @@
 	- 引擎介绍
 12. [国际化](12.md)
 13. [性能优化](13.md)
+	- 优化概述
+	- 节省内存
+	- 释放内存
+	- 事件模型与回调
+	- 减少CPU使用
+	- 鼠标交互
+	- ActionScript 3.0 性能
 14. [Git和GitHub入门](14.md)
 	- 简介
 	- 使用Git管理个人文档

1.md

@@ -5,7 +5,6 @@
 本章内容将会一起研究一些 AS3 中一些重要的知识点，也是展示 AS3 特性的知识。
 
 ## 可视化对象列表
----
 
 ActionScript 3.0 和 Flash Player 9 的渲染模型已经和以前的版本有很大不同。以前 MovieClip是渲染的焦点。swf 电影的根节点就是 MovieClip (现在用Stage). 根节点MovieClip 可以包含子节点 MovieClips， 子节点还可包含更多的子节点MovieClips。这样的层次结构用来控制MovieClips 的绘制（深度越深表示显示在最顶层） 。createEmptyMovieClip( ), attachMovie( ), 或duplicateMovie- Clip( ) 用来创建MovieClips。一旦MovieClip 被创建，它就自动添加到这个可视化层级列表中通过渲染器进行绘制。MovieClips 在层级列表中不能移动位置，非要这么做则只有删除当前的，然后在指定位置创建。
 
@@ -20,6 +19,9 @@ stage 是可视化对象列表层级的根节点。每个电影有一个stage 
 * **可视化对象**  
 可视化对象就是一个可显示的元素。有两种一种是可视化对象容器，比如MovieClip，另外是可视化对象，比如一个TextField。可视化对象创建后不会立即被显示出来，只有被添加到可视化对象容器后才被显示。
 
+**类层级图：**
+![类层级图](images/1-1.png?raw=true)
+
 ### 对象操作
 
 使用DisplayObectContainer类的addChild( ) 和addChildAt( ) 方法
@@ -59,7 +61,6 @@ stopDrag( )。startDrag( ) 方法可在任何Sprite 实例上调用，要想停
 
 
 ## 事件流机制
----
 
 AS3.0的类继承设计是深思熟虑的，所有的可视对象所属类都是DisplayObject的子类， DisplayObject又是EventDispatcher的子类，因此它们就都可以派发Event（事件）了。
 
@@ -74,6 +75,7 @@ useCapture:Boolean(default = false)确定侦听器是运行于捕获阶段、目
 当事件发生后生成一个携带数据的对象，然后检查目标对象是否存在显示层中，并遍历从根容器一直到目标对象所在位置的所有对象，以树形势表示。自动检测所经过的节点是否注册了监听器。
 
 事件流按运行流程分为3步：
+![事件流流程图](images/1-2.png?raw=true)
 
 * 捕获阶段：捕获事件 capturing，从根节点开始顺序而下，检测每个节点是否注册了监听器。同时，Flex 将事件对象的currentTarget 值改为当前正在检测的对象。如果注册了监听器，则调用监听函数。
 * 目标阶段：检测目标的监听器 targeting：触发在目标对象本身注册的监听程序
@@ -203,7 +205,7 @@ As3提供了双击事件的调用，但有时候碰到双击事件无法响应
 如果你需要子对象也要接受事件响应，那么把所有容器子对象的属性 doubleClickEnabled = true。
 
 ## 绘图于遮罩
----
+
 在ActionScript中，Shape, Sprite, Button, 和MovieClip每个类都有个graphics 属性，它是flash.display.Graphics 类实例。Graphics 类定义了一些绘图内容的API。这里讨论的基本上是如何使用Graphics类的部分API。因为Shape, Sprite, Button, 和MovieClip 类已经定义了graphics 属性，它就是Graphics实例的引用，所以没有必要再构造新的Graphics 对象。对象的graphics 属性可在对象内绘图。
 
 ### 设置线条
@@ -358,7 +360,7 @@ matrix 默认下不需要应用转换，也可指定flash.geom.Matrix对象进
 sampleSprite.mask = maskSprite;
 
 ## 位图
----
+
 和Flash 8 中的BitmapData类一样，这是非常重要的一个类，起初，Flash只是基于矢量的一个工具，矢量图形是由数学方法描述图形元素，比如一条直线是从x0, y0 扩展到x1, y1。 而一个位图，它把图形描述为一个矩形区域值集合，每个点都对应一个颜色值。矢量图有两大优势：缩放和文件大小。当你缩放矢量图时，图像总能保持清晰，而位图当放大时就会出现锯齿状变得不清晰。
 
 正因为矢量图是一个线条，曲线和图形的坐标组成的列表，所以它的文件和位图相比小很多。而位图要记录每个点的颜色值，信息量非常大，也就导致了文件的庞大。矢量图的这种优势使它作为Flash媒体格式的最好形式，但是位图也有它自己的优点，比如位图能很好的表现照片，如果用矢量图去描述照片的所有颜色和图形，那结果就是比位图的文件还要大了。
@@ -415,7 +417,7 @@ sourceBmp是源的BitmapData，srcRect是flash.geom.Rectangle类实例，destPoi
 
 
 ## 加载外部资源
----
+
 ### Loader、URLLoader和URLStream的使用区别Loader
 
 Loader 类可用于加载 SWF 文件或图像（JPG、PNG 或 GIF）文件。 使用 load() 方法来启动加载。被加载的显示对象将作为 Loader 对象的子级添加。因为loader是继承与容器类的，所以首先它是个容器，而URLLoader 是继承与EventDispatcher，它不是容器。
@@ -544,7 +546,7 @@ URLoader用于加载外部文本数据（txt/xml)和二进制数据，也能加
 
 
 ## 文件管理
----
+
 在Flash播放器8以前的版本中并没有提供管理文件的功能，也没有一种机制用于上传和下载文件，因此大多数Web程序都是基于HTML的方式上传和下载文件，基于Flash的应用程序必须自己来实现上传和下载文件功能，从Flash播放8开始，系统提供了一套新的APIs 来支持文件的上传和下载。Flash 播放器允许用户浏览本地文件，并使用 FileReference 和 FileReferenceList 类上传和下载文件，本章将讨论这些 APIs 。
 
 ### 下载文件
@@ -660,7 +662,7 @@ upload( )方法抛出的异常和 download( )方法相同， 比如都会抛出
 
 
 ## ActionScript 3.0 与 JavaScript 互相调用
----
+
 
 有时候会有这样的需求，需要 ActionScript 3.0（AS3） 于 JavaScript（js） 之间互相调用。
 
@@ -687,7 +689,7 @@ js 代码：
 在什么情况下需要这样使用呢，真实的例子，腾讯平台或者是Facebook都提供有邀请好友的功能，那么我们在游戏中需要邀请腾讯上的QQ好友就需要用到，腾讯提供了js的API，加载他们提供的API的js 文件代码后，就可以直接使用他们提供的 API，通过在游戏中调用腾讯提供的 js API 函数，发送邀请好友请求，然后会弹出邀请好友界面，选择好友，点击确定后，腾讯API提供回调功能，在js回调函数中编写调用AS3的函数来回调到flash中，来执行发奖励等操作，下次读者开发的应用或者游戏有机会上平台就可以用上了。
 
 ## SourceMate
----
+
 SourceMate 是 Flash Builder 开发工具的一个插件，非常好用的，可以设置代码快速生成模板，可以给整个文件快速导入所有累，提供重构许多工具，变量提取等。再加上自定义自己的高速快捷键，开发AS3项目时就如虎添翼了。
 
 

13.md

@@ -1,6 +1,6 @@
 # 13. 性能优化
 
-## 优化
+## 优化概述
 
 ### 运行时代码执行基本原理
 
@@ -76,8 +76,7 @@ getSize() 方法显示对象在内存中占用的字节数。可以看到，如
 
 注：使用正值时，将舍入值转换为整数比使用 Math.floor() 方法快得多。
 以下图像显示位图平铺效果：
-
-
+![位图平铺效果图](images/13-1.png?raw=true)
 
 优化的版本创建了由多个 Bitmap 实例引用的单一 BitmapData 实例，并产生相同的效果：
 
@@ -116,7 +115,7 @@ getSize() 方法显示对象在内存中占用的字节数。可以看到，如
 	}
 
 下图显示的是位图转换的效果：
-
+![位图转换效果图](images/13-2.png?raw=true)
 
 ### 尽可能使用对象池
 
@@ -252,8 +251,10 @@ SpritePool 类在初始化应用程序时创建新的对象池。getSprite() 方
 通过尽量重复使用实例来优化 BitmapData 类的使用，这一点非常重要。Flash Player 10.1 引入了一个适用于所有平台的新功能，称为 BitmapData 单个引用。从嵌入图像创建 BitmapData 实例时，将对所有 BitmapData 实例使用位图的同一版本。如果稍后修改位图，则在内存中为该位图提供其自身的唯一位图。嵌入的图像可来自库或 [Embed] 标签。
 注：此新功能同样适用于当前内容，因为 Flash Player 10.1 会自动重复使用位图。
 当实例化嵌入的图像时，将在内存中创建相关联的位图。在 Flash Player 10.1 之前的版本中，内存中为每个实例都提供了一个单独的位图，如下图所示：
+![](images/13-2.png?raw=true)
 
 在 Flash Player 10.1 中，当创建同一图像的多个实例时，单个版本的位图将用于所有 BitmapData 实例。下图演示了此概念：
+![](images/13-3.png?raw=true)
 
 此方法大大降低了具有许多位图的应用程序的内存使用量。以下代码创建了 Star 符号的多个实例：
 
@@ -273,6 +274,7 @@ SpritePool 类在初始化应用程序时创建新的对象池。getSprite() 方
 	}
 
 下图显示该代码的效果：
+![](images/13-4.png?raw=true)
 
 使用 Flash Player 10，以上动画大约占用 1008 KB 的内存。在桌面和移动设备上，使用 Flash Player 10.1 时该动画仅占用 4 KB。
 以下代码修改一个 BitmapData 实例：
@@ -295,8 +297,10 @@ SpritePool 类在初始化应用程序时创建新的对象池。getSprite() 方
 	ref.bitmapData.pixelDissolve(ref.bitmapData, ref.bitmapData.rect, new Point(0,0),Math.random()*200,Math.random()*200, 0x990000);
 
 下图显示修改一个 Star 实例的效果：
+![](images/13-5.png?raw=true)
 
 在内部，Flash Player 10.1 在内存中自动分配和创建一个位图以处理像素修改。当调用的 BitmapData 类的方法导致像素修改时，将在内存中创建一个新实例，而不更新其他实例。下图演示了此概念：
+![](images/13-6.png?raw=true)
 
 修改一个星形后，就会在内存中创建一个新副本；生成的动画在 Flash Player 10.1 上大约占用 8 KB 的内存。 在上一示例中，各个位图可单独用于转换。要仅创建平铺效果，则 beginBitmapFill() 方法是最合适的方法：
 
@@ -312,11 +316,16 @@ SpritePool 类在初始化应用程序时创建新的对象池。getSprite() 方
 ## 事件模型与回调
 
 考虑使用简单的回调代替事件模型。
+
 ActionScript 3.0 事件模型基于对象调度的概念。事件模型是面向对象的，可以进行优化以重复使用代码。dispatchEvent() 方法循环访问侦听器列表，并对各个注册的对象调用事件处理函数方法。然而，事件模型的一个缺点是可能要在应用程序的生存期内创建许多对象。  
 假设您必须从时间轴调度一个事件来指示动画序列的末尾。要实现此通知，您可以从时间轴中的特定帧调度一个事件，如以下代码所示：
-dispatchEvent( new Event ( Event.COMPLETE ) );
+
+	dispatchEvent( new Event ( Event.COMPLETE ) );
+
 Document 类可以使用以下代码行侦听此事件：
-addEventListener( Event.COMPLETE, onAnimationComplete );
+
+	addEventListener( Event.COMPLETE, onAnimationComplete );
+
 虽然此方法是正确的，但使用本机事件模型与使用传统的回调函数相比，速度更慢且占用的内存更多。必须创建 Event 对象并为其分配内存，而这会降低性能。例如，当侦听 Event.ENTER_FRAME 事件时，将在各个帧上为事件处理函数创建一个新事件对象。在捕获和冒泡阶段 （如果显示列表很复杂，此成本会很高） ，显示对象的性能可能会特别低。
 
 ## 减少CPU使用
@@ -362,7 +371,9 @@ addEventListener( Event.COMPLETE, onAnimationComplete );
 		} 
 	}
 
+![](images/13-7.png?raw=true)
 与键盘交互的影片剪辑
+
 单击 “ 删除 ” 按钮后，将从显示列表中删除该影片剪辑：
 
 	// Show or remove running boy