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 in this series as it can't be run stand-alone in qmlscene. Rather, it is designed to be a direct child of a ListView or GridView (the ScrollBar's parent). The ScrollBar's position (y) and height are computed with a bit of math, based proportions of Flickable's contentHeight and contentY, as...
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 onPositionChanged to handle the user sliding the "pill" (the portion which the user moves ) left and right.
The background "tray" (a horizontal line, which can be tapped) is split into left and right pieces so that it doesn't show through the pill when enabled is set to false (since the pill is partially transparent in the disabled state)....
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 second MouseArea and drag property) and no text property. A Switch can be toggled either by tapping or dragging.
Switch.qml
import QtQuick 2.0
Rectangle { // size controlled by height
id: root
// public
property bool checked: false; // oncheckedChanged: print('oncheckedChanged', checked)
// private
width: 250; height: 50 // default size
border.width: 0.05 *...
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 signal, so the checkedChanged() signal (useful for C++) causes onCheckedChanged to run when the property checked changes.
CheckBox also serves as a radio button if a client sets radio: true, which is all RadioButton.qml does. To get multiple radio buttons to act together in a group, put a RadioButton...
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 overall development effort of your project.
In this series (which assumes you're familiar with basic QML), we will create a set of minimalistic QML controls from scratch (i.e. from QML primitives Item, Rectangle, Text, etc.) that can be used as a starting point for...
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 turned to the Internet to see what was available and I came across this page, which lists all options available for dealing with PDF files from Qt.
Amazingly, Qt natively supports writing PDF files using a few lines of code via QPrinter. However, it does not support reading or rendering PDF files out...