Media

The media component may be a picture from the web, or a picture or video from a File field.

Example

ExampleImage4

ExampleSigning1

Button

The button component lets customised actions to be run when it’s clicked.

Configuration

Under properties, set the Target section and optionally an icon and caption.

Under Form rules set the Behavior and Run on click, e.g.,

Behavior
set :backgroundcolor = 'green'
Run on click
call save()

For tables, actions will only work for the selected record.

Example

ButtonComponents

Icon

The icon component is more or less a button but can give a cleaner look to the form.

Example

IconComponent

Link

A link text that will take you to another form within the application, to a website or to run a report, among other actions.

In case this component uses Table data, but is placed outside the section, the property Target section must be provided.

Example

BackToHomeForm

Label

Text to have on the form as a legend, as a column in Table section with an IQL caption, or as a frame for embedded YouTube videos.

Example

WelcomeToOurSystem

Rectangle

The Rectangle component is used for highlighting an area of the form.

Custom the rectangle’s color, transparency and behavior as wished.

The Rectangle component is not rendered in mobile mode.

Map

The map component is a map where coordinates can be marked to identify the location referred by a record.

Example

MapComponent

Map layer

Additional layers of location markers can be overlaid onto a Map component. It’s makes it possible to display data from a GeoJson field.

Map layer editor

A layer overlaid onto a Map component that includes tools to draw areas or edit existing ones. It’s makes it possible to store GeoJson data in a note field.

Calendar

The calendar component is a full-size calendar with day, week or month-view.

Example

Example,Calendar

Chart

The chart component can display three different types of charts: Bar, Line and Pie charts. The chart can then be saved as a PNG with a simple click.

Clicking a legend hides the respective series, while double-click shows only that one.

Example

Chart1

Chart2

IQL Chart

A more advanced way to configure a chart with IQL. It gives further options that is not possible in a regular chart.

Example

IQLChart1

IQLChart2

Meter

The meter component is a tool to display a number field as a partion of an interval, e.g., exceptional for displaying progress.

Set the color of the bar depending on the value. E.g.,

if NumberField >= 100 then
    set :textColor = 'green'
end

Hoovering over the bar displays the exact value.

Example

Meter

Gantt chart

The Gantt chart component helps to schedule project tasks and tracks progress over time. Read more about the Gantt chart here.

Example

GanttChart

Barcode and QR code

The Barcode and QR code component gives the option to track and store information of goods or items, or for storing regular URL’s of webpages.

Example

BarCode

QRCode

Search box

The search box is an input box to search data. It is configured in the following steps.

  1. Add an input field to the canvas, e.g., Text or Number field.

    1. Under Properties, set Datasource to a desired variable, e.g., @searchForNames.

  2. Add a Section that displays records, e.g., a Table or a Repeater section.

    1. Under Form rules, set the filter to display the records that matches the variable. E.g.,

      Name contains @SearchForNames

A simple search box is thereby made.

Example

SearchBox1

SearchBox2