This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Peter Kubin
Posted Apr 18 - Read on Facebook

hi there, i am looking for an example or the building blocks for an idle animation (tick counter and global event listener 'on.anyUIEvent'). any help is greatly appreciated.

6 Comments

Marc Krenn

Listening to ALL possible events would be overkill - there must be a smarter way to do this. Could you share your file (or an abstraction of it) with us so we can take a look?

Peter Kubin

hi marc, thanks a lot for your replay... i just thought, i cracked it, but now i am getting a strange animation behavior if i fire multiple tap events during timeout.
http://share.framerjs.com/cpp6n9e0c2su/

Marc Krenn

http://share.framerjs.com/2ecyeofhirqt/

Still not perfect as it skips the "next state" under certain circumstances but you should be able to iron this one out :)

Peter Kubin

hi marc, cool!.. many thanks! yeah next state seems to take its own direction if triggered by too many events. i will try to write an animation state array to step through, which might be more solid.

Peter Kubin

regarding the timeout reset, i would need a global event listener, since the animation should not fire as long as the user is interacting with the application. thererfore 'document.addEventListener "tap", (event) =>' worked quite well for me. would this be good practice or do you recommend another solution?

Marc Krenn

Hey, whatever works for you! :D

I personally would replace "layerA.onTouchStart ->" with "Framer.Device.screen.onTouchStart ->" to make it global.

Read the entire post on Facebook