Qt Quick Fundamentals

Learn to use Qt Quick to create a modern, fluid, user interface suitable for both mobile and desktop devices. Qt Quick contains both a rich set of user interface objects and an easy to use and learn declarative programming language known as QML. This is the second course in the series on the Qt framework.
Course info
Rating
(146)
Level
Intermediate
Updated
Oct 24, 2014
Duration
4h 30m
Table of contents
Overview
QML Syntax
QML Visual Types
JavaScript (aka ECMAScript)
User Input
Positioning
Transforms, Transitions, and Animations
Models, Views, and Delegates
Dialogs and More
Description
Course info
Rating
(146)
Level
Intermediate
Updated
Oct 24, 2014
Duration
4h 30m
Description

Qt Quick is part of the Qt ecosystem and is designed for building modern, fluid, interfaces. While Qt Quick can be used to build stand-alone applications, it's also designed to interact seamlessly with a C++ back end. Qt Quick is suitable for both desktop and mobile application developers. C++ programmers are the most likely to achieve long term gains from adopting Qt Quick but no knowledge of C++ will be required to understand this course. The ability to understand small snippets of JavaScript will be helpful when watching this course, but not essential. The Qt Quick approach to interface design makes it possible for programmers and designers to work together seamlessly. This course will be using the Qt 5.3 framework and the Qt Quick 2.2 library. If you are new to Qt, please see "Introduction to Qt: A C++ Cross Application Framework" for detailed instructions on downloading and installing the Qt Framework.

About the author
About the author

Tod has been programming anything he can get his hands on since 1980 when he accidentally discovered an Apple ][ at Argonne National Labs.

More from the author
Field Guide to Binary
Beginner
21m
Aug 1, 2018
Eclipse Guided Tour for Java
Beginner
3h 39m
Mar 2, 2018
Introduction to Ada 2012
Beginner
4h 12m
Jun 19, 2015
More courses by Tod Gentille
Section Introduction Transcripts
Section Introduction Transcripts

Overview
Welcome to the Qt Quick Fundamentals course presented by Pluralsight. May name is Tod Gentille. In this course, we're going to explore the latest user interface design technology from the Qt framework. Qt Quick offers a lot of advantages over Qt Widgets, and to me one of the primary advantages is it's just a heck of a lot more fun. Let's get started. Qt Quick, literally the Qt User Interface Creation Kit, is a framework for writing pixel-perfect, fluid, and dynamic user interfaces. Animations and transitions are a prime consideration of Qt Quick. Originally designed for areas where users expected a non-widget-based UI like mobile devices and touch interfaces, it has now elevated desktop development as a primary target. QML stands for Qt Markup Language, and depending on what you are familiar with, you can think of it like other declarative languages like HTML or CSS. If you know Windows Presentation Foundation, WPF, then I like to think of it as a pretty close analog to XAML. I don't think the distinctions between Qt Quick and QML are all that important. But to help you avoid offending anyone, you can think of Qt Quick as the parent module and overall framework. It includes QML, the QML API, and also a C++ API that makes Qt Quick easy to extent with C++. The QML module itself contains both the QML language and the QML engine.

QML Visual Types
Welcome to the QML Visual Types module of the Qt Quick Fundamentals course. My name is Tod Gentille, and in this part, we will be exploring the fundamental building blocks of a Qt Quick GUI. We've already seen some of these building blocks in use, but we'll cover them in more detail. We'll start with the item object and look at the important attributes it shares with all other visual types. We will then continue with the rectangle, text, and image elements, and examine the unique attributes they add to the mix.

Positioning
Welcome to the Positioning module of the Qt Quick Fundamentals course from Pluralsight. My name is Tod Gentille, and in this part, we will be exploring the variety of ways that Qt Quick has to flexibly manage the position of items in a user interface. When you're dealing with a single item, you can use either direct xy coordinates, like we talked about earlier in the course. You can also use anchors. We've already used anchors in some of our example code, but we'll talk a little bit more about anchors in this module. When you're dealing with groups of items, it's often much more convenient to use what Qt Quick calls positioners to arrange items. There are general purpose grid positioners, as well as the specialized row and column positioners. The grid, row, and column containers are just for positioning items. When you have items that are roughly uniform in size, a fixed container can often work out quite well. Other times, the smaller object can sometimes look a little lost floating around in a larger container. Qt Quick has an even more flexible tool that can adjust its size to the task at hand. By default, I find myself reaching most often for the GridLayout, RowLayout, and ColumnLayout. The attached property of these tools offers added functionality. There is one more common positioner, and that is flow. Flow is similar to your basic HTML container. It will wrap contained items into non-overlapping positions. The direction of flow can be specified as left to right or top to bottom. You can also specify the flow direction to go from right to left. In the next clip, we'll look at anchors in more depth.

Models, Views, and Delegates
Welcome to the Models, Views, and Delegates module of Pluralsight's Qt Quick Fundamentals course. My name is Tod Gentille. In this module, we'll be exploring the data visualization tools that Qt Quick provides to give you an easy-to-maintain way of presenting structured data elements to the user. We'll be focusing on the ListModel and the ListView. The ListView has quite a few properties, but we'll be sure to cover the basics including tying a ListView to a model, displaying the data from the model with a delegate, showing a header and a footer, and highlighting the current row. We'll also take a quicker peak at the time-saving repeaters and the very powerful XmlListModel. Let's get started.

Dialogs and More
Welcome to the Dialogs and More module of Pluralsight's Qt Quick Fundamentals course. My name is Tod Gentille. In this module, we'll be exploring the support Qt Quick provides for dialogs. Out of the box, you can get the standard system dialog for choosing a file or folder, choosing a color, choosing a font, a basic dialog that you can use with your own customized components, and a dialog for displaying information or a question to the user and getting back a response. Along the way, we're going to stumble across some more QML components like the MenuBar and ToolBar and how you use actions in QML to tie those two together. We'll also take a look at the coding conventions the QML Team recommends you use.