Teach on Udemy

Turn what you know into an opportunity and reach millions around the world.

Learn More

Your cart is empty.

Keep shopping

Robust Qt & C++ Gui Programming 2D Graphics App Tutorial

Name: Robust Qt & C++ Gui Programming 2D Graphics App Tutorial
Rating: 4.3 (630 reviews)

Become a confident Qt GUI and C++ software developer with step by step programming tutorials and 2D graphics examples

Created byDan Munteanu

Last updated 9/2018

English

What you'll learn

Create a robust, well designed C++ app with Qt, in a bottom-up approach
Use some of Qt toolkit's out-of-the-box functionality to build a Windows app
Draw very interesting and quite unusual 2D geometrical shapes ☆
Develop a C++ program from scratch
Drag and drop UI elements to design a simple GUI (graphical user interface)
Learn to debug your Qt apps
Learn to write scalable, robust and adaptable source code
Use source versioning with Git and SourceTree to commit code changes to online repositories
Use the Qt signal and slots mechanism to handle user interface events

Course content

4 sections • 40 lectures • 2h 56m total length

Introduction4:02
This lecture gives you an overall presentation of this course and answers the following questions:

What is this course about?
Who is your instructor and his background?
Is this course for you?
What do you need to know before you take this course?
Your Final App DEMO0:59
Demo of the application you will build step by step in Section 1 of this course.
Installing The Qt Framework (Required)3:26
This course requires installing the Qt framework. This lecture is a step by step guide on how to download and set up Qt SDK as a pre-requisite for creating the first project.
Installing Git (The Version Control System)3:29
GIT is a fast version control system. You will use it to store your intermediary code changes. It consists of a set of command line tools that help you keep a ledger of all the important changes of your project. This lecture is a step by step install guide for GIT.
Installing Source Tree1:11
You will install SourceTree, an application that integrates with GIT and allows you to version control your source code by using a graphical user interface. Think of it as a user interface layer on top of the GIT commands. (check External Resources for download link and a Git GUI alternative)
Creating a BitBucket account2:11
BitBucket is an online service that allows you to create unlimited repositories, both private and public, to store your source code and intermediary changes online. In this lecture you will create your free account.

Creating The Project10:59
This lecture is about doing the project groundwork:

preparing a local folder to hold the project files
creating the Qt Widgets application with Qt Creator
overview of the boilerplate code generated on project creation
ui cleanup, first build and run

Includes the QtCreator cheatsheet - useful shortcuts used during this course.
First Commit4:06
We will create our first commit using GIT. Then, we will create a BitBucket online repository to hold our newly created project files. Then we will use SourceTree to push the initial commit to our online repository. The first commit is a bit different from the rest, but these steps need to be done only once.
QtCreator shortcuts (GUIDE)0:03
A list of handy QtCreator shortcuts to make your life easier.
Preparing The Render Area8:22
This lecture is about creating and setting up a custom painting area.

adding a new RenderArea class
promoting a QWidget to RenderArea
overriding QWidget's base class functions
painting the background blue to make sure it all works
Adding Shape Types And Background Colors8:51
This lecture is about making the application "aware" of the shapes we're going to draw:

adding support for different shape types
adding buttons to the user interface for each shape
adding click handlers for button presses
adding getter and setter functions for the background color
painting the background a different color on each button press
Setting The Active Shape7:07
The application must know which is the active shape:

adding active shape getter / setter functions
refactoring shape type names
writing a switch statement in the paint event
Drawing The First Shape: The Astroid9:51
This lecture is about drawing our first shape! It's called The Astroid and it looks like a 4-pointed curvy star.

short explaination for the maths behind the shape (easy!)
implemeting the initial generic shape drawing algorithm (dots only for now)
adding a function to compute the astroid equation
scaling and translating the astroid to the center of the render area
On Shape Changed5:56
This lecture is an initial preparation step to making the app handle all shape types dynamically:

promoting local scope variables to class member status
updating the custom paint event to use class member variables
adding a class function to update shape control variables based on the active shape type
Compute Dispatcher6:32
This lecture is another preparation step for dynamic shape painting (last one, I promise)

We're adding a dispatcher function that will route the shape computing algorithm to the proper parametric functions, depending on the active shape type.
Pop Quiz
Drawing The Cycloid Shapes6:00
Finally! With everything in place, we're now implementing every compute function and painting all the remaining shapes.

updating shape control values for Astroid, Cycloid, Hypo Cycloid and Huygens' Cycloid
Drawing A Parametric Line (Just For Fun)6:43
To prove that the framework we've developed is dynamic, we're going to use it and draw a simple 50 pixels wide line, using parametric equations.
Connecting The Dots4:09
The shapes don't look so good when we're using only points to draw them.

Let's connect the dots and give the shapes a face-lift.

We're going to update the painting algorithm once and all shapes will be updated.
Shape Control #1: Scaling The Astroid7:39
We're adding a spinner component to the main window to update the scale argument for the Astroid at run-time.
Shape Control #2: Adding the update_ui() method4:36
We're adding a new function to the render area class. It will be called every time one of the 3 shape control values is updated.
Shape Control #3: Counting Your Steps5:35
We're adding the last shape control spinner that will update the number of approximation points (stepCount). Also commiting the changes from the last 3 lectures.
Adding A Drop Of Color10:20
This lecture is about changing the background color and the active shape color. We're:

adding one button for each color to change
using a predefined Qt color picker from code
plugging in the selected color into the painting algorithm

ASSIGNMENT 1: Update control variables0:24
ASSIGNMENT: You will have to modify the control variables for some of the shapes. This will get you hands-on experience with the codebase.
(Solution) Assignment 12:38
ASSIGNMENT 2: Going full-circle0:24
ASSIGNMENT: Add a Circle to the application. You are given the values for the control variables and the Circle's parametric equations for the X and Y coordinates.
(Solution) Assignment 25:44
ASSIGNMENT 3: Focusing on the ellipse0:21
ASSIGNMENT: Add an Ellipse shape to the application. You are given the values for the control variables and the Ellipse's parametric equations for the X and Y coordinates.
(Solution) Assignment 34:39
ASSIGNMENT 4: The fancy curve0:22
ASSIGNMENT: Add a Fancy shape to the application. You are given the values for the control variables and the Fancy shapes's parametric equations for the X and Y coordinates.
(Solution) Assignment 43:26
ASSIGNMENT 5: A lucky starfish0:25
ASSIGNMENT: Add a Lucky Starfish shape to the application. You are given the values for the control variables and the Lucky Starfish' formula.
(Solution) Assignment 55:19

Bug Fixing The Paint Logic1:42
In this lecture we're fixing a bug in the painting algorithm.
When step count is really low, the shape is not fully drawn, but missing a line.
The Mighty QPen3:27
We're making the shapes more visible by using a QPen to set the line width and also the shape color.
Cloud Shapes #1: The Puffy Cloud5:09
Learn how to draw a cloud-like shape.
Cloud Shapes #2: Inverted Cloud5:00
We're re-using the code from the cloud-like shape to draw an inverted cloud shape.
Introduction To Debugging8:10
Introduction to debugging with Qt Creator. Working with breakpoints. Overview of the debug layout (watch list, call stack, breakpoints list).
How To Debug With Qt Creator?6:48
Learn to use step over, step into, step out, continue and rum to line to troubleshoot your source code.
C++ & OOP Good Practices (GUIDE)0:04
A quick refresh of some important C++ object oriented notions.
Bonus Lecture: Project Source Code0:06
A link to the full project source code, exclusive to my awesome students.

Requirements

(Required) Working knowledge of C++ syntax and language fundamentals
(Required) Know the basics of OOP (Object Oriented Programming) with C++
(Preferable) Understand basic mathematical expressions and functions (sine, cosine, exponential)
Know how to create C++ source files
Feel comfortable using open source technologies

Description

This course will help you upgrade your C++ software development skills today!

You will learn how to build an application using Qt and C++, from the ground up.

As I've put my heart and soul into producing this course, I understand it's no longer up to date with the Qt platform.

But it does still have valuable insights into robust app design, so I believe you'll find quite a bunch of useful stuff in here

Here's what others have to say about this course:

"Great course. Instructions are clear and accurate. Dan logically teaches how to build an app from the simplest parts to the harder ones. Tasks for you to complete are getting a little bit bigger every time and you don't feel lost between instructions and the tasks as they are connected to each other (unlike in many other courses). Even though for me this course wasn't hard it was useful and I enjoyed it very much. After finishing the course I found out that there are new videos and new tasks! That's awesome! I like that course is being improved! " - Kateryna Brylliantova

"One of the best courses I ever had. Very well structured, very good program structure and complexity of the application. The explanation should be an example for many ohter teachers. A big and real triple-A. Thank You, Dan." - Matthias Kunka

"Well thought out and paced, I have learned quite a few interesting points on robust code." - Asad Raja

"I felt this was a very good course for intermediary C++ programmers. It has some easy to follow for the novice sections, but also plenty for the seasoned programmer." - Gino Manifred

C++ is a very powerful and versatile programming language.

Qt is multi-platform framework, the perfect choice for open source GUI development with C++.

Before investing in this course, please watch the FREE lectures (30 minutes) to:

see the final app in action (check out the Final App DEMO lesson)
decide if this course is really the right one for you

With this course, you will design and create your own C++ program for the Windows platform.

You will add new features to the app, step by step.

You will learn how to write good source code, at professional-level.

You can learn programming in C++ from anyone you wish to, there are many teachers and a lot of free know-how out there.

But if you want to learn to code like a professional, here's my advice to you:

Choose to learn from someone who has already done professional level coding
Choose a teacher who has a proven track record working experience with C++ and Qt
Choose a mentor who has done this for years, and knows what it takes to create industry-level software

Here's how the course is structured. Each lecture prepares the groundwork for the next one. You will:

write code in C++ (standard '03)
use the Qt toolkit's UI elements to create the GUI (Graphical User Interface)
set up the main application window
drag and drop the required user interface elements (buttons, widgets, labels, spinners...) on the main window
connect UI elements to UI events (mouse clicks, value changed)
write custom event handling code that updates the painted graphic

You need to have a good understanding of OOP (Object Oriented Programming) fundamentals, as you will be adding and working with:

class member variables
class member functions
setters / getters
private / public / protected access modifiers
encapsulation to protect the data
constructors and destructors
overriding virtual base class functions for Qt objects
pointers to objects

You will organize the C++ program logic into header (.h) and implementation (.cpp) source files.

You will design a simple GUI (Graphical User Interface) with QtCreator (part of the Qt toolkit) and use the signal and slots mechanism to make the buttons (and other UI elements) respond to mouse clicks or value changed events.

You will setup a custom rendering area widget that integrates flawlessly with the Qt5 framework, by inheriting from the QWidget base class and overriding abstract class methods.

You wil learn how to fix compiler errors that can occur during development.

You will also learn to fix linker errors caused by missing function implementations.

You will use a bottom-up approach to develop robust software.

Notice the key word here - robust.

That means professional-level C++ code.

You will learn to design reusable programs with programs will be designed with reusability in mind. And will be written with future upgrade capabilities in mind.

You will also use Math and Geometry in an unexpected way, to create unusual 2D graphics shapes.

You will also get some hands-on experience by taking the course assignments.

The assignments are designed to get you comfortable with the code and teach you to extend the application on your own, after you have completed the course.

Should I go on or do you want to start learning now?

I've invested around 10 years into learning software development and have worked 7 years in the IT industry.

Ok, here are a few more things you will get from it:

How to create an online repository (with BitBucket)
How to use source versioning (with GIT) to save intermediary code changes and revert back to them anytime if you make a mistake
Tips and tricks for good coding practices

So come on, let's start creating some 2D graphics with Qt5 And C++ Gui Programming!

Who this course is for:

You have a solid understanding of C++ syntax
You want to learn basic C++ app development with Qt
Preferably you are an intermediate developer or programming enthusiast
You want to learn how to design and create software from scratch
You love software development (especially with C++)
You want hands-on coding experience
You are a 2D graphics amateur or passionate

Robust Qt & C++ Gui Programming 2D Graphics App Tutorial

What you'll learn

Explore related topics

Course content

Setup Your Development Environment6 lectures • 15min

Drawing Shapes16 lectures • 1hr 47min

Assignments10 lectures • 24min

Additional Lectures And Resources8 lectures • 30min

Requirements

Description

Who this course is for: