Comment on page
UI
Appfarm Create's UI designer is a visual tool for structuring and designing the user interface of an app. Simply drag and drop UI components and connect them to data, app flow, and business logic to rapidly compose an interactive interface.
Good to know
The UI/UX crash course in our Showroom contains best practices for UI and UX design, and how to make clean and user-friendly apps.
The UI designer consists of four main sections:
- 1.
- 2.
- 3.
The UI designer in Appfarm Create
To add a component to a view, either:
- Click the component to add it as a child of the selected element in the view tree, or
- Drag and drop the component into either the view tree or the layout designer.
In the Views pane is a list of all the user interfaces, or views in the app. There are three types of views in Appfarm Create:
To add a view to an app, at the top of the Views pane, either:
- Click the plus icon to immediately add a new standard view, or
- Click the arrow icon and select the type of view you'd like to add.
Views consist of UI components that can be in a tree structure by nesting them inside Containers. Branches of the tree can be expanded and collapsed. Select a component to highlight the preview in the layout designer and show the available properties in the properties pane. Right-click a component in the tree, or use keyboard shortcuts to perform operations like copy, paste, and delete.
By default, your most recent (visited) views or dialogs are displayed at the top of the Views pane ("Recent"). You may turn this feature off from the Preferences in the rocket menu. You may also right-click a view or dialog to pin it as a Favourite at the top of the Views pane.
The selected view, dialog, or drawer is displayed in the layout designer. You can adjust the settings for responsive design and preview the app in different screen sizes.
The properties pane displays the available properties for the selected UI component over four tabs:
- Component properties
- Style properties
- Conditional style properties
- Motion properties
Last modified 9mo ago