Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Borderless Window Flickering while resizing



  • Hello,
    This is Video: Click me to watch video

    When resizing in borderless window, window flickering (being transparent for 0.5 second) as you can see in video. When windows has a lot of widgets, this happens more. But this not happens in normal window. So my borderless window code here too. Any idea to fix this issue?
    Thanks!

    Qt: 5.15.2
    This is python demo code :

    import sys
    from PyQt5.QtWidgets import QApplication, QMainWindow
    from PyQt5 import QtCore, QtGui, QtWidgets
    from PyQt5.Qt import *
    from PyQt5.QtCore import QSize, QPropertyAnimation
    from PyQt5.QtGui import QPalette, QColor, QFont
    from PyQt5.QtWidgets import QDialog, QApplication, QWidget, QMainWindow, QSizePolicy, QTableWidgetItem, QPushButton, \
        QProgressBar, QMessageBox, QHBoxLayout, QInputDialog, QLineEdit, QAbstractItemView, QHeaderView, QListWidget, \
        QListWidgetItem, QTextEdit, QLabel
    app = QApplication(sys.argv)
    
    from datetime import datetime
    
    
    class BorderlessWindow(QWidget):
    
        def __init__(self, w, parent=None):
            QWidget.__init__(self, parent)
            self.parent = parent
            self._w = w
            self.setupUi()
            contentLayout = QHBoxLayout()
            contentLayout.setContentsMargins(0, 0, 0, 0)
            contentLayout.addWidget(w)
            self.windowContent.setLayout(contentLayout)
            self.setWindowTitle(w.windowTitle())
            self.setGeometry(w.geometry())
            self._w.setAttribute(Qt.WA_DeleteOnClose, True)
            self._w.destroyed.connect(self.__child_was_closed)
    
        def __child_was_closed(self):
            self._w = None  # The child was deleted, remove the reference to it and close the parent window
            self.close()
    
        def setupUi(self):
            # create title bar, content
    
            self.vboxWindow = QtWidgets.QVBoxLayout(self)
            self.vboxWindow.setContentsMargins(0, 0, 0, 0)
    
            self.windowFrame = QWidget(self)
            self.windowFrame.setObjectName('windowFrame')
    
            self.vboxFrame = QtWidgets.QVBoxLayout(self.windowFrame)
            self.vboxFrame.setContentsMargins(0, 0, 0, 0)
    
            self.titleBar = QWidget()
    
            self.titleBar.setContentsMargins(0, 0, 0, 0)
            self.titleBar.setObjectName('titleBar')
    
            self.titleBar.setSizePolicy(QSizePolicy(QSizePolicy.Preferred,
                                                    QSizePolicy.Fixed))
    
            self.setWindowIcon(self._w.windowIcon())
            self.hboxTitle = QHBoxLayout(self.titleBar)
            self.hboxTitle.setContentsMargins(0, 0, 4, 0)
            self.hboxTitle.setSpacing(0)
    
    
            self.lblTitle = QLabel('title')
            self.lblTitle.setFont(QFont("Arial", 12))
            self.lblTitle.setObjectName('lblTitle')
            self.lblTitle.setAlignment(Qt.AlignBottom | Qt.AlignHCenter)
            self.lblTitle.setAttribute(Qt.WA_TransparentForMouseEvents, True)
    
            spButtons = QSizePolicy(QSizePolicy.Fixed, QSizePolicy.Expanding)
    
    
            self.btnMaximize = QPushButton("[]")  # clicked pyqtSlot => on_btnMaximize_clicked
            self.btnMaximize.setObjectName('btnMaximize')
            self.btnMaximize.setSizePolicy(spButtons)
    
    
    
            self.btnClose = QPushButton("x")  # clicked pyqtSlot => on_btnClose_clicked
            self.btnClose.setObjectName("btnClose")
            self.btnClose.setContentsMargins(0, 0, 0, 0)
    
    
            self.btnClose.setSizePolicy(spButtons)
    
    
    
    
            self.btnClose.setContentsMargins(3, 0, 0, 0)
    
            self.btnMinimize = QPushButton("_")  # click => on_btnMinimize_clicked
            self.btnMinimize.setObjectName("btnMinimize")
    
            self.vboxFrame.addWidget(self.titleBar)
            self.windowContent = QWidget(self.windowFrame)
            self.vboxFrame.addWidget(self.windowContent)
    
            self.vboxWindow.addWidget(self.windowFrame)
    
    
            self.hboxTitle.addWidget(self.lblTitle)
            self.hboxTitle.addWidget(self.btnMinimize)
    
    
            self.hboxTitle.addWidget(self.btnMaximize)
    
            self.hboxTitle.addWidget(self.btnClose)
            self.CONTROLBOX_WIDTH = self.btnClose.width()
    
    
            self.setWindowFlags(
                    Qt.Window | Qt.FramelessWindowHint | Qt.WindowSystemMenuHint | Qt.WindowCloseButtonHint |
                    Qt.WindowMinimizeButtonHint | Qt.WindowMaximizeButtonHint)
    
    
            self.setAttribute(Qt.WA_TranslucentBackground)
    
    
    
            QtCore.QMetaObject.connectSlotsByName(self)
    
            def Pencere_QGraphicEfektOlustur():
                EFEKTGOLGE = QtWidgets.QGraphicsDropShadowEffect()
                EFEKTGOLGE.setColor(QColor(0, 255, 0, 200))
                EFEKTGOLGE.setBlurRadius(9.0)
                EFEKTGOLGE.setOffset(0)
                return EFEKTGOLGE
            self.windowFrame.window().layout().setContentsMargins(2, 2, 2, 2)
            self.windowFrame.setGraphicsEffect(Pencere_QGraphicEfektOlustur()) # border effect color
            self.setStyleSheet("""#windowFrame {
      border-radius:10px;
      background-color: palette(Window);
    }
    #titleBar {
      border: 0px none palette(base);
      border-top-left-radius: 5px;
      border-top-right-radius: 5px;
      background-color: palette(Window);
      height: 24px;
    }
    #btnClose, #btnMaximize, #btnMinimize { 
        margin: 4px;  
    	border: none;
    	border-radius: 8px;	
    	width:17px;
    	height:17px;
    	max-height:17px; /* Asagi dogru uzuyor sadece */
    	max-width:17px;
    	
    		
    }
    #btnMaximize {
      	border: none;
    	border-radius: 8px;	
    	background-color: rgb(255, 170, 0);
    }
    #btnMaximize::hover {
      	background-color: rgba(255, 170, 0, 175);
    }
    #btnMinimize {
     	border: none;
    	border-radius: 8px;		
    	
    	background-color: rgb(0, 120, 0);
    }
    #btnMinimize::hover {
        background-color: rgba(0, 120, 0, 175);
      	
    }
    #btnClose {
    	border: none;
    	border-radius: 8px;		
    	background-color: rgb(255, 0, 0);
    }
    #btnClose::hover {
      background-color: rgba(255, 0, 0, 175);
    }
    #btnClose::disabled, #btnMaximize::disabled, #btnMinimize::disabled {
      background-color: palette(midlight);
    }
    """)
    
    
    class Window(QMainWindow):
        def __init__(self):
            super(Window,self).__init__()
            self.resize(QSize(800,640))
            self.WID_MAIN_CENTER=QWidget(self)
            self.QV_MAIN = QVBoxLayout(self.WID_MAIN_CENTER)
            self.list = QListWidget(self)
            self.list.setResizeMode(QListView.Adjust)
            self.list.setVerticalScrollBarPolicy(Qt.ScrollBarAsNeeded)
            self.list.setHorizontalScrollBarPolicy(Qt.ScrollBarAlwaysOff)
            self.list.setStyleSheet("QListWidget{background-color:transparent}QListWidget:item{border-radius:5px}QPushButton{border-bottom-left-radius: 7px;border-bottom-right-radius: 7px;background-color:transparent}")
    
            self.QV_MAIN.addWidget(self.list)
            index=1
            for i in range(3000):
                item = QListWidgetItem()
                self.list.insertItem(0, item)
                myWid = QWidget()
                qvWid = QHBoxLayout(myWid)
                for y in range(3):
                    qvWid.addWidget(QPushButton(f"Button {i*3+y+1}"))
                item.setSizeHint(QSize(100,200))
                self.list.setItemWidget(item, myWid)
                index+=1
            self.setCentralWidget(self.WID_MAIN_CENTER)
    
            Screen_x = app.primaryScreen().size().width()
            Screen_y = app.primaryScreen().size().height()
    
    
            EnableBorderlessWindow = True
            if EnableBorderlessWindow:
                self.mac = BorderlessWindow(w=self, parent=None )
                self.mac.lblTitle.setText('PyQt5 Borderless Window Flicker while resizing Qt: %s'%(QtCore.QT_VERSION_STR))
                self.sizerSagAlt = QSizeGrip(self)
                self.QV_MAIN.addWidget(self.sizerSagAlt,0,Qt.AlignRight)
                self.mac.resize(self.size())
                self.mac.move(int((Screen_x - self.width()) / 2), int((Screen_y - self.height()) / 2))  # center form
                self.mac.show()
            else:
                self.show()
    
    
    window = Window()
    app.exec()
    
    


  • Any idea?



  • I fixed, i was forget disable this;

    self.setAttribute(Qt.WA_TranslucentBackground)
    


  • I have bad news.
    I fixed issue with removing :

    self.setAttribute(Qt.WA_TranslucentBackground)
    

    this, but now form when try to add rounded corners, background (gray) shows up. This was not happens with WA_TranslucentBackground.
    border-corners.png

    Any idea to add border-radius to form without flickering (WA_TranslucentBackground)?



  • Up. Any idea?



  • @Emrecp said in Borderless Window Flickering while resizing:

    Qt.Window | Qt.FramelessWindowHint | Qt.WindowSystemMenuHint | Qt.WindowCloseButtonHint |
    Qt.WindowMinimizeButtonHint | Qt.WindowMaximizeButtonHint

    Doesn't the FramelessWindowHint turn off the windows system menu? What is the point of mixing those options? Borderless means no system menu right? What does it look like with just these options?
    Qt.Window | Qt.FramelessWindowHint



  • @fcarney Same :/



  • The issue remains. Need help.



  • The problem continues



  • Try with Qt::WA_NoSystemBackground


Log in to reply