Canvas View
The Canvas is where your app takes shape in RapidNative. Instead of working with isolated screens, you can see and arrange the entire journey of your app — from login screens to dashboards to settings.
Zoom controls let you focus on the details of one screen or step back to view the bigger picture of your flow.
Why the canvas matters
- Visualize complete user journeys, not just screens
- Easily spot gaps, missing links, or flow bottlenecks
- Make edits directly on the canvas without losing context
- Switch between detail view and overview mode with zoom
How to use the canvas
Start a new project
Click New Canvas from the dashboard.
Generate screens
Use a prompt, upload an image, or sketch with Excalidraw.
View your flow
Screens appear on the canvas, connected as a journey.
Zoom in
Focus on one screen to refine layout, text, or styles.
Zoom out
See how all screens connect across the app.
Screen toolbar
Each screen on the canvas has a small toolbar above it for per-screen actions:
- Reload. Refresh the live preview of that screen — useful when you want to re-run effects or recover a stuck render without regenerating the screen.
- View code. Open the screen's React Native source inline so you can read or copy the code that's actually rendering.
- Select whole screen. Select the entire screen as a single target so your next prompt or quick edit applies to the whole layout instead of a specific element.
- More menu (⋮). Edit the file name inline or delete the file. See File Management for details.
Example workflow
- Zoomed in → You’re editing a login form, tweaking the input field with QuickEdit.
- Zoomed out → You see the login → dashboard → settings path, ensuring the flow makes sense before generating more screens.
Key benefits
- Keep control of both details and big picture
- Design and test flows instead of isolated screens
- Faster alignment for PMs, designers, and devs — everyone can see the journey clearly