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

What is Framer? Join the Community
Return to index
Marcelo Eduardo Oliveira
Posted Jul 31 - Read on Facebook

I think I've asked this before, but the answer was not what I needed, so here it goes again (with the risk of being dumb but who cares? ;)

Has anyone used states to change a couple of properties that would be inside the style object?

ex:

menuItems[i].states.add
docked:{color:"black"}
selected:{color:"white"}
normal:{color:"gray"}

switching to selected state, won't change the text color to white...

Am I doing something completely off here? I was just using the same property name as in the constructor... : /

5 Comments

Jon Gold

I think you can only change animatable properties - http://framerjs.com/docs.html#animations "properties being animated (x, y, width, height, opacity, scale, rotation, filters)" (at least that's my reading of it)

Andreas Wahlström

you'll probably have to do it using the did/willswitch event. eg. imageLayer.states.on Events.StateWillSwitch, (oldState, newState) -> if newState is "third" then imageLayer.color = "red"

Koen Bok

Jon is right, but I made it more complex by adding "proxied" css properties that are numeric but take a string like borderRadius etc. I should probably spend some time to clear this up. For now it's easiest to remember: if it takes a number (so not a string) you can animate it (and it will work in the state machine).

Aaron Carámbula

Any chance colors will come? They animate with CSS transitions and are numbers after all :)

Marcelo Eduardo Oliveira

Thanks Koen... I was not even thinking of animating the changes, but then it would be completely inconsistent.

Read the entire post on Facebook