I have an Qt application which is executed from a web page. The Qt window comes on top of the web page and it needs to be transparent. So, the background on the web page should be visible in Qt window. Also, i need the transparency to be configurable so user can specify the percentage of transparency.

Now, i am able to achieve transparency by setting the Qt window background image to be same as the background of the web page and using style sheets to achieve transparency. So, essentially i am not making the main Qt window transparent. I am making the widgets inside the window transparent.

I am using the following code in the contructor of my application:
Qt Code:
  1. QPalette palette = this->palette();
  2. palette.setBrush(backgroundRole(), QBrush(backPixmap));
  3. setPalette(palette);
To copy to clipboard, switch view to plain text mode 
Here backPixmap contains the background png image. So, initially i set the background image for the Qt application.

Mainly, i have a QTableView in my Qt application, so i am setting it transparent by using the following style sheet syntax:

Qt Code:
  1. color: rgb(212, 248, 255); background-color: rgba(230, 230, 230, 50%); selection-color: rgb(26, 26, 26); selection-background-color: rgb(143, 237, 255)
  2. }
To copy to clipboard, switch view to plain text mode 

So, user can change the alpha value in the background-color attribute and change the amount of transparency.


The problem with the above approch is that if the Qt application is opened from a web page with different background, it won't look as transparent, so i want to make the window itself transparent.

I tried using various methods of making window transparent but none succedded. For e.g. i tried this:

Qt Code:
  1. QPalette pal = this->palette();
  2. pal.setBrush(QPalette::Base, Qt::transparent);
  3. this->setPalette(pal);
To copy to clipboard, switch view to plain text mode 

and also this:
Qt Code:
  1. setStyleSheet("background-color: rgba(255, 255, 0, 50%)");
To copy to clipboard, switch view to plain text mode 

and this:
Qt Code:
  1. setAttribute( Qt::WA_NoSystemBackground, true );
To copy to clipboard, switch view to plain text mode 

When i try the above methods, the window background changes to black. Through the stylesheet code given above, if i set the alpha value to > 10%, it appears that alpha value is making a difference but when i set it to 0%, the window goes black.

I also tried this code given by @Jpn in some other thread:
Qt Code:
  1. #include <QtGui>
  2.  
  3. class MaskedLabel : public QLabel
  4. {
  5. protected:
  6. void resizeEvent(QResizeEvent* event)
  7. {
  8. QLabel::resizeEvent(event);
  9.  
  10. QPixmap pixmap(size());
  11. pixmap.fill(Qt::transparent);
  12. QPainter::setRedirected(this, &pixmap);
  13. QPaintEvent pe(rect());
  14. paintEvent(&pe);
  15. QPainter::restoreRedirected(this);
  16. setMask(pixmap.mask());
  17. }
  18. };
  19.  
  20. int main(int argc, char* argv[])
  21. {
  22. QApplication a(argc, argv);
  23. QLabel* label = new MaskedLabel();
  24. label->setText("Qt Centre!");
  25. QFont font = label->font();
  26. font.setPointSize(72);
  27. label->setFont(font);
  28. label->show();
  29. return a.exec();
  30. }
To copy to clipboard, switch view to plain text mode 

but this makes the entire window transparent and even the child widgets of the window are not visible.

So, how can i make my window transparent and also vary the transparency percentage?