Tour the App Builder
In this section, we’ll walk you through the development environment so you can easily find what you are looking for.
The App Builder consists of a toolbar, canvas, interactions panel, and two side panels — left and right.
The toolbar is where you’ll find App User Management (IAM), Version Control, Preview, and Publish options. You’ll also be able to rename your app and zoom in/out on the canvas
The canvas is your window into the structure of your app. In the canvas you will design your app’s interface and house all of your data nodes.
The Interactions panel is where you will define your Interactions. When an element is selected, you'll be able to add actions to its supported events.
The left panel contains 3 tabs: Layer, Data, and Theme.
- 1.Layer tab: Under the Layer tab, you’ll see a list of all pages in your app as well as an Element navigator for each page. From the hierarchy, you can select elements by clicking on them and rearrange elements by dragging and dropping.
- 2.Data tab: The Data tab will list all of your existing data nodes. This is also where you’ll be able to set up your Data Store variables.
- 3.Theme tab: The theme tab lets you choose and change color themes for your app. You'll find "color" and "color on" for each option, which represents the main color and text color on top, respectively. For example, with the below theme, a button will have a default blue color with white text on top.
The right panel contains 2 tabs: Config and Create.
- 1.Config tab: Config is where you can set up configurations for your pages, apps, and elements. This includes, properties, styles, and interactions.
- 2.Create tab: Under Create, you’ll be able to create new pages, elements, and data nodes by dragging and dropping from the panel to the canvas.
Last modified 5mo ago