Come ruotare con facilitare la piattaforma Fallo.us

Question

Dì che ho una superficie collegata a un modificatore.Quindi ho impostato un ascoltatore per reagire per fare clic su eventi ruotando la superficie con un allentamento.Sto cercando che quando l'angolo di rotazione colpisce 2pi la superficie girerà rapidamente il modo sbagliato alla prossima posizione di rotazione.C'è un modo per rendere gli oggetti ruotare all'infinito con facilitare?

Answer 1

La questione dell'infinita allenante è un po 'sfocato, ma mi aspetto che il tuo aspetto di aggrapparti all'inizio e poi continua a continuare.Al fine di ridimensionare l'allentamento, quella parte deve essere finita.Quindi mi spezzerei in due (o tre se hai bisogno di una rampa giù) parti. Ecco il codice (è necessario elaborare la corrispondenza della velocità quando si modifica la transizione.)

/* globals define */
define(function(require, exports, module) {
    var Engine = require('famous/core/Engine');
    var Surface = require('famous/core/Surface');
    var StateModifier = require('famous/modifiers/StateModifier');
    var Transform = require('famous/core/Transform');
    var Easing = require('famous/transitions/Easing');
    var Modifier = require('famous/core/Modifier');
    var Transitionable = require("famous/transitions/Transitionable");

    function app() {

        var mainContext = Engine.createContext();

        var baseTime;
        var foreverFlag = false;

        var surface = new Surface({
            size: [20, 20],
            content: 'LearnFamo.us',
            classes: ['red-bg'],
            properties: {
                textAlign: 'center',
                lineHeight: '20px'
            }
        });

        function goForever() {
            baseTime=Date.now();
            foreverFlag = true;
        }

        var trans = new Transitionable(0);
        trans.set(Math.PI,
            {duration:5000, curve:Easing.inElastic},
            goForever
            );

        var surfmod1 = new StateModifier({
            align: [0.5,0.5],
            origin: [0.5,0.5]
        });

        var surfmod2 = new Modifier({
            align: [0.5,0.5],
            origin: [0.5,0.5]
        });
        surfmod2.transformFrom(
            function() {
                return Transform.rotateZ(foreverFlag?(Math.PI+Math.PI/1000 * (Date.now() - baseTime)):trans.get());
            }
        );

        mainContext.add(surfmod1).add(surfmod2).add(surface);
    }

    app();

});

.