Learn what Felgo offers to help your business succeed. Start your free evaluation today! Felgo for Your Business

Felgo Apps Components Reference

Every Felgo app begins with a single App component defined as the root of the QML tree. Every app then usually includes a navigation item and some AppPage items.

For a short introduction on how to use Felgo Apps components please refer to our Getting Started guide.

Felgo Plugins for Apps (and Games)

Felgo Plugins add platform-specific features and 3rd party SDK integration available from QML.

AdMob Plugin

Integrate with AdMob to monetize and promote your apps & games with ads.

Amplitude Plugin

Integrate with Amplitude to get insights into your app's usage.

Apple Sign In Plugin

Let your users authorize with their Apple ID account on iOS devices.

Chartboost Plugin

Integrate with Chartboost to monetize and cross-promote your games with ads.

Facebook Plugin

Integrate with Facebook to help you build engaging social apps and get more installs.

Firebase Plugin

Add Google's Firebase for user authentication and access to the Firebase Realtime Database.

Flurry Plugin

Integrate with Flurry to get insights into your app's usage.

GameCenter Plugin

Integrate with GameCenter to send your games' highscores to Apple Game Center on iOS devices.

GoogleCloudMessaging Plugin

Integrate with Google Cloud Messaging Push to send cross-platform push notifications and increase your users' engagement.

HockeyApp Plugin

Integrate with HockeyApp for beta distribution & crash reports.

Notification Plugin

Schedule native local push notifications in your app.

OAuth 2.0 Plugin

Let your users authorize with external OAuth 2.0 providers.

OneSignal Plugin

Integrate with OneSignal Push to send cross-platform push notifications and increase your users' engagement.

Soomla Plugin

Integrate with Soomla to offer in-app purchases and a virtual economy model within your app.

Wikitude Plugin

Integrate with Wikitude to create augmented reality apps.

Note: For testing the plugins on mobile and source code examples, see the Felgo Plugin Demo. When you develop your own app and want to add plugins to it, a Felgo license is required.

App Essentials

App

Top-level component of a Felgo application containing all other components

AppFlickable

A Flickable with a preset rebound animation for a native scrolling experience

AppPage

A single page within an application

FlickablePage

A Page with included AppFlickable and AppScrollIndicator

ListPage

A Page item with an AppListView as a single child

App Controls

AppActivityIndicator

An intermediate spinning progress indicator

AppButton

A button with a default raised and flat button style

AppCard

A material style card

AppCardSwipeArea

Adds Tinder-like swipe feature to a component

AppCheckBox

A checkbox with a platform-specific styling for iOS and Android

AppIcon

An item for displaying icons from an icon font

AppImage

An image with a default source

AppListItem

Basic item for any type of lists, with text, images, icons etc

AppListView

A ListView providing a native AppScrollIndicator, an empty view and swipe gestures for its list delegates

AppMap

Displays a map view with the current user position

AppModal

A modal dialog that covers the whole application

AppOverlay

Displays a custom component as a modal overlay

AppPaper

A sheet of paper with shadow

AppRadio

A radio with a platform-specific styling for iOS and Android

AppRangeSlider

A slider control with two handles to set a range

AppScrollIndicator

A native styled scroll indicator for usage with AppFlickable

AppSlider

A slider control with one handle

AppSwitch

An on/off button-like control

AppTabBar

A tab bar with Theme-based iOS and Android styles

AppTabButton

A tab button to be used with AppTabBar for Theme-based iOS and Android styled tabs

AppText

A styled text control

AppTextEdit

A multi-line TextEdit with a given placeholder text

AppTextField

A single-line TextField input control

AppTextInput

A single-line TextInput with a given placeholder text (deprecated)

AppToolTip

Shows a tool tip overlay for a target item

DatePicker

Allows to pick a date, time or interval with flickable tumblers

Dialog

A dialog with custom content and one or two buttons

FloatingActionButton

A material-design styled floating action button

IconButton

A button with an icon as visual representation

ImagePicker

A GridView to show and select multiple photos from the device

InputDialog

Global object for displaying standard user interaction dialogs

NativeDialog

Global object for invoking native system dialogs

PageControl

Displays page indicators and allows switching to the previous or next page

PictureViewer

A modal, full-screen picture viewer component

PullToRefreshHandler

A helper adding a pull-to-refresh control to an AppListView

RoundedImage

An image item with rounded corners and an optional border

SearchBar

A search bar with native styling for iOS and Android based on the Theme settings

SectionSelect

A control that allows to jump to specific sections of a ListView

SimpleRow

A ListView delegate item with two labels and an optional image

SimpleSection

A ListView delegate item for displaying sections in a list view

SwipeButton

A button with a default style to be used together with SwipeOptionsContainer

SwipeOptionsContainer

A ListView delegate container to implement swipeable rows within a ListView

TextFieldRow

A row with a label and an AppTextField

VisibilityRefreshHandler

A helper item for handling data reload actions as soon as the item becomes visible

App Navigation

ActivityIndicatorBarItem

Displays an AppActivityIndicator inside a NavigationBar slot

AppDrawer

A drawer opened from the left or right edge of the screen with custom content

ButtonBarItem

Base type for NavigationBar items which can be clicked

IconButtonBarItem

Displays a clickable AppIcon inside a NavigationBar slot

Navigation

A navigation control for using platform-specific navigation modes

NavigationBar

A navigation control for displaying a header, back navigation and optional items

NavigationBarItem

Base type for items to be placed in the left or right slots of NavigationBar

NavigationBarRow

Container item to display multiple NavigationBarItems within a NavigationBar

NavigationItem

Base type for items inside Navigation

NavigationStack

Provides a stack of Pages with navigation

StackViewDelegate

A delegate used by NavigationStack for loading transitions

TabControl

A tabbed navigation control

TextButtonBarItem

Displays a clickable text inside a NavigationBar slot

App Styling

IconType

A global object containing the possible Icons

RippleMouseArea

A mouse area that automatically adds a ripple effect on android devices

StyleSimpleRow

A default style for the SimpleRow type that uses the Theme::listItem configuration

StyleSimpleSection

A default style for the SimpleSection type that uses the Theme::listSection and Theme::listSectionCompact configuration

Theme

A global object for defining app-wide styling attributes

ThemeAppButton

Defines style of AppButton items

ThemeAppCheckBox

Defines the style of AppCheckBox items

ThemeAppRadio

Defines the style of AppRadio items

ThemeColors

Defines app-wide color theming

ThemeDialog

Defines style of Dialog items and inherited components

ThemeNavigationAppDrawer

Defines style of the Navigation's AppDrawer

ThemeNavigationBar

Defines style of the NavigationBar

ThemeNavigationTabControl

Defines style of the navigation TabControl

ThemeSimpleRow

Defines the default appearance of SimpleRow list items

ThemeSimpleSection

Defines the default appearance of list sections based on the SimpleSection type

ThemeSimpleSectionCompact

Defines the default appearance of list sections based on the SimpleSection type if SimpleSection::compactStyle is used

ThemeTabControl

Defines style of the TabControl

App Utility

DateFormatter

Convenience methods for formatting date and time

FpsMeter

Utility item to display the current frames per second and a FPS timeline graph

Storage

Storage item provides a persistent and offline storage for arbitrary key-value pair data

VersionCheckDialog

Provides a convenient way to notify users about an updated version of your app

VersionCheckLoader

Provides a convenient way to check if an updated version of your app is available

Bluetooth Low Energy Components

These components handle Bluetooth Low Energy communications. You can find more info and examples here: Use Bluetooth Low Energy

BluetoothLeCharacteristic

Bluetooth Low Energy characteristics handle data read and write

BluetoothLeDevice

Bluetooth Low Energy Device, discovered by the BluetoothLeManager component

BluetoothLeManager

Bluetooth Low Energy device discovery management

BluetoothLeService

Bluetooth Low Energy Service, groups Characteristics

Context Components

The Context Components are global properties that are available in all QML files. They can be used to open native dialogs and browsers, network requests, dynamic QML component creation and provide system information.

FileUtils

Singleton provides file operations like reading, writing and listing files

NativeUtils

Singleton allows opening native message boxes, input dialogs and browsers

Qt Context Objects

The Qt Context Objects page contains information about often-used functionality of the Qt element, for network requests and useful JavaScript elements.

SpeechToText

Singleton allows to convert recorded spoken audio into text

ZeroConf

Singleton allows discovering network services via Bonjour/ZeroConf

Felgo & Qt Multimedia Components

These components allow to play audio and video files.

BackgroundMusic

Element allows playing long-lasting and looping background sound in wav, mp3 or ogg file format

GameSoundEffect

Element allows playing short-lasting and looping sound effects in wav file format

