Featured UI Components
In this Module, we present some important UI Components to be familiar with. The main usage areas of each of them are explained, and we also provide a link to the relevant article as well as an example setup / usage in our Showroom.
We assume familiarity with all basic UI Components such as Text Edit, Text, Date and Time Picker, Container, List and Tabs.
View Container
Reuse Views across other Views, or design your App with 1 main view (with menu) and multiple sub-views for the various pages.
Popover
Popovers are small popups, custom snackbars or rich tooltips, that may appear when the user clicks something. A good use case is a small help icon, opening a Popover on click such as . The Popover UI Component is opened/closed by using the Action Nodes Open Popover and Close Popover.
Radio Button
Let the user select a single Enumerated Type. The "Allow null" setting allows you to apply a selection "All" or "None" visible to the user.
Multi Select
Allow the user to select one or more entries in a droplist. The UI Component is connected to a Data Source and the Selected flag of the entries is toggled on/off when the users select the items in the Multiselect.
Chip Group
Same principle as a Multi Select, but the user may select one or more "Tiles" or "Chips" in a horizontal or vertical list. You may have "On Click" or "Delete" event handlers, and conditional styles. Works best for a small number of options.
Table
Multi-purpose UI Component. Much used in "internal" applications and administrative applications. It is an Excel-like UI Component with built-in features like search (in table), column-selector, filters and CSV-download. It also has a lot of setting for styling per column/cell, as well as conditional edit-mode.
Drawable Canvas
Draw signatures or draw freely using the Drawable Canvas. Much used for allowing users to store their signatures (as image files), in order to merge them into PDFs or Emails later.
Animated Component
A very simple way to add animations to your Applications. Should not be overused, but gives a nice touch to any Application.
Coded Component
Coded Component is an escape hatch when Appfarm Create does not provide you with the desired UI Component. You may use Coded Component for almost "anything". In fact, your whole App may just be 1 View with 1 Coded Component if you would like to code your whole App, but that is of course not recommended - it just highlights the possibilities.
We do not assume familiarity with the Javascript coding inside the Coded Component, but you should familiarize yourself with the possibilities and concepts.
Charts
Many charts exist in Appfarm Create, both Basic Charts and Advanced Charts. The general setup is much the same, but each chart comes with different settings. The settings will not be questioned in the Appfarm Professional Certification, but familiarity with the general setup of a Basic Line Chart is recommended reading and knowledge, as well as familiarity with the available Charts.
Documentation Article (basic line)
Showroom (also see other charts in sections Basic Charts and Advanced Charts)
Last updated