Teaching QML

Getting Started with QML on eSOMiMX6

Published on February 21, 2018

QML is a declarative language that allows user interfaces to be described in terms of their visual components and how they interact and relate with one another. It separates the declarative UI design and the imperative programming logic. It also supports writing business logic code and UI handlers in JavaScript.

This article guides you to develop your first QML application for eSOMiMX6.

How about a simple Hello World application for your first QML application on eSOMiMX6.

The application basically has an Image component and a text. The core QML Component of the application is MouseArea using which the input events like click, double-click, press, long press, etc can be handled.

You’ve got the power to create your own QML components from the existing ones. ApplicationHeader and ImageButton are such custom QML components by e-con Systems that are reused in all the eSOM++ sample Qt/QML applications.

The UI can be modified using the Design Tool. You can use the Form Editor or the Text Editor of Qt Quick Designer in the Design mode to develop the application.

Full source code for the Hello World application is available on e-con Systems developer site.

Please refer our previous articles on How to setup Qt creator for eSOMiMX6 devices and How to build, deploy and run Qt applications on eSOMiMX6 devices to build and run the application on eSOMiMX6 devices.

For further assistance and queries get in touch with sales@e-consystems.com

Try eSOM++ first QML application on eSOMiMX6

Qt-QML-Setup-Qt-Creator-Steps Application Guide

Qt-QML-Build-Deploy-Run-Steps Application Guide

Toolchain Package

Qt-Basics Samples Package Containing HelloWorld

Recently Published