Congratulations to our 2022 Qt Champions!

how to draw on other QWidgets?

  • Hello,

    What I have:


    What I want:


    My code in mainWindow:

    void MainWindow::paintEvent(QPaintEvent *event)
        QPainter painter(this);

    I try with:

    button -> setAttribute(Qt::WA_PaintOnScreen);

    but with no result.

    Is there a simple way to draw like in the second picture?

    Button is added to mainWindow using mainwindow.ui

  • Lifetime Qt Champion


    You cannot draw on other widgets.

    However, you can use a 100% transparent overlay
    widget and draw on that one and it will be over the other widgets.
    So you use its paintEvent to draw the lines you want.

    But what is the goal of this ?

  • @mrjj The goal is very interesting… :D

    I use Win 10 and when I click for example on the clock ( on the right in taskbar ) and I move mouse on the calendar ( popup when click on clock ) I see that the light is changed. Picture:


    My mouse is on the center of 24 day. So the red circle is very close this day and the edges are very highlighted. The green is not as close like the red one, so edges are less highlighted, and the blue circle ( half circle :) ) is not close, so there is no highlighted. I would like do the same in QT .

    And this is not as simple as you can think. When I move mouse in this 24 square I change other square days. When I move mouse coursor to the bottom left corner I more highlighted 30 ( cursor is still in 24 square ). When I move to top left corner I more highlighted 16 square. Try it :D

  • Lifetime Qt Champion

    Ohh so its not so much lines you want to draw
    but fade out the borders depending on the distance?

    I dont have such a calendar in my win 10 so not 100% sure how it looks like but
    is it a custom control you want to do this with or plain normal buttons ?

  • @mrjj No. I don't need any lines. But I think about circles which I will draw on QLabels like this:


    The biggest rect is mainWindow. The smaller are QLabels. The red "X" is position of my mouse cursor. I was thinking about something like that.

    The same effect like in the calendar is in Microsoft Edge.

    I would like to do it using only QT. Of course I know that my project will be ugly :D

    I can count the distance from my current cursor mouse position to other points in mainWindow and print on all widgets ( QPainter and paintEvent ) which have one or more points, which distance is smaller than distance which I would like ( for example radius = 20 ) ( of course I should have more than one radius - the closest points will have other color than the points which aren't not so close ). But I think there is a better solution.

  • Lifetime Qt Champion

    Im not sure it will look good but you can try it :)

  • For other people, who look for the situation from my first post:

    pushButton->setStyleSheet("QPushButton{background: transparent;}");

Log in to reply