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

What is Framer? Join the Community
Return to index
Brad Wrage
Posted Dec 16 - Read on Facebook

Hi all, I'm using states to stagger in a handful of items into view using something like "box_1.animate "a", delay: 0.4", box_1.animate "b", delay: 0.6" ect. However, now running into the problem of the state not cycling back to default as opposed to just using box1.states.next(). Can anyone help me get the state change back to the default while using the time delay? I'm guessing I have to create a separate event to handle the switch back to default.

7 Comments

David Louie

box_1.animate "default", delay: 1.5

Junha Kang

you can do like David Louie did
but that will only animate like "default" state but not actually change the state

to actually chagne the state , you can do something like

box_1.states.switch("default")

or if u don't want it to animate

box_1.states.switchInstant("default")

David Louie

Junha Kang states.switch() and states.switchInstant() have been deprecated. I think it still works but there's a new api to work w/ states. Check the doc. https://framerjs.com/docs/#layer.states

David Louie

Brad Wrage - proud of you.

Junha Kang

David Louie you are right !
sorry , i think i confused it with

box_1.animate(box_1.states.default)

Niels van Hoorn

You can use stateCycle to cycle animated through states, and it also takes animation options as argument.
So you can do
box_1.stateCycle(delay: 0.4)
box_2.stateCycle(delay: 0.5)
Etc.

Niels van Hoorn

layer.states.next() is also a deprecated API that has been replaced by layer.stateCycle(). To read more on what has changed, you can read our upgrade guide: https://github.com/koenbok/Framer/wiki/Animation-Upgrade-Guide

Read the entire post on Facebook