Time for action – making the clock functional

The final step in creating a clock is to make it actually show the current time. In JavaScript, we can query the current time using the Date object:

var currentDate = new Date()
var hours   = currentDate.getHours()
var minutes = currentDate.getMinutes()
var seconds = currentDate.getSeconds()

Therefore, the first thing that comes to mind is to use the preceding code to show the current time on the clock:

Item {
  id: clock
  property int hours:   currentDate.getHours()
  property int minutes: currentDate.getMinutes()
  property int seconds: currentDate.getSeconds()
  property var currentDate: new Date()
  // ...
}

This will indeed show the current time once you start the application, but the clock will not be updating ...

Get Game Programming Using Qt now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.