Page & Canvas
The Page, the unit of a screen, and the design space
2 min read
A Page is a single screen shown to the user, and it is the basic unit of design in Layerz. An app is made up of several Pages; you design each Page independently and then connect them to complete a single app.
Creating a Page
Create a new Page from the add menu in the left panel.
- Add Empty Page — An empty Page
- Add List Page — A Page with a List already set up
The Page you create appears in the list in the left panel, and selecting it lets you edit it on the center canvas.
Canvas
The canvas is the space where you design a Page. You build the screen by dragging and dropping components from the UI Library onto an iPhone-sized Page. You can move around freely by zooming and scrolling, and you can change the device (iPhone/iPad, landscape/portrait) from the top toolbar.
Navigation Bar Settings
At the very bottom of every Page is the Page itself, where you configure the Navigation Bar. Select the Page and look at the Inspector to configure the following:
- Whether to show the Navigation Bar (it's on by default for new Pages)
- Title Text (if not specified, the Page's Title is used automatically)
- Whether to show a Large Title
- Appearance — Default / Blurred / Opaque / Transparent
- Tint Color
When you show the Navigation Bar, you can set the menu buttons (Right Items / Left Items) to place on it. For each menu, you can define its appearance and connect an event or create a submenu.
After creating several Pages, connecting them with navigation in an Action Flow or with a Tab Bar lets you build the same flow as a real app.