Make a transparent hole in a QT application

Question

I've got a problem where I've got 2 Qt applications on top of eachother. The top Qt application needs a transparant hole in it to show the Qt application behind it. Is there any way to do this? or is there an example somewhere in the Qt library which could help me?

To clarify, if I'd run the Qt application on a Windows machine I would like to see my desktop background through the transparent hole.

I did find the windowOpacity property. Unfortunately this property changes the opacity of the entire application, and not just a part of the application.

Why would you ever need 2 Qt applications? Just draw them in the same Application? This is not a possibility for this project because of security reasons the applications need to be seperate. To seperate the two applications there is only limited communication between the two and can not use the same QT application.

Edit: Since my question got deleted because it is not clear enough, here are 3 examples of what I am trying to achieve.

Example 1: Here you can see how I would like application 1 to be shown. 2 squares, 1 big square (the blue one) which is not transparent and a second square (the white one) inside the first square which is transparent (it's hard to show transparency in a picture).

Example 2: Here you can see how I would like both applications to be shown. Behind the transparent square the second application is shown. When they allign perfectly there is not much to see, it just looks like 2 applications drawn over eachother.

Example 3: Here you can see how the applications should interact when the second application is not aligned in the right way. The second application can only be seen through the transparent section of the first application.

To repeat my original question once again: Is it possible to create an Qt application with a see through hole?

And my follow up: Are there any examples in the Qt library or any other place where this is implemented?

Have you seen [QWidget::setMask](https://doc.qt.io/qt-5/qwidget.html#setMask)? It's meant to be used with an image, but maybe you can work around it to "draw" your hole in an image. I have no idea how it behaves inside a window with other widgets though. — ymoreau, Jul 22 '20 at 11:01
If this was to run on linux, I'd suggest to use Wayland and make your top app a Wayland compositor in which you then run your second application. However, perhaps you can find some hints in this older topic: https://stackoverflow.com/questions/33699258/qt-5-5-embed-external-application-into-qwidget — André, Jul 23 '20 at 09:04
Alternatively, ,if you can obtain the id of the top level window of application 2 then what not embed it in application 1 using [`QWidget::createWindowContainer`](https://doc.qt.io/qt-5/qwidget.html#createWindowContainer)? — G.M., Jul 23 '20 at 09:04

score 1 · Accepted Answer · answered Jul 23 '20 at 12:31

Eventually after a lot of fooling around with Qt I've been able to do what I was trying to do.

My solution is based on the clock example from Qt. I've changed the resizeEvent to the following:

void Widget::resizeEvent(QResizeEvent * /* event */)
{
    QRegion outsideMask(QRect(0, 0, 200, 200));
    QRegion insideMask(QRect(50, 50, 100, 100));
    QRegion mask = outsideMask.subtracted(insideMask);

    setMask(mask);
}

If you're not using the clock example, be sure not to forget to set the background to translucent: setAttribute(Qt::WA_TranslucentBackground);

After that I changed around with the clock as I only needed a square with a hole in it.

The final solution looks as follows (on top of the google page to show transparency):

The good thing about this solution is that it works on Linux and on Windows. As most things that I tried did work on Windows but not on Linux.

Thanks to @ymoreau for guiding me into the right direction!

Make a transparent hole in a QT application

1 Answers1