前面的话

　　本文将详细介绍 cocos 中的常用组件

Sprite

【概述】

　　Sprite（精灵）是 2D 游戏中最常见的显示图像的方式，在节点上添加 Sprite 组件，就可以在场景中显示项目资源中的图片

　　点击 属性检查器 下面的 添加组件 按钮，然后从 添加渲染组件 中选择 Sprite，即可添加 Sprite 组件到节点上

【属性】

　　由上图所示，Sprite组件包含如下属性

　　Atlas表示Sprite显示图片所属的Atlas图集资源

　　Sprite Frame 表示Sprite使用的SpriteFrame图片资源

　　Type 表示渲染模式，Sprite组件支持四种渲染模式

　　　　1、普通模式(Simple)：该模式为默认值，修改尺寸会整体拉伸图像，适用于序列帧动画和普通图像

　　　　2、九宫格(Sliced)：修改尺寸时四个角的区域不会拉伸，适用于UI按钮和面板背景

　　　　3、平铺(Tiled)： Sprite尺寸增大时，图像不会被拉伸，而是会按照原始图片的大小不断重复，就像平铺瓦片一样将原始图片铺满整个 Sprite 规定的大小

　　　　4、填充(Filed)： 根据原点和填充模式的设置，按照一定的方向和比例绘制原始图片的一部分。经常用于进度条的动态展示

　　Size Mode 用来指定Sprite的尺寸模式

　　　　1、Trimmed： 该模式为默认值，表示会使用原始图片资源裁剪透明像素后的尺寸

　　　　2、Raw： 表示会使用原始图片未经裁剪的尺寸

　　　　3、Custom： 表示使用自定义尺寸，当用户手动修改过Size属性后，Size Mode 会被自动设置为 Custom

　　Trim表示节点约束框内是否包含透明像素区域，勾选此项会去除节点约束框内的透明区域，默认勾选

　　Src Blend Factor 表示图像混合模式

　　Dst Blend Factor 表示背景图像混合模式，与上面的属性共同作用，可以将前景和背景Sprite用不同的方式混合渲染

【声明】

cc.Sprite
cc.SpriteFrame

【使用】

this.node.getComponent(cc.Sprite).spriteFrame = '';

Label

【概述】

　　Label 组件用来显示一段文字，文字可以是系统字体，TrueType 字体或者 BMFont 字体和艺术数字，另外，Label 还具有排版功能

　　点击 属性检查器 下面的添加组件按钮，然后从添加渲染组件中选择Label，即可添加 Label 组件到节点上

【属性】

　　由上图所示，Label 组件包含如下属性

　　String 表示文本内容字符串

　　Horizontal Align 表示水平对齐模式，包括Left、Center、Right，默认为left

　　Vertical Align 表示垂直对齐模式，包括Top、Center、Bottom，默认为top

　　Font Size 表示字体大小

　　Line Height 表示行高

　　Overflow 表示文字排版模式，共4种

　　　　1、none： 该模式为默认值

　　　　2、clamp： 节点约束框之外的文字会被截断