Qt Widget with Transparent Background

Question

(I'm using PySide, but I think the answer would be the same/similar for any language bindings).

I'm trying to take the shaped clock example, located here, and cause the face of the clock (circle) to be transparent so that all I see are the clock hands and minute ticks. As is, when the example runs, it looks like this. I'm using Windows 7.

So far, I've tried the following (in the constructor):

• self.setAttribute(QtCore.Qt.WA_TranslucentBackground)
  • Clock appears (has presence in task bar), but I can't see it anywhere
• self.setAttribute(QtCore.Qt.WA_NoSystemBackground)
  • Clock appears, but has solid black background.
• self.setWindowOpacity(0.5)
  • Clock appears, but entire clock is transparent. I want the background (face) to be transparent, but I want the clock hands to be visible.

Answer 1

Got it!

This is from the original example code (constructor):

    ...
    self.setWindowFlags(self.windowFlags() | QtCore.Qt.FramelessWindowHint)
    ...

Here is the modified (and working per my question) version:

    ...
    self.setWindowFlags(QtCore.Qt.FramelessWindowHint)
    self.setAttribute(QtCore.Qt.WA_TranslucentBackground)
    ...

Removing the self.windowFlags() was the part I was missing. (I'm not exactly sure why I needed to remove this or why it was there to begin with... still much to learn).

Answer 2

If I remember correctly, you should have set its stylesheet also:

self.setWindowFlags(QtCore.Qt.FramelessWindowHint)
self.setAttribute(QtCore.Qt.WA_TranslucentBackground)
self.setStyleSheet("background:transparent;")

Hope that helps.