QFrame round border transparent background

Question

I'm creating a round context menu using QFrame. To make round corner, I used Qt style sheet. Here is my CSS

    this->setStyleSheet("QFrame#ShareContextMenu{background-color:rgb(255,255,255);
    border-width:1px;
    border-color :rgb(0,0,0);
    border-radius:10px;
    border-style:solid;}

    QPushButton{background-color:rgba(255,255,255,0);}
    QPushButton::hover{background-color:rgba(125,125,125,50); border-radius:5px;}");

How can I remove the white background marked with red circles in this picture?.

Edit:

Here is the solution using QWidget::setMask(). Add the following codes inside constructor

    QPixmap px(this->size()); //Create pixmap with the same size of current widget
    px.fill(Qt::transparent); //Fill transparent
    QPainter p(&px);
    QBrush brush;
    brush.setStyle(Qt::SolidPattern); //For fill
    p.setBrush(brush);
    p.drawRoundedRect(this->rect(), 15.0, 15.0); //Draw filled rounded rectangle on pixmap
    this->setMask(px.mask()); //The the mask for current widget.

Is that context menu box generated or composed from images? If it's made using images, just use images with a transparency for corners. — David Ferenczy Rogožan
That context menu box is created with QFrame, and I don't use any images. — sng

Tarod Tarod · Accepted Answer · 2015-09-10T09:54:38

I think you cannot resolve the problem using style sheets. QMenu is a rectangular top-level widget.

Is this your QMenu? If so, try this:

this->setWindowFlags(this->windowFlags() | Qt::FramelessWindowHint);
this->setAttribute(Qt::WA_TranslucentBackground);

Replace this by your instantiated QMenu object.

Of course, you could also use setMask to hide the required region. For example:

QRegion region (menu->x(),
                menu->y(),
                menu->sizeHint().width(),
                menu->sizeHint().height(),
                QRegion::Ellipse);
menu->setMask(region);

QFrame round border transparent background

1 Answers