Doing a mockup of a physical panel

[etla]

I'm in a new project that hasn't gotten so far that there's any kind of hardware done yet, but to get a feel of the UX I'm trying to do a mockup of the control panel. The controls will be physical buttons around a display (without touch) that reports back the system status, and I've built my UI on the image of the panel from the UX-designer and made certain areas clickable and so on. Works like a charm.

What DOESN'T work like a charm is the display. Right now I'm simply drawing icons etc over the scanned image and while this works it means that I can't really simulate the final result but has to cludge around to get things drawn with an offset. What I would like to have would be a QWidget or similar that simply "floated" on top of the picture of the physical panel with the correct offset, something like this:

This so I can develop code that is as close as possible to the end result while the HW-guys are creating the actual hardware.

Best would be if QWidget was transparent, but I'll settle with a square box on top of the panel too. After all it's just a mockup and we'll just have to live with the rounded corners not being rounded.

Is this possible to do? How?

[mrjj]

Hi
Do mean if its possible to overlay widgets over some image ?
Like

If yes, you can just display the image in a QLabel and then place a widget over that.

[etla]

@mrjj Doh. Sometimes things are easier than you think and you're just thick! Thank you, worked like a charm.

Code included in case someone else has the same problem in the future and is searching for an answer (replace QTextEdit with the widget of your preference):

class TestWindow : public QMainWindow
{
  public:
    TestWindow(QWidget *parent = nullptr) : QMainWindow(parent)
    {
        display = new QTextEdit(this);
        display->setText("Testing");
        display->resize(800, 480);
        display->move(955, 97);
    }

    virtual void paintEvent(QPaintEvent *)
    {
        QPainter painter(this);
        painter.drawImage(0, 0, QImage(":/mockup/panels/Panel.png"));
    }

  private:
    QTextEdit *display;
};

int main(int argc, char *argv[])
{
    QApplication app(argc, argv);

    TestWindow testWindow;
    testWindow.show();

    return app.exec();
}