From c9c263dc43ad90f95f24a036cee9e6b47afb596c Mon Sep 17 00:00:00 2001 From: skyouc Date: 星期六, 21 十二月 2024 18:44:20 +0800 Subject: [PATCH] 新建盐城德森项目 --- uni_modules/uni-transition/components/uni-transition/createAnimation.js | 256 +++++++++++++++++++++++++------------------------- 1 files changed, 128 insertions(+), 128 deletions(-) diff --git a/uni_modules/uni-transition/components/uni-transition/createAnimation.js b/uni_modules/uni-transition/components/uni-transition/createAnimation.js index 5f54365..55a7663 100644 --- a/uni_modules/uni-transition/components/uni-transition/createAnimation.js +++ b/uni_modules/uni-transition/components/uni-transition/createAnimation.js @@ -1,128 +1,128 @@ -// const defaultOption = { -// duration: 300, -// timingFunction: 'linear', -// delay: 0, -// transformOrigin: '50% 50% 0' -// } -// #ifdef APP-NVUE -const nvueAnimation = uni.requireNativePlugin('animation') -// #endif -class MPAnimation { - constructor(options, _this) { - this.options = options - this.animation = uni.createAnimation(options) - this.currentStepAnimates = {} - this.next = 0 - this.$ = _this - - } - - _nvuePushAnimates(type, args) { - let aniObj = this.currentStepAnimates[this.next] - let styles = {} - if (!aniObj) { - styles = { - styles: {}, - config: {} - } - } else { - styles = aniObj - } - if (animateTypes1.includes(type)) { - if (!styles.styles.transform) { - styles.styles.transform = '' - } - let unit = '' - if(type === 'rotate'){ - unit = 'deg' - } - styles.styles.transform += `${type}(${args+unit}) ` - } else { - styles.styles[type] = `${args}` - } - this.currentStepAnimates[this.next] = styles - } - _animateRun(styles = {}, config = {}) { - let ref = this.$.$refs['ani'].ref - if (!ref) return - return new Promise((resolve, reject) => { - nvueAnimation.transition(ref, { - styles, - ...config - }, res => { - resolve() - }) - }) - } - - _nvueNextAnimate(animates, step = 0, fn) { - let obj = animates[step] - if (obj) { - let { - styles, - config - } = obj - this._animateRun(styles, config).then(() => { - step += 1 - this._nvueNextAnimate(animates, step, fn) - }) - } else { - this.currentStepAnimates = {} - typeof fn === 'function' && fn() - this.isEnd = true - } - } - - step(config = {}) { - // #ifndef APP-NVUE - this.animation.step(config) - // #endif - // #ifdef APP-NVUE - this.currentStepAnimates[this.next].config = Object.assign({}, this.options, config) - this.currentStepAnimates[this.next].styles.transformOrigin = this.currentStepAnimates[this.next].config.transformOrigin - this.next++ - // #endif - return this - } - - run(fn) { - // #ifndef APP-NVUE - this.$.animationData = this.animation.export() - this.$.timer = setTimeout(() => { - typeof fn === 'function' && fn() - }, this.$.durationTime) - // #endif - // #ifdef APP-NVUE - this.isEnd = false - let ref = this.$.$refs['ani'] && this.$.$refs['ani'].ref - if(!ref) return - this._nvueNextAnimate(this.currentStepAnimates, 0, fn) - this.next = 0 - // #endif - } -} - - -const animateTypes1 = ['matrix', 'matrix3d', 'rotate', 'rotate3d', 'rotateX', 'rotateY', 'rotateZ', 'scale', 'scale3d', - 'scaleX', 'scaleY', 'scaleZ', 'skew', 'skewX', 'skewY', 'translate', 'translate3d', 'translateX', 'translateY', - 'translateZ' -] -const animateTypes2 = ['opacity', 'backgroundColor'] -const animateTypes3 = ['width', 'height', 'left', 'right', 'top', 'bottom'] -animateTypes1.concat(animateTypes2, animateTypes3).forEach(type => { - MPAnimation.prototype[type] = function(...args) { - // #ifndef APP-NVUE - this.animation[type](...args) - // #endif - // #ifdef APP-NVUE - this._nvuePushAnimates(type, args) - // #endif - return this - } -}) - -export function createAnimation(option, _this) { - if(!_this) return - clearTimeout(_this.timer) - return new MPAnimation(option, _this) -} +// const defaultOption = { +// duration: 300, +// timingFunction: 'linear', +// delay: 0, +// transformOrigin: '50% 50% 0' +// } +// #ifdef APP-NVUE +const nvueAnimation = uni.requireNativePlugin('animation') +// #endif +class MPAnimation { + constructor(options, _this) { + this.options = options + this.animation = uni.createAnimation(options) + this.currentStepAnimates = {} + this.next = 0 + this.$ = _this + + } + + _nvuePushAnimates(type, args) { + let aniObj = this.currentStepAnimates[this.next] + let styles = {} + if (!aniObj) { + styles = { + styles: {}, + config: {} + } + } else { + styles = aniObj + } + if (animateTypes1.includes(type)) { + if (!styles.styles.transform) { + styles.styles.transform = '' + } + let unit = '' + if(type === 'rotate'){ + unit = 'deg' + } + styles.styles.transform += `${type}(${args+unit}) ` + } else { + styles.styles[type] = `${args}` + } + this.currentStepAnimates[this.next] = styles + } + _animateRun(styles = {}, config = {}) { + let ref = this.$.$refs['ani'].ref + if (!ref) return + return new Promise((resolve, reject) => { + nvueAnimation.transition(ref, { + styles, + ...config + }, res => { + resolve() + }) + }) + } + + _nvueNextAnimate(animates, step = 0, fn) { + let obj = animates[step] + if (obj) { + let { + styles, + config + } = obj + this._animateRun(styles, config).then(() => { + step += 1 + this._nvueNextAnimate(animates, step, fn) + }) + } else { + this.currentStepAnimates = {} + typeof fn === 'function' && fn() + this.isEnd = true + } + } + + step(config = {}) { + // #ifndef APP-NVUE + this.animation.step(config) + // #endif + // #ifdef APP-NVUE + this.currentStepAnimates[this.next].config = Object.assign({}, this.options, config) + this.currentStepAnimates[this.next].styles.transformOrigin = this.currentStepAnimates[this.next].config.transformOrigin + this.next++ + // #endif + return this + } + + run(fn) { + // #ifndef APP-NVUE + this.$.animationData = this.animation.export() + this.$.timer = setTimeout(() => { + typeof fn === 'function' && fn() + }, this.$.durationTime) + // #endif + // #ifdef APP-NVUE + this.isEnd = false + let ref = this.$.$refs['ani'] && this.$.$refs['ani'].ref + if(!ref) return + this._nvueNextAnimate(this.currentStepAnimates, 0, fn) + this.next = 0 + // #endif + } +} + + +const animateTypes1 = ['matrix', 'matrix3d', 'rotate', 'rotate3d', 'rotateX', 'rotateY', 'rotateZ', 'scale', 'scale3d', + 'scaleX', 'scaleY', 'scaleZ', 'skew', 'skewX', 'skewY', 'translate', 'translate3d', 'translateX', 'translateY', + 'translateZ' +] +const animateTypes2 = ['opacity', 'backgroundColor'] +const animateTypes3 = ['width', 'height', 'left', 'right', 'top', 'bottom'] +animateTypes1.concat(animateTypes2, animateTypes3).forEach(type => { + MPAnimation.prototype[type] = function(...args) { + // #ifndef APP-NVUE + this.animation[type](...args) + // #endif + // #ifdef APP-NVUE + this._nvuePushAnimates(type, args) + // #endif + return this + } +}) + +export function createAnimation(option, _this) { + if(!_this) return + clearTimeout(_this.timer) + return new MPAnimation(option, _this) +} -- Gitblit v1.9.1