diff --git a/ace/ace_standard/src/main/js/default/pages/imageAnimator/prop/index.js b/ace/ace_standard/src/main/js/default/pages/imageAnimator/prop/index.js index 39046252915761552d0d49c709f9240ad48ad01e..10f8111c8a03f93801b8238bd115f4d8913b8bca 100644 --- a/ace/ace_standard/src/main/js/default/pages/imageAnimator/prop/index.js +++ b/ace/ace_standard/src/main/js/default/pages/imageAnimator/prop/index.js @@ -180,19 +180,3 @@ export default { this.typeFillmodeNone = this.$element("typeFillmodeNone").getInspector() } } -/* - * typeImage : null, - typePredecode0 : null, - typePredecode2 : null, - typeIterationInfi : null, - typeIteration3 : null, - typeReverseTrue : null, - typeReverseFalse : null, - typeFixedsizeTrue : null, - typeFixedsizeFalse : null, - typeDuration3 : null, - typeDuration6 : null, - typeFillmodeForwards : null, - typeFillmodeNone : null, - - */ \ No newline at end of file diff --git a/ace/ace_standard/src/main/js/default/pages/imageAnimator/router/index.css b/ace/ace_standard/src/main/js/default/pages/imageAnimator/router/index.css index 4f34b584c4d5d3419a285809290365aa02f0e2ab..768389a861c9fd43802c69eb8c51a7a3ebaa59b9 100644 --- a/ace/ace_standard/src/main/js/default/pages/imageAnimator/router/index.css +++ b/ace/ace_standard/src/main/js/default/pages/imageAnimator/router/index.css @@ -411,11 +411,11 @@ background: repeating-linear-gradient(to right, rgba(255, 255, 0, 1) 30px,rgba(0, 0, 255, .5) 60px); } -.accessibility-container{ +.access-container{ flex-direction: column; } -.accessibility1{ +.access1{ height:20px; background-color: #321124; margin: 5px; diff --git a/ace/ace_standard/src/main/js/default/pages/imageAnimator/router/index.hml b/ace/ace_standard/src/main/js/default/pages/imageAnimator/router/index.hml index db5c4ad81e546cc4de9e0ae8d4f09b2f5ae58186..6ca58be74eeffbcbf2d697c8f748b267d2c6cc2e 100644 --- a/ace/ace_standard/src/main/js/default/pages/imageAnimator/router/index.hml +++ b/ace/ace_standard/src/main/js/default/pages/imageAnimator/router/index.hml @@ -213,7 +213,7 @@
-
+
无障碍 diff --git a/ace/ace_standard/src/main/js/default/pages/imageAnimator/router/index.js b/ace/ace_standard/src/main/js/default/pages/imageAnimator/router/index.js index 53f3a2ab4b08b2fb2f66e42ba87108027ca1c66c..1d719c4cd36c03dff7620f57f69a54e4a43ab425 100644 --- a/ace/ace_standard/src/main/js/default/pages/imageAnimator/router/index.js +++ b/ace/ace_standard/src/main/js/default/pages/imageAnimator/router/index.js @@ -13,6 +13,74 @@ * limitations under the License. */ +var options = { + duration: 1500, + easing: 'friction', + delay: 100, + fill: 'forwards', + iterations: 2, + direction: 'normal', +}; +var frames = [ + { + transform: { + translate: '-120px', + rotate:'10deg', + scale:0.2, + skew:'40deg' + }, + opacity: 0.1, + offset: 0.0, + width: '40%', + height:'20px', + backgroundColor:'#ff0000', + backgroundPosition:'10px 20px', + transformOrigin:'left top' + }, + { + transform: { + translateX: '0px', + translateY: '5px', + rotateX:'10deg', + rotateY:'10deg', + scaleX:0.5, + scaleY:0.7, + skewX:'22deg', + skewY:'30deg' + }, + opacity: 0.6, + offset: 2.0, + width: '60%', + height:'30px', + backgroundColor:'#ff00ff', + backgroundPosition:'15px 25px', + transformOrigin:'center top' + }, + { + transform: { + translateX: '100px', + translateY: '0px', + translateZ: '20px', + rotateX:'0deg', + rotateY:'0deg', + rotateZ:'30deg', + scaleX:1, + scaleY:1, + scaleZ:2, + skewX:'0', + skewY:'0', + skewZ:'30deg' + }, + opacity: 1, + offset: 0.0, + width: '100%', + height:'30px', + backgroundColor:'#ffff00', + backgroundPosition:'0px', + transformOrigin:'center center' + }, +]; + import prompt from '@system.prompt'; export default { data: { @@ -383,73 +451,7 @@ export default { functionTest3(event){ var function3 = this.$element('function3'); - var options = { - duration: 1500, - easing: 'friction', - delay: 100, - fill: 'forwards', - iterations: 2, - direction: 'normal', - }; - var frames = [ - { - transform: { - translate: '-120px', - rotate:'10deg', - scale:0.2, - skew:'40deg' - }, - opacity: 0.1, - offset: 0.0, - width: '40%', - height:'20px', - backgroundColor:'#ff0000', - backgroundPosition:'10px 20px', - transformOrigin:'left top' - }, - { - transform: { - translateX: '0px', - translateY: '5px', - rotateX:'10deg', - rotateY:'10deg', - scaleX:0.5, - scaleY:0.7, - skewX:'22deg', - skewY:'30deg' - }, - opacity: 0.6, - offset: 2.0, - width: '60%', - height:'30px', - backgroundColor:'#ff00ff', - backgroundPosition:'15px 25px', - transformOrigin:'center top' - }, - { - transform: { - translateX: '100px', - translateY: '0px', - translateZ: '20px', - rotateX:'0deg', - rotateY:'0deg', - rotateZ:'30deg', - scaleX:1, - scaleY:1, - scaleZ:2, - skewX:'0', - skewY:'0', - skewZ:'30deg' - }, - opacity: 1, - offset: 0.0, - width: '100%', - height:'30px', - backgroundColor:'#ffff00', - backgroundPosition:'0px', - transformOrigin:'center center' - }, - ]; + var animation = function3.animate(frames, options); animation.play()