YouTubeWebPlayer

Embedded video player based on the YouTube Iframe-Player API

In addition to the above list, also these Qt Quick Components are useful:

SoundEffect Provides a way to play sound effects in QML
MediaPlayer Add media playback to a scene
Video A convenience type for showing a specified video
VideoOutput Render video or camera viewfinder
Camera Access viewfinder frames, and take photos and movies
QtMultimedia Provides a global object with useful functions from Qt Multimedia

Networking Components

These components handle network activities.

HttpImageUtils

Provides functionality for scaling and cropping an image file before uploading it with HttpRequest

HttpNetworkActivityIndicator

Convenience type to check pending requests when using HttpRequest

HttpRequest

Allows to implement networking features based on the SuperAgent library from VisionMedia

Promise

Offers an API similar to the Promises API in ES2017

XMLHttpRequest Element

The XMLHttpRequest object can be used to asynchronously obtain data from over a network.

PDF Utils

These components allow to view or work with PDF files.

PDFPage Image Provider View PDF pages as image

View Model Components

JsonListModel for JSON Data Sources

JsonListModel allows to transform your JSON data into a QML ListModel for usage with e.g. an AppListView.

JsonListModel

A proxy view model for JSON data sources

SortFilterProxyModel for Sorting and Filtering

SortFilterProxyModel is an implementation of QSortFilterProxyModel conveniently exposed for QML. You can use it to apply filter and sorting settings to your QML ListModel items.

AllOf

Filter container accepting rows accepted by all its child filters

AnyOf

Filter container accepting rows accepted by at least one of its child filters

ExpressionFilter

Filters row with a custom filtering

ExpressionRole

A custom role computed from a javascript expression

ExpressionSorter

Sorts row with a custom javascript expression

Filter

Base type for the SortFilterProxyModel filters

FilterContainer

Abstract interface for types containing Filters

FilterRole

A role resolving to true for rows matching all its filters

FilterSorter

Sorts rows based on if they match filters

IndexFilter

Filters rows based on their source index

JoinRole

Role made from concatenating other roles

LocaleAwareSorter

Sorts rows based on a locale aware comparison of a source model string role

ProxyRole

Base type for the SortFilterProxyModel proxy roles

RangeFilter

Filters rows between boundary values

RegExpFilter

Filters rows matching a regular expression

RegExpRole

A ProxyRole extracting data from a source role via a regular expression

RoleFilter

Base type for filters based on a source model role

RoleSorter

Sorts rows based on a source model role

SingleRole

Base type for the SortFilterProxyModel proxy roles defining a single role

SortFilterProxyModel

Allows to apply filter and sorting settings to QML ListModel items

Sorter

Base type for the SortFilterProxyModel sorters

SorterContainer

Abstract interface for types containing Sorters

StringSorter

Sorts rows by comparing a source model string role with a localized collation algorithm

SwitchRole

A role using Filter to conditionnaly compute its data

ValueFilter

Filters rows matching exactly a value

QML Native Code Components

The QML Native Code Components allow to interact with the native platform.

You can show native views as part of your QML scene. You can also call native APIs directly from QML.

NativeClass

Represents a platform-native class

NativeObject

Represents a platform-native object

NativeObjectUtils

Allows you to interact with objects native to the mobile platform

NativeView

Allows to instantiate and display platform-specific views and widgets

NativeViewBinding

Defines the platform specifics for NativeView

Native App Integration

The Native App Integration components allow to integrate Felgo in native applications.

FelgoAndroid

Initializes the Felgo runtime from a native Android application

FelgoAndroidActivity

Integrates Felgo in a native Android application

FelgoAndroidFragment

Shows Felgo QML content in a native Android application

FelgoAndroidView

Shows Felgo QML content in a native Android application

FelgoIOS

Initializes the Felgo runtime from a native iOS application

FelgoIOSView

Shows Felgo QML content inside a native iOS application

Most useful QML Components

Item The Item is the most basic of all visual items in QML.
Animation The Animation element is the base of all QML animations lasting for a fixed time.
Timer The Timer item triggers a handler at a specified interval.
Loader The Loader item allows dynamically loading an Item-based subtree from a URL or Component.

See here for a full list of all QML components. There is also a list of all QML APIs by module including modules like connectivity (via Bluetooth, NFC or WebSockets), sensors, location or webview.

Qt_Technology_Partner_RGB_475 Qt_Service_Partner_RGB_475_padded