Skip to content


Volt MX Iris

Widget Programmers' Guide

Volt MX Iris is a powerful yet easy-to-use integrated development environment (IDE) for developing, building, testing, debugging, and deploying mobile applications for multiple platforms—all from a single code base. To learn how to use Volt MX Iris, see the Volt MX Iris User Guide.

Volt MX Iris allows you to create applications visually by dragging widgets from the Widget Library, and dropping them onto a form or other container object, quickly creating the user interface for a mobile application. These widgets have properties that can be set in Volt MX Iris, and can also be set and modified by code you write as part of your application.

The Volt MX Iris Widget Programmers' Guide describes each widget, its properties, and how you can write JavaScript code to change properties and control the behavior of widgets within your application.

Widgets Overviews

This section of the Volt MX Iris Widget Programmer's Guide provides general information on the use of Widgets within your Iris applications.

Widgets are visual components in Volt MX Iris that are used to build application user interfaces quickly and with a minimum of custom code. Although most widget properties can be set using the Volt MX Iris IDE, some properties need to be set and managed from custom JavaScript code. This guide describes how this is done, and lists the properties and events you will use to interact with Volt MX Iris widgets.

Widgets are small chunks of re-usable code which include graphical user-interface elements that scale gracefully depending on the power and resolution of your mobile device targets. Some widgets function as containers to hold other widgets.

VoltMXwidgets also include support for platform specific properties. These platform specific properties allow your apps to have a native look and feel on each platform.

Widgets are categorized as Containers, Basic, and Advanced based on the behavior and characteristics of the widgets.

  • Basic Widgets: These widgets are used for basic functions on a form. They are the most commonly used widgets in an application design. These widgets are components that act independently of the Container Widgets.
  • Container Widgets: These hold container, basic or advanced widgets within them.
  • Advanced widgets: Used to achieve advanced interaction within an application. You can use these widgets along with basic widgets to achieve a complex interaction design.

Widgets List

Widget Comments Category
Alert A pre-configured dialog box that pops-up with a message such as a confirmation or an error. Basic Widgets
App Menu Usually a menu bar displayed at the bottom of a form in an app. Basic Widgets
ARRenderer Helps you to implement augmented reality in your app. Advanced Widgets
Browser content in the context of your application without navigating away from the application or opening the native browser from your application Advanced Widgets
Button A rectangle or rounded rectangle with a descriptive caption in its center. Use a button to trigger actions, such as navigating to a form or interacting with a dialog box. Basic Widgets
Calendar Presents a calendar to the user so that the user can pick one or more dates. Basic Widgets
Camera Controls the on-device camera for taking pictures and videos. Advanced Widgets
CheckBoxGroup Displays a group of related checkboxes so that the user can select one or more items from the group. Basic Widgets
ComboBox Presents a drop-down list to the user allowing them to select a single item Basic Widgets
CordovaBrowser content in your application without navigating away from the application or opening the native browser. Use the CordovaBrowser widget to port your web or Apache Cordova (PhoneGap) app to Volt MX Iris. Advanced Widgets
DataGrid Presents a tabular view of data to the user. Basic Widgets
FlexContainer Allows you to arrange multiple widgets in horizontal, vertical or free-form order. You can only add the FlexContainer to a Flex form. Container Widgets
FlexForm A FlexForm is the top most container widget and you can place any number of widgets on it, Navigating between forms is a common way to structure the functionality of an app. Container Widgets
FlexScrollContainer Scrollable UI container form that allows more items to be displayed in a list than allowed by screen size. Container Widgets
Image Displays a graphic (local or remote) from a PNG file. Basic Widgets
Label Shows non-editable text on a form. Basic Widgets
ListBox Presents a drop-down list to the user and enables the user to select one or more items. Basic Widgets
Map Provides your app with the capability to display predefined locations (latitude and longitude) on an onscreen map. Advanced Widgets
MLCamera Provides your app with image recognition and classification capability. Advanced Widgets
NativeContainer Customizable widget that enables you to wrap native device functionality in a widget that you can then instantiate and use in your JavaScript app. Container Widgets
PDFView Displays the content of the PDF URL in your app. Advanced Widgets
Phone Allows your phone app to call a phone number. Advanced Widgets
PickerView Uses a spinning wheel metaphor to display multiple sets of values and allows you to select a single combination of values. Advanced Widgets
RadioButtonGroup Presents a group of radio buttons to the user and enables the user to select one. Basic Widgets
RichText Displays a string in rich text format. Basic Widgets
SegmentedUI A widget that can be used for menus and grouped lists and that consists of multiple segments (rows or records), each segment (row or record) possibly having multiple child widgets. Advanced Widgets
SignatureCapture Enables your app to capture a signature on a form and save it as an image for easy uploading. Advanced Widgets
Slider Allows users to select a value from a range of values by moving an indicator. Basic Widgets
SlidingContainer Implements a hamburger menu. Use a SlidingContainer widget to create a top-level navigation experience that adapts to different screen widths. Advanced Widgets
Switch Presents two mutually exclusive choices or states. Advanced Widgets
TabPane Tabbed UI form. Container Widgets
TextArea An editable widget that enables users to enter multi-line text. Basic Widgets
TextBox An editable text component that is used to obtain an input from a user. Basic Widgets
Video Allows your app to play video files captured using the device's camera, videos from app resources, and from servers/websites within a form. Advanced Widgets

For a more hands-on approach on the functionality of the various widgets and APIs provided by Volt MX AppPlatform. import and preview the Kitchen Sink app by using Volt MX Iris.

Contact Us

We welcome your feedback on our documentation. Write to us at technical questions, suggestions, comments, or to report problems on VoltMX's product line, contact