27

I have a QWidget-based overlay widget which should paint some text and take place over the central widget of my application. The problem is that I can't set background of overlay widget to be transparent. What I already tried:

  1. setPalette(Qt::transparent);
  2. setAttribute( Qt::WA_TranslucentBackground, true );
  3. setAttribute( Qt::WA_OpaquePaintEvent, true );
  4. setAutoFillBackground(false);
  5. setStyleSheet("QWidget{background-color: transparent;}");
  6. setAttribute(Qt::WA_NoSystemBackground);
sorush-r
  • 10,490
  • 17
  • 89
  • 173

4 Answers4

25

My best guess to show an overlay widget, is convert the widget to a window, resize it to it's contents and move them to the desired position manually.

MainWindow Example, showing the overlay widget in the center of the video widget:

Mwindow::Mwindow()
{
    widget = new Widget(this);
}

void Mwindow::widgetSizeMove()
{
    if (widget->width() <= videoWidget->width() && widget->height() <= videoWidget->height())
    {
        widget->setWindowOpacity(1); // Show the widget
        QPoint p = videoWidget->mapToGlobal(videoWidget->pos());
        int x = p.x() + (videoWidget->width() - widget->width()) / 2;
        int y = p.y() + (videoWidget->height() - widget->height()) / 2;
        widget->move(x, y);
        widget->raise();
    }
    else
    {
        widget->setWindowOpacity(0); // Hide the widget
    }
}

bool Mwindow::event(QEvent *event)
{
    switch (event->type())
    {
    case QEvent::Show:
        widget->show();
        QTimer::singleShot(50, this, SLOT(widgetSizeMove())); 
        //Wait until the Main Window be shown
        break;
    case QEvent::WindowActivate:
    case QEvent::Resize:
    case QEvent::Move:
        widgetSizeMove();
        break;
    default:
        break;
    }

    return QMainWindow::event(event);
}

Widget Example:

Widget::Widget(QWidget *parent) : QWidget(parent)
{
    setWindowFlags(Qt::Window | Qt::FramelessWindowHint);

    setAttribute(Qt::WA_NoSystemBackground);
    setAttribute(Qt::WA_TranslucentBackground);
    setAttribute(Qt::WA_PaintOnScreen);

    setAttribute(Qt::WA_TransparentForMouseEvents);
}

void Widget::paintEvent(QPaintEvent*)
{
    QPainter p(this);
    QString text = "Some foo goes here";
    QFontMetrics metrics(p.font());
    resize(metrics.size(0, text));
    p.drawText(rect(), Qt::AlignCenter, text);
}

Example when showing a video with LibVLC:

VLC based player

Antonio Dias
  • 2,751
  • 20
  • 40
16

On Linux works with:

setWindowFlags(Qt::FramelessWindowHint);
setAttribute(Qt::WA_NoSystemBackground);
setAttribute(Qt::WA_TranslucentBackground);
setAttribute(Qt::WA_TransparentForMouseEvents);
UndeadDragon
  • 717
  • 8
  • 23
15

The best solution is provided by Gökmen Göksel in one of the comments of this article

setStyleSheet("background-color: rgba(0,0,0,0)");
Violet Giraffe
  • 32,368
  • 48
  • 194
  • 335
Slawek Rewaj
  • 809
  • 8
  • 16
  • It's the only solution that did make the background transparent for me, but it also broke the native styling of the widget. – Violet Giraffe Apr 24 '17 at 07:24
0

Write on StyleSheet \

background: transparent;
Shaiful Islam
  • 335
  • 2
  • 12