用js实现帧动画

来源：互联网发布：如何给php代码加密编辑：程序博客网时间：2024/04/28 09:34

__setAnimate: function (data) {var _this = this;if(data.wraperId != _this.m_id) {return;}switch(data.key){case 'animate':_this._animate = _this._animate || {_speed:1.0};_this._animate.frames = data.value;var img = _this.m_viewElement.querySelector('#animate');if(!img) {img = document.createElement('img');img.setAttribute('draggable', 'false');img.id = 'animate';img.style.position = 'absolute';img.onload = function (event) {eventCenter.raise('NOTIFY_OBJECT_SIZE_CHANGED');};_this.m_viewElement.appendChild(img);}_this._animate.play = function(index){//数据异常时终止播放if(!_this._animate || !_this._animate.frames || _this._animate.frames.length<1){return;}//切换到指定帧var switchFrame = function(index){var resInfo = gameEditor.getProject().getFileInfoByID(_this._animate.frames[index].resourceID);var url = global.TAG_BASE_URL_RES_HOST + resInfo.resURL.substr(1);img.setAttribute('src', url);}//收到停止命令if(!_this._animate._play){//停止播放时回到第一帧switchFrame(0);return;}//播放到最后一帧时if(index>=_this._animate.frames.length){index = 0;var loop = true;//TODOif(!loop){//如果不循环播，回到第一帧并停止播放_this._animate._play = false;switchFrame(0);return;}}switchFrame(index);var delayTime = _this._animate.frames[index].duration * 1000 / _this._animate._speed;index++;setTimeout(_this._animate._playfunction(index),delayTime);};_this._animate._playfunction = function(index){return function(){if(_this._animate){_this._animate.play(index);}}};if (_this._selected) {_this._animate._play = true;_this._animate.play(0);};break;case 'speed':_this._animate = _this._animate || {_speed:1.0};_this._animate._speed = data.value;if (_this._animate._speed == 0 ) {//如果速度是0_this._animate._play = false;}else if (_this._animate._speed > 0) {_this._animate._play = true;_this._animate.play(0);};break;case 'delete':_this._animate = null;var img = _this.m_viewElement.querySelector('#animate');if(img) {_this.m_viewElement.removeChild(img);}eventCenter.raise('NOTIFY_OBJECT_SIZE_CHANGED');break;}},

为了保证点击的时候播放

__cancelSelectObject: function (id) {    var _this = this;    _this._selected = false;if(_this._animate){_this._animate._play = false;}    },    /**     * [__selectObject 设置选中和取消方法]     * @param {String} id [description]     */    __selectObject: function (data){    var _this = this;    if(data.id != _this.m_id) {return;}_this._selected = true;if(_this._animate && _this._animate.play &&  !_this._animate._play ){_this._animate._play = true;_this._animate.play(0);}    },

0 0