Game Programming using Qt 5 Beginner's Guide - Second Edition

Time for action – Preparing Canvas for heartbeat visualization

Let's start with simple things by creating an empty Qt Quick project. Add the following code to the main.qml file:

Window {
    //...
    Canvas {
        id: canvas

        implicitWidth: 600
        implicitHeight: 300

        onPaint: {
            var ctx = canvas.getContext("2d");
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            ctx.strokeRect(50, 50, 100, 100);
        }
    }
}

When you run the project, you will see a window containing a rectangle: