How to create a custom circular gauge?

[Gokulnathvc]

How to create a customized circular gauge. I am using QT Linux. It would be a multi color radial outside the gauge. IMG_20230719_121840.png

. Outside bar colors can be dynamically changed depending upon the speed intervals.

[d_stranz]

Do you plan to do this as a custom QWidget or in QML / QtQuick?

[Gokulnathvc]

Kindly suggest me on the same. Which one will be easily maintainable. Preferably QWidget.

[d_stranz]

I do not know anything about QML / QtQuick, so I cannot help with that. My understanding is that QML is most useful for small apps or displays on embedded devices, not so much for full desktop applications. If that is your target, then you should look at the examples for QML and QtQuick to see if you can learn from them.

For your gauge, I would start by looking at the code for the Qt Analog Clock example That is already half-way to the GUI you want.

For the color bar on the outside of the gauge, use QPainter::drawArc() with a gradient QBrush (See the "Detailed description" in the QBrush documentation). Use a QLinearGradient with as many color stops as you need to show the colors you want.

When you draw the arc, use a QPen constructed with your gradient QBrush and the width you want for the color bar and at a radius that sits outside of the dial markings.

Instead of drawing the dial yourself, you could also use a pixmap background if you can find an image of a dial you like.

The code to do this is not hard. Follow the Analog Clock example and make the needed substitutions.

If this is too much work, look at Qwt and some of the custom widgets it offers.