Solved Customizing QMainWindow by style sheet

[eDeviser]

Hello, I am very new to QT and I tried to use a style sheet to adapt my QMainWindow's behavior. I would like to change its size, position or style if the mouse courser hovers over it.

I just created a simple Qt-Widgets-Application with one QMainWindow which has the name MyWindow.
In the designer I selected MyWindow and clicked to 'Style sheet edit' within the context menu.

A little editor opens and I inserted the fallowing example from here:

QMainWindow::separator {
    background: yellow;
    width: 10px; /* when vertical */
    height: 10px; /* when horizontal */
}

QMainWindow::separator:hover {
    background: red;
}

According to the style sheet I suggest that MyWindow would have a red background when the mouse courser points to it. Otherwise the background would be yellow.

Nevertheless really nothing happens if the mouse course points to MyWindow at runtime.

How to use this example to Customizing QMainWindow?

[m.sue]

Hi @eDeviser

you will have to do it with the object that you set as central widget.

-Michael.

[mostefa]

Hi @eDeviser

As @m-sue told youneed to have a centralWidget , (of QWidget type for example)

Your stylesheet will be then:

QWidget {
background: yellow;
width: 10px; /* when vertical /
height: 10px; / when horizontal */
}

QWidget:hover {
background: red;
}

Hope this can help you,

Best regards!

[eDeviser]

Yes, this helps!

I see the QMainWindow holds a QWidget which is set as cetralWidget. So It would be necessary to set the QMainWindow as centralWidget or to apply my css for the QWidget.

Thank you for this hint.

[mostefa]

@eDeviser said in Customizing QMainWindow by style sheet:

Yes, this helps!

I see the QMainWindow holds a QWidget which is set as cetralWidget. So It would be necessary to set the QMainWindow as centralWidget or to apply my css for the QWidget.

Thank you for this hint.

You have to apply your css in your qwidget !

Your css should be :

centralWidget {
background: yellow;
width: 10px; /* when vertical /
height: 10px; / when horizontal */
}

centralWidget:hover {
background: red;
}