CreatorPrimer|精灵变身

在Cocos Creator中使用率最高的非精灵(Sprite)莫属了， 在游戏中我们经常会遇到将一张图片替换成另一张图片的情况，或者是在不同状态时来回切换图片。其实这个功能一点都不难，相信大多数人也都会，特别是对程序员同学来说，更是小菜一碟，但是！回头检视一下编写的代码，能让非编程人员使用上吗？如果不能的话，这篇教程对你和你的伙伴就非常有价值了。

1. SpriteIndex组件

我们这里设计一个SpriteIndex组件，使用组件的index属性来控制Sprite组件的spriteFrame属性，从而得到图片变换的能力。

//SpriteIndex.js

cc.Class({
    extends: cc.Component,
    //编辑器属性，只在编辑状态有效
    editor: CC_EDITOR && {
        requireComponent: cc.Sprite,     //要求节点必须有cc.Sprite组件
    },

    properties: {
        spriteFrames: [cc.SpriteFrame],  //定义一个SpriteFrames数组
        _index: 0,                       //以下划线“_”开始的为私用变量
       
        index: {                         //index属性控制图片切换
            type: cc.Integer,            //定义属性为整数类型
            //这次没使用notify方式实现属性值的变化监听，改用getter/setter方式
            get() {                           
                return this._