Flow

Steve Ruiz

Open in Framer X

Flow

@steveruizok

Stacked navigation flow for Framer X. Navigate from code, navigate from targets, keep fixed elements and more.

🐬 Read the docs

🐬 Download the example

Changelog

21/10

Removes red background color. 🤷‍♂️

30/8

Adds support for responsive windows.

30/7 Fixes some deep breaks!

21/7 Adds docs, new artwork, cleans up props.

27/6 Rewrites how pages are shown. In previous versions the component would unmount components that don’t need to be shown, keeping track of only the current and previous page. In this version, all pages in the stack are kept until removed from the stack.

For example, if we navigate to PageA, PageB, and then PageC, all three pages will remain mounted. If we show previous, our position will move to PageB but PageC will remain mounted. If we then navigate from PageB to PageA, PageC will be unmounted and we’ll mount a second (but separate) PageA.

This is useful for cases where pages have content (such as form fields, scroll positions, or interaction states) that need to be maintained. Traveling “back” to a previously visited screen will restore that screen exactly as the user had left it.

This is also useful for navigation flows that load different versions of the same page, such as articles with different content but the same “page”. (More on this in future updates).

Opening Package in Framer X...

Don’t have Framer X yet?Start your Free Trial

By using our website, you agree to the use of cookies as described in our  Privacy Policy —
I Agree