How to implement rounded corners for window that call SetWindowCompositionAttribute

1k Views Asked by At

Calling SetWindowCompositionAttribute can indeed add the acrylic effect of Win10 to the window, but I have a problem that I still can't solve, that is, how to realize the rounded window while adding the acrylic effect. As shown in the picture below, even if I use win32guiSetWindowRgn(int(self.winId()),win32gui.CreateRoundRectRgn(0, 0, 500, 500, 500, 500), True) in pyqt, the acrylic panel cannot be cropped. May I ask Do you have any good ideas?

acrylic window

2

There are 2 best solutions below

1
On

You can use border-radius to make a workaround (UpdateLayeredWindow is equivalent to WA_TranslucentBackground, SetWindowRgn don' have affect over SetWindowCompositionAttribute blur)

blurry

Full code:

Stylesheet = """
#Custom_Widget {

    border-radius: 20px;
    opacity: 100;
    border: 8px solid #cdced4;  
    
}
#closeButton {
    min-width: 36px;
    min-height: 36px;
    border-radius: 10px;
}
#closeButton:hover {
    color: #FFFFFF;
    background: red;
}
"""

import sys
from PySide2.QtWidgets import *
from PySide2.QtCore import *
from BlurWindow.blurWindow import GlobalBlur

class MainWindow(QMainWindow):
        
    def __init__(self):
        super(MainWindow, self).__init__()
        
        self.setStyleSheet(Stylesheet)
        self.setWindowFlag(Qt.FramelessWindowHint)
        self.setAttribute(Qt.WA_TranslucentBackground, True)
        self.resize(488, 388)
        GlobalBlur(self.winId(),Acrylic=True,hexColor='#FFFFFF20') 
        
        self.Borders() #the real MainWindow

    def Borders(self):
        window = QMainWindow(self)
        window.setAttribute(Qt.WA_TranslucentBackground)
        window.setWindowFlag(Qt.FramelessWindowHint)
        window.resize(500, 400)
        
        self.widget = QWidget(window)
        window.setCentralWidget(self.widget)
        
        self.widget.setObjectName('Custom_Widget')
        self.layout = QHBoxLayout(self.widget)
        
        self.layout.addWidget(QPushButton(
            'X', self,clicked=exit, objectName='closeButton'))
        self.layout.addWidget(QLabel("<h2 style='color:blue;'>Blurry</h2>"))
        
        window.show()


if __name__ == '__main__':
    app = QApplication(sys.argv)
    mw = MainWindow()
    mw.show()
    sys.exit(app.exec_())

UpdateLayeredWindow alpha example: https://github.com/wxWidgets/Phoenix/issues/1544

0
On

The SetWindowCompositionAttribute API is not public. To apply one or more high quality effects to an image or a set of images, you can use Direct2D.

Here are some helpful links for you get started:

How to load an image into Direct2D effects using the FilePicker

Directional blur effect

Custom effects

And if you still you still want to use SetWindowCompositionAttribute API, I would suggest that you raise your voice on Feedback Hub.