Titanium Community Questions & Answer Archive

Question

Events aren't Async?

Wotcha,

Trying to apply an animation to an image - a simple rotate.
If I press & hold on the screen and then move my finger slowly across the screen - I don't see the animation applied until I lift my finger.

vRotate.addEventListener('click', function(e) {

    if (imageMap == false) {

        var oldMoveData = {x:-1, y:-1};
        var mRotateSmall = Ti.UI.create2DMatrix().rotate(rotateStepSize);
        var anRing = Titanium.UI.createAnimation();

        imageMap = Ti.UI.createImageView({url:"app://images/ring.png"});
        // Add the transform to the image from the outset
        mRotateSmall = mRotateSmall.rotate(0);

        anRing.transform = mRotateSmall;
        anRing.duration = 1;
        anRing.autoreverse = false;
        anRing.reverse = false;
        anRing.delay = 0;

        imageMap.animate(anRing);

        /**
         * Handle animation of the ring
         */                
        winDashboard.addEventListener('touchmove', function(e)
        {            
            if (imageMap) {
                // We have an image to work with
                if (oldMoveData.x == -1) {
                    // Only need to check if x or y is -1
                    oldMoveData.x = Math.abs(e.x+0);
                    oldMoveData.y = Math.abs(e.y+0);
                } else {

                    var deltaX = oldMoveData.x - Math.abs(e.x+0);
                    var deltaY = oldMoveData.y - Math.abs(e.y+0);

                    if (deltaX<0) {
                        // Moving from left to right
                        rotateDegrees = rotateDegrees - rotateStepSize;
                    } else {
                        rotateDegrees = rotateDegrees + rotateStepSize;
                    }

                    //Handle wrap-around
                    rotateDegrees = Mod(rotateDegrees,360);
                    debug("Rotate: " + rotateDegrees);

                    oldMoveData.x = Math.abs(e.x+0);
                    oldMoveData.y = Math.abs(e.y+0);
                }
                // Apply the new rotation angle
                mRotateSmall = mRotateSmall.rotate(rotateDegrees);

                // Build the transform
                anRing.transform = mRotateSmall;
                anRing.duration = 1;
                anRing.autoreverse = false;
                anRing.reverse = false;
                anRing.delay = 0;
                //Apply the animation
                imageMap.animate(anRing);
            }
            //Debug
            debug("Raw:");
            debug(e);        
            debug("Delta:" + deltaX +","+deltaY);
        });

        winDashboard.add(imageMap);
    } else {
        winDashboard.remove(imageMap);
        imageMap = false;
    }        
});

Is there a way to force the animation to be applied once the animate method is called? - either by freeing up cycles (ala doEvents) or some kind of async invoke?

Android 2.1/Ti 1.3

Answer 1

Hi,

Try changing the event type from 'click' to 'touchstart'

I haven't tried it, but I'm pretty sure the 'click' event doesn't fire until the 'touchend' (ie: after the click)

hth

ps: also, I have a feeling it might complain about having an eventListener inside another eventListener block.

Answer 2

The click is attached to a view for turning on/off the image that's animated.

I can always rejig the code but the animated is happening so the code itself is working. It appears that calling animate is blocked until the handler for the event finishes. The animate method returns - but the application of the animation isn't happening until the touchmove function finishes.

Answer 3

I kinda have a work around for this - which while a little kludgy works.
Essentially I attach (from the parent window) an event handler to the window which will contain the animation.
Then in the touchmove event - I fire the event to the handler, after which I run the animation.

Essentially:

winDashboard.fireEvent('animateTest',{a:'test'});
imageMap.animate(anRing);

Titanium Community Questions & Answer Archive

We felt that 6+ years of knowledge should not die so this is the Titanium Community Questions & Answer Archive

Events aren't Async?

3 Answers