QML


  • *Image courtesy of KDE.org I had the opportunity to attend Akademy 2020, KDE’s annual world summit — a free, non-commercial event organized by the KDE community. In case you’re not familiar with KDE, it’s an international team cooperating on development and distribution of free, open source…

    Blog
  • In the world of Qt, the QTimeline object is intended to help control animations. It is an object that acts somewhat like a timer: it has a duration and an interface for start/stop/resume functions. But a QTimeline object does more. It has a value that changes from beginning to end and has an update…

    Blog
  • In the final installment in our QML Controls from Scratch series, this time we will implement an English-only Keyboard. There are typically three ways to display a virtual keyboard in a QML app: 1. Qt Virtual Keyboard 2. Use the keyboard that ships with the operating system (e.g. on Windows 10…

    Blog
  • In this installment of our QML Controls from Scratch series we'll implement a ProgressBar, which is often used to indicate the progress of a long-running operation from 0 to 100%. ProgressBar is a read-only control so it's pretty simple, save for the math required to compute…

    Blog
  • Continuing our QML Controls from Scratch series, this time we will implement a PieChart. PieChart's public API consists of just a title and a list of points (whose x, y, and color members are identical to that of BarChart). Since PieChart is a Canvas, it makes heavy use of the Context2D API to…

    Blog
  • Continuing our QML Controls from Scratch series, this time we will implement a LineChart. LineChart is similar to BarChart but with two exceptions: (1) it requires x axis tick marks and (2) it uses Canvas to draw the line curve. This is our first control to use Canvas, which is a rectangular area…

    Blog
  • Continuing our QML Controls from Scratch series, this time we will implement a BarChart. Many people who need charts in their application wonder if they need a charting library, but it turns out to be not that difficult to write a custom autoscaled chart. The public interface consists of a title…

    Blog
  • QML provides a powerful and flexible framework for developing user interfaces (UI). The basic elements provided are low level, so you typically need to build up the components of your UI into widget-like controls. Creating a set of common QML controls can greatly reduce the overall…

    Blog
  • Continuing our QML Controls from Scratch series, this time we will implement a DatePicker, which allows the user to select any calendar date (year, month, day). DatePicker's public interface consists of a set() function and a clicked() signal. A function set() is used instead of a property since…

    Blog
  • Continuing our QML Controls from Scratch series, this time we implement a TimePicker, which allows the user to select a time in terms of hours, minutes and am/pm. TimePicker's public interface consists of a set() function, a clicked() signal, and an interval property (to specify the…

    Blog
  • Continuing our QML Controls from Scratch series, this time we will implement a Table (i.e. a two-dimensional matrix of strings supporting an arbitrary number of rows and columns). The Table consists of two main parts: header and data. Consequently, it has two public properties (headerModel and…

    Blog
  • Continuing our QML Controls from Scratch series, this time we will implement Tabs. They are used to expand limited screen real estate by providing two or more "tabs" that divide the user interface into screens (content), only one of which is shown at a time. The Tabs control only renders the…

    Blog
  • Continuing our QML Controls from Scratch series, this time we implement PageDots. They are often used in conjunction with ListView.SnapOneItem to indicate what "page" is currently shown. The public properties are page and pages to indicate the current page and total number of pages…

    Blog
  • div.body h2 {margin-top:30px;} Continuing our QML Controls from Scratch series, this time we will implement a Dialog that supports an arbitrary number of Buttons (and we reuse our Button control). Its public API includes the text to show, an array of strings for the buttons, and a clicked()…

    Blog
  • Continuing our QML Controls from Scratch series, this time we will implement a Spinner, also known as a busy indicator. Spinner indicates the progress of a long-running operation when the progress percentage is unknown. (For known percentages, we'd use a ProgressBar.) Spinner…

    Blog
  • In part one of this blog series we explained the concept of model-view design and explained the need for a more advanced process for handling dynamic data. In part two, we illustrate the power of Qt Quick’s model-view-delegate framework with an example application that downloads mp3 files from…

    Blog
  • The speed on your car’s dashboard, the temperature on your cabin’s thermostat, the heart rate on your wearable device. These values originate from an external source, populate a model, and then make their digital way to a display. The task of the GUI developer is to write code that fetches this…

    Blog
  • In a previous blog post I described how to use Qt's facility for input masks and validators in widget-based applications. In this installment I'll look at the corresponding support in QML. Input Masks The QML TextInput and TextField types have similar support for input masks as the…

    Blog
  • As a developer, you're probably familiar with the concept of Design Patterns [1], but you may not have heard of the term anti-pattern. First coined by Andrew Koenig, the term anti-pattern or AntiPattern [2] refers to a commonly used programming practice that has proven to be ineffective,…

    Blog
  • Best Practices in Qt Quick/QML - Part 3 from ICS  

    Basic page
  • Continuing our QML Controls from Scratch series, this time we will implement a vertical ScrollBar, which is the vertical line segment you often see on the right of a touch user interface as you scroll vertically through a list of items. ScrollBar is quite a bit different than the other controls…

    Blog
  • QML by Design from ICSNetwork on Vimeo. QML by Design Webinar from ICS

    Basic page
  • Continuing our QML Controls from Scratch series, this time we will implement a Slider. The Slider has value, minimum, and maximum public properties. Slider is implemented with a single MouseArea that covers the entire control and utilizes drag to handle the user sliding the "pill" (the…

    Blog
  • Continuing our QML Controls from Scratch series, this time we will implement a Switch. Switch is similar to CheckBox with the exception that it has a slidable pill (implemented with a MouseArea and drag property) and no text property. A Switch can be toggled either by tapping or dragging. Switch…

    Blog
  • Continuing our QML Controls from Scratch series, this time we'll implement a CheckBox. We'll also get RadioButton almost for free. CheckBox is similar to Button with the exception that it holds checked/unchecked state in the checked property. All QML properties have an associated *Changed…

    Blog
  • QML provides a very powerful and flexible framework for developing user interfaces. The basic elements that are provided are low level, so you typically need to build up the components of your user interface into widget-like controls. Developing a set of common QML controls can greatly reduce the…

    Blog
  • Happy New Year! In previous blogs I have covered installing Qt and Qt Creator on Windows and on Linux using the Qt installer and pre-built binaries. In this post, aimed at developers with novice-level Qt skills, we'll look at how you can build Qt yourself from source code…

    Blog
  • As 2016 draws to a close, I'd like to take a look back at some of the significant events of the past year that are relevant to the Qt framework and the ecosystem around it. Qt Releases Starting in 2016, Qt 4 was officially at end-of-life status and no longer supported. The last release was Qt 4.8…

    Blog
  • My recent blog post covered how to set up Qt and Qt Creator on a Windows 10 system. In this post I'll look at how to configure a Linux system for Qt desktop development. Since the set up process on Linux is almost identical to that on Windows, rather than repeat the information I refer…

    Blog
  • Feedback from our recent Qt for Beginners webinar series indicated a need for some basic tutorials for beginners. If you struggle with initially getting Qt set up for development with the Qt Creator IDE and a C++ compiler, this post is for you.  I'll walk you step by step through the…

    Blog
  • Integrated Computer Solutions (ICS), a leader in Qt consulting, custom software development and user experience design, is proud to offer four tactical pre-conference training courses on October 18th at the 2016 Qt World Summit in San Francisco. Whether you’re new to Qt or a…

    Blog
  • Qt Gamepad is a Qt module that supports the use of gamepad hardware. Gamepad is the term used to refer to input devices with buttons, directional controls (which may be digital joypads or analog joysticks), and sometimes keys for keyboard input. Used on video game consoles, they are also…

    Blog
  • Yocto(1) is a software framework for embedded Linux systems. We've looked at it in previous blog posts(2). It forms the basis of many embedded Linux distributions, including The Qt Company's boot2qt that is part of their commercial product Qt For Device Creation(3).Knowledge of Yocto is a very…

    Blog
  • Download the entire webinar series. In QML, I have a Text item with wrapMode: Text.Wrap but the text isn't wrapping. What am I doing wrong? You need to set the width of the Text element, either directly using the width: property or by using anchors. Please refer to slide 3 of the presentation…

    Blog
  • Qt Quick (QML) provides user experience (UX) designers and Qt developers the ability to collaborate and create rich, intuitive and compelling user interfaces for applications – quickly. QML is a collection of technologies that can build modern and fluid interfaces for mobile phones, tablets,…

    Basic page
  • Thank you for registering for Qt for Beginners Part 4 - Doing More - On-Demand Video An email with a link to the on-demand video will be emailed to you. You can also access the video now by clicking here.

    Basic page
  • Download the entire webinar series. Do the Qt Quick Controls 2 include all the capabilities of Qt Quick Controls 1? While they are similar, there are differences between the controls offered and the APIs. The Qt documentation does a good job of describing the differences. See http://doc.qt.io/qt-…

    Blog
  • Thank you for Registering for the Qt for Beginners Part 3 - QML and Qt Quick On-Demand Video Please check your email for a link to the on-demand video. You can also Watch the video now.

    Basic page
  • Qt for Beginners Part 3 - QML and Qt Quick from ICSNetwork on Vimeo. Qt for beginners part 3 qml and qt quick from ICS

    Basic page
  • Download the entire webinar series. What is Qt's take on T2S applications? Assuming this refers to TARGET2-Securities, the European securities settlement engine, I don't know of anything relevant in Qt except possibly the Qt Purchasing API which supports In-App Purchases, but could potentially…

    Blog
  • As a developer, there are a number of useful tools that you always want to have in your arsenal for testing and debugging. This includes debuggers, memory checkers and performance profilers. In this blog post I would like to present some information about a profiler tool that I feel deserves more…

    Blog
  • Some Qt licensing changes were recently announced (1) by The Qt Company. Software licensing can be a complex and confusing issue, and I've already seen some misunderstandings on the mailing lists and forums. Therefore, I thought it would be timely to give some of my thoughts on the changes and what…

    Blog
  • Looking for a New Year's resolution for 2016? Official support for Qt version 4 came to an end in December 2015. Qt version 5 first came out in 2013 and is currently at version 5.5.1, with the 5.6.0 release coming early this year. Qt 5.6.0 will be the first LTS (Long Term Support) release,…

    Blog
  • My last blog post on the Raspberry Pi was written last April, when I covered the release of the Raspberry Pi 2. Since then, a number of things have happened in the Raspberry Pi ecosystem and I thought it was an appropriate time for another update. Here is a list of some of the events that, in…

    Blog
  • Download the Qml-Runtime-Reload ZIP file Disclaimer: Example code is intended only to express concepts and design patterns, and as such should not be used in a production environment.

    Basic page
  • In this blog post, we'll continue the series on Qt Tips and Tricks. This time I'll present some general advice on working with Qt, based on the experience of ICS developers. Bug Tracker If you are having a problem with Qt, the Qt Bug Tracker (1) is a useful resource to check for known bugs…

    Blog
  • In this blog post, I'll present a few tips and tricks for using Qt of which you may not be aware. These are small topics that I didn't feel justified an entire blog post of their own and were collected by polling the ICS Qt consulting team. Qt Extras There are platform-specific features available…

    Blog
  • Inspired by Halloween, I'd like to present a list of ten "scary" mistakes using Qt. Based on the wide experience of ICS with Qt consulting projects, I have provided a list of errors that can doom any project. 1. Waiting too long to test on hardware One of Qt's strengths is its…

    Blog
  • Sometimes an application needs to use different assets, such as graphics images or QML files, depending on the platform that the application is running on. One way to do this is with conditional code at compile time using the C++ pre-processor (i.e. #ifdefs). It can also be done with conditional…

    Blog
  • In this blog post, we'll take a brief look at one of the newest Qt modules, Qt3D, which was introduced in Qt 5.5.0. What is Qt3D? Qt3D is a new Qt module that provides support for 2D and 3D rendering. It also provides a generic framework for supporting simulations that go beyond just rendering,…

    Blog
  • In Part 1 of this series we looked at some of the programming languages other than C++ that could be used with the Qt framework. Let's continue our discussion, looking at some more languages. OCaml Caml is a dialect of the ML programming language family. OCaml, originally known as Objective…

    Blog
  • This blog post presents a short example program that illustrates how to use OpenGL and Qt in a scene graph. The two main goals are to show how the scene graph can be used, and more importantly, how to incorporate your own OpenGL code as part of the scene graph (as opposed to overlaying them). The…

    Blog
  • Basic page
  • Basic page
  • According to the book C++ GUI Programming with Qt 4 (1), the first public version of Qt was uploaded to the ftp site sunsite.unc.edu on May 20, 1995. This was the first public release of Qt and was identified as version 0.90. It was announced six days later on the comp.os.linux.announce Usenet…

    Blog
  • The Raspberry Pi 2 computer, released in February 2015, is the latest generation of Raspberry Pi hardware. It is a significantly faster machine than the original Raspberry Pi, with a new Broadcom BCM2836 system on a chip that has a quad-core ARM Cortex A7 CPU running at 900 MHz. The GPU is a…

    Blog
  • Intel® In-Vehicle Solutions Proof of Concept - ICS High Level Design Document  Connected Technology Demand for connected devices in automobiles is accelerating as mobile ecosystems are maturing. The ability for automakers to differentiate in an increasingly competitive environment…

    Blog
  • Thank you for your request. Please check your email for the downloadable PDFs.

    Basic page
  • I am a strong proponent of quick references or "cheat sheets" as an aid for recalling often-used information. In my career, I have created many work-related reference cards for colleagues and for my own personal use as well as for hobbies such as electronics and retro computing…

    Blog
  • A previous blog post (1) described how we've been using Google Analytics at ICS to collect usage information for a Kiosk application. In this second blog post, I'll present more technical information about how to use Google Analytics from C++ code and how Qt makes this very easy to implement.…

    Blog
  • A consulting project I worked on recently needed to display an interactive PDF document in the style of Adobe Reader on a touchscreen device running embedded Linux using Qt and QML. I have been working with Qt for nearly ten years and had not come across this requirement before, so of course I…

    Blog
  • Representing a significant milestone towards the next Qt release, the alpha version of Qt 5.4.0 came out this week. Qt 5.4.0 will include a number of interesting new features. In this blog post, I will briefly mention just a few of the highlights. QtWebEngine, the replacement for QtWebKit that I…

    Blog
  • With touchscreen-based systems such as tablets, smart phones and embedded devices, there is often a need for a virtual or on-screen keyboard. Qt itself does not provide a virtual keyboard and I am often asked for recommendations on approaches for a virtual keyboard. I thought this would…

    Blog
  • It's summertime here in the Northern hemisphere, and many people are on vacation (I just got back from a week off, myself). Despite that, we are very busy at ICS with consulting projects and preparing for the upcoming Qt Developer Days (1) conferences to be held in Berlin and San…

    Blog
  • The Qt 5.3 release made a lot of "under the hood" improvements to the internals of the Qt printing system. There were also some changes visible at the API level. One of the more noticeable changes was to add enhancements to the QPrinterInfo class. In this blog post, I'll go over this class and…

    Blog
  • A new feature in Qt version 5 is an executable program similar to qmlscene that can execute QML files. It is sometimes referred to as the QML Tooling or QML Run-time, although both of these terms are sometimes used to refer to other aspects of QML. A few colleagues mentioned to me that…

    Blog
  • Perhaps you have been trying to do more with QML than just using the basic elements like rectangles, text and images, or maybe you have been struggling to implement a user interface that doesn't map well into these basic elements. If so, the QML Canvas may be just the solution you are looking for…

    Blog
  • Qt 5.2.0 is now out! In this blog post, we'll look at some of the highlights of this new release. Release Timeline Qt 5.2 is a minor release of Qt (as opposed to a major release like Qt 6 or a patch release like 5.1.2). As such, it is binary compatible with other Qt 5 releases. The release…

    Blog
  • In this post we'll look briefly at the Model View support from QML in BlackBerry 10's Cascades Framework, including an example program. The Cascades framework lets you create UIs for the BlackBerry Application Platform with relative ease. This Qt based framework can be used to…

    Blog
  • We've just returned from the Qt Developer Days European conference last week and I wanted to share a brief report on some of the highlights of the show. ICS CEO Peter Winston: Introducing the First Keynote Speaker in Berlin This was the 10th annual Qt Developer Days. The conference is…

    Blog
  • With Qt Developer Days 2013 rapidly approaching, a number of Qt developers are busy preparing presentations for the conference, myself included. I thought it would be timely to give an overview of the QML Presentation System. Introduction The QML Presentation System is a QML-based piece of…

    Blog
  • The topic of application architecture rarely comes up in the context of Qt, because as Qt developers we tend to be more interested in the classes and objects (trees) than the application as a whole (forest). However, the architecture of a Qt Quick application is the difference between pain and…

    Blog
  • Introduction Qt 5 introduced a new set of multimedia APIs. Both C++ and QML APIs are provided. In this blog post, I will give an overview of the QML APIs for multimedia. Multimedia QML Elements The QtMultimedia module provides the following QML components: Name Description…

    Blog
  • Introduction Qt 5.1 introduces a new method in the QWidget class called createWindowContainer(). It allows embedding a QWindow (such as a QQuickView) into a QWidget-based application. This allows combining both QML and widgets in the same application, something that was not possible with Qt 5.0.…

    Blog
  • Introduction This blog posting gives an introduction to the Qt Graphical Effects module which is available in Qt 5. As of Qt 5.1 the module offers 25 QML components which support effects in these categories: blend, color, gradient, distortion, drop shadow, blur, motion blur, glow and mask. List…

    Blog
  • Since the last posting we properly set up deployment of Cordova Qt for MeeGo Harmattan (e.g. the Nokia N9 phone). We also got Qt 5 packages including WebKit built for MeeGo Harmattan and tested it on a Nokia N9. Incidently, a big PR1.2 software update rolled out this week for MeeGo Harmattan phones…

    Blog