Chapter 4 - Interactions & navigation
In this chapter, you’ll learn how to create multi-page navigation in your app using interactive components. This includes creating a new page and setting up a button that, when clicked, navigates the user to that new page.
5 min
What You’ll Learn
- How to create a new page in your project.
- How to add a button that users can click to trigger navigation.
- How to use the FlowButton logic to handle actions behind the scenes.
- How to configure the “Navigate” action component to link to your desired page.
Overview of the Process
- Create a New Page
- In your project, add a new page where you’d like users to be redirected.
- Add a Button to Your Existing Page
- Drag and drop a Button component onto your main screen. This will act as the navigation trigger.
- Use the FlowButton Tab
- When the button is added, a new FlowButton tab will appear (e.g., flowButton1).
- Configure Navigation Logic
- Go to the FlowButton tab.
- Drag and drop the “Navigate” component from the Actions section.
- Configure it to point to the new page you created.
- Preview Your App
- Click Preview.
- Try clicking the button — it should now redirect you to the new page smoothly.