Skip to main content
All CollectionsViz FlowicsTransitions
List Pagination transitions
List Pagination transitions
Updated over 10 months ago

Transition scope

For List Pagination transitions, the elements capable of being orchestrated together after a page change, are all the elements that are descendants of the Dynamic Content List that fires that pagination event.

When you select a List Item or any of its children elements, the Transition Tree will show all of them, including the List Item.

Transition phases and timing

The phases here will refer to the Leaving and Entering items. This means that when a pagination is triggered, the currently drawn List Items will leave the scene, and the new ones will enter, with new data and values.

Keep in mind that, unlike Overlay IN/OUT transitions —where one phase starts after the other one finishes—, on Pagination transitions the two phases will play at the same time, i.e.: the current items will leave while the new items are entering.

This behaviour allows you to create overlapping animations given the case you want to do so. And if you want the current items to finish leaving the scene before the new items appear, it's just a matter of giving more delay to the new ones.

To facilitate this kind of synchronization, you will find that when toggling between phases, the Animations of the current phase will be normally displayed, and the Animations of the other phase will be displayed in an onion–skin style, with lower contrast and a dashed outline. This will be useful as a visual reference for the durations and delays of the whole List Pagination transition.

Previewing

The prev and next buttons on List Pagination Transitions lets you quickly preview the animations you just edited, by triggering a page change on the List that contains all of those elements.

It works exactly as if you select the List and play with the prev/next buttons over its Cycle settings.

Did this answer your question?