Coordinate transformation

In this example, we will learn how to use coordinate transformation and a timer to create a real-time clock display.

How to do it…

To create our first graphical clock display, let's follow these steps:

1. First, create a new Qt Widgets Application project. Then, open up mainwindow.ui and remove the menu bar, tool bar, and status bar.
2. After that, open up mainwindow.h and include the following headers:

   #include <QTime>
   #include <QTimer>
   #include <QPainter>

3. Then, declare the paintEvent() function, like so:

   public:
     explicit MainWindow(QWidget *parent = 0);
     ~MainWindow();
   
   virtual void paintEvent(QPaintEvent *event);
   

4. In mainwindow.cpp, create three arrays to store the shapes of the hour hand, minute hand, and second hand, where each of the arrays contains three sets of coordinates:

   void MainWindow::paintEvent(QPaintEvent *event)
   {
     static const QPoint hourHand[3] =
     {
       QPoint(4, 4),
       QPoint(-4, 4),
       QPoint(0, -40)
     };
   
     static const...