How to add Elements

In the User Interfaces page you can create UIs. To create functional UIs, you need to add elements. Inputs are elements that allow the app-maker to gain information from end-users, and the end-user to interact with the app.

Before moving forward, read our https://aurachain.atlassian.net/wiki/spaces/HowTo/pages/180388257/Interface+Builder article to make sure you understand the fundamentals of UIs.

Note: We recommend you add inputs to Containers. Learn more here.

 

Make use of Elements

The Interface Builder provides a multitude of both standard and specialized components to allow full flexibility in defining the content and functionality. These elements are available on the left-side menu. They can be added to the selected container when clicking on them.

API BUTTON

Performs a specific API-based command.

ATTACHMENT DOWNLOAD

Downloads a previously uploaded attachment.

BUTTON

Performs a specific command.

CHART

Render data on a candle chart. Map data or use setValue. Accepted formats:

  • [[Timestamp], [O, H, L, C]

  • [Timestamp, O, H, L, C]

  • [{ x: date, y: [O,H,L,C] }]

CSV EXPORT

Add the option to export CSV.

GENERATE DOCUMENT

Generates a document that has a template attached to it.

IMAGE

Add a static image.

METAMASK BUTTON

Performs Smart Contract transactions with the aid of the Chrome MetaMask add-on.

MEDIA CAPTURE

Take a photo or record video using the device’s camera.

AUTOCOMPLETE

Provides suggestions while typing into the field.

CHECKBOX

Allows the user to make or multiple choices.

DATA TABLE

Populated with data received via an API-Call, with highly customizable columns with data import/export capabilities. Imported data via this grid can be persisted in the data-model.

DATE-TIME PICKER

The end-user can pick the date and time.

DROP-DOWN LIST

Expands a list from where the user can select a value.

DROP-DOWN LIST MULTIPLE

Expands a list where the user can select multiple values.

LABEL

Short read-only text.

OPTIONS LIST

List a Catalog as options.

PARAGRAPH

Multi-line read-only text.

SLDIER

Control that allows the user to choose a value from a preset interval.

TEXTAREA

Add plain text on multiple lines.

TEXTBOX

Add plain text on a single line.

TOGGLE

Toggles change the state of a single option. Toggles can be switched on or off by pressing or swiping them.

UPLOAD

Allows the user to upload files and any kind of attachments to the server.

WEBSOCKET

Listen to events and display the last entry.


Related Articles: