In our ‘going live’ post about our new responsive engine, some users asked us for the ability to add transitions on elements’ dimensions. We are happy to report that last week we added this ability, so now you can add transitions to a container’s width, height, and margin properties.
This applies to containers in row, column, or fit-to-parent layout.
If a container is not fixed width/height, you can only add transitions on the container’s maximum and minimum width/height because these are the properties that control the element’s dimensions.
If the container is fixed width/height, a transition can be applied to that property directly
By fixed width/height in this case, I mean that the checkbox ‘Make this element fixed width/height’ in the Layout tab has been selected.
For ‘Max width/height’ transitions, an upper bound on the width/height must be set for the transition to show up. It cannot be ‘Inf’.
@andrew.king, I noticed that margin transitions don’t seem to work with floating groups. Is that by design, or should I submit a bug report? The margin does change, but it’s not animated.
EDIT
Aha! A bit of sleuthing in dev tools has revealed that margins are “faked” for floating groups (presumably due to their fixed position). It’s actually the inset (left, top, bottom, right) properties that are used for the “offset”. When I specified one of those properties for the transition in dev tools, it worked fine.
I therefore suspect it’s just an oversight. I shall submit a report.
This is amazing!
report.
