App Builder

On Teta, you can build and customize your application from the App Builder page. This page consists of all the UI elements (also known as widgets) that you can use while building your app’s layout.

To get you familiarized with the App Builder page, we have divided it into four main sections.

1. Tree Area

The Tree Area shows the structure of your application, where you can add elements by selecting them from the Widget Panel on the canvas.

2. Mobile Area

The Mobile Area displays the mobile device screen where you can preview the items added to the Tree Area and resize the device screen to check the responsiveness of your app.

3. Properties Panel

The Properties Panel allows you to customize the selected widget by modifying the Properties like visibility, padding, alignment, and various widget-specific properties (e.g. Text of a TextField widget). You also have some other tabs for specifying Actions (like onTap and onSubmit).

4. Tool Bar

The Tool Bar contains buttons to test your entire app by running or previewing it. You can also view/download the app code and publish your app directly to the store.

5. Widget Panel

You will find all the user interface elements or components in the Widget Panel. There’s also a search bar to quickly search for any widget.