OiO.lk Community platform!

Oio.lk is an excellent forum for developers, providing a wide range of resources, discussions, and support for those in the developer community. Join oio.lk today to connect with like-minded professionals, share insights, and stay updated on the latest trends and technologies in the development field.
  You need to log in or register to access the solved answers to this problem.
  • You have reached the maximum number of guest views allowed
  • Please register below to remove this limitation

StyleSheet applied to QComboBox in QtDesigner not being applied when run

  • Thread starter Thread starter waffles24
  • Start date Start date
W

waffles24

Guest
I have applied the following style-sheet to a QComboBox (under a custom class named 'selections'):

Code:
.selections{
    color: #fdfffc;
    height: 25px;
    border-radius: 10px;
    background-color: rgb(35, 35, 35);
    padding: 5px;
    padding-left: 15px;
    combobox-popup:0;
}

.selections::drop-down{
    color: #fdfffc;
    height: 25px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    background-color: rgb(35, 35, 35);
}

.selections:hover{
    border: 1px solid rgb(75,75,75);
}

.selections QListView{
    color: #fdfffc;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    background-color: rgb(35, 35, 35);
    outline: 0px;
}

.selections QListView::item{
    color: #fdfffc;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    background-color: rgb(35, 35, 35);
    padding: 5px;
    padding-left: 15px;
    outline: 0px;
    height: 25px;
}

.selections QListView::item:selected{
    background-color: #f34643;
    border: 5px solid  #f74f4f;
    border-radius: 5px;
    padding-left: 10px;
}

It appears just fine when previewed in QtDesigner, but fails when run in Python (my version is 3.12):

Qt Designer Preview:
Qt Designer Preview


Python Result:
Python Result


Here is my Python code:

Code:
#App Libraries
from PyQt5.QtWidgets import QMainWindow, QApplication, QWidget, QVBoxLayout, QHBoxLayout, QButtonGroup, QDialog, QTabWidget
from PyQt5 import QtWidgets as qtw
from PyQt5.QtGui import *
from PyQt5.QtCore import QPoint, QRect, QSize, Qt
from PyQt5.QtGui import QIcon, QIconEngine, QImage, QPainter, QPixmap
from PyQt5.uic import loadUi 
from PyQt5.QtCore import Qt as QtCore
import sys
import os
import pyqtgraph as pg

# Rewriting the Icon Map Engine for higher resolution images & Icons
class PixmapIconEngine(QIconEngine):

    def __init__(self, iconPath: str):
        self.iconPath = iconPath
        super().__init__()

    def paint(self, painter: QPainter, rect: QRect, mode: QIcon.Mode, state: QIcon.State):
        painter.setRenderHints(QPainter.Antialiasing |
                               QPainter.SmoothPixmapTransform)
        painter.drawImage(rect, QImage(self.iconPath))

    def pixmap(self, size: QSize, mode: QIcon.Mode, state: QIcon.State) -> QPixmap:
        pixmap = QPixmap(size)
        pixmap.fill(Qt.transparent)
        self.paint(QPainter(pixmap), QRect(QPoint(0, 0), size), mode, state)
        return pixmap
    
class ui(QMainWindow):
    def __init__(self, parent = None):
        super(ui, self).__init__()
        loadUi('main_window.ui', self)

if __name__ == "__main__":
    app = QApplication(sys.argv)
    os.environ["QT_ENABLE_HIGHDPI_SCALING"] = "0"
    os.environ["QT_SCALE_FACTOR"] = '1.25'
    app.setAttribute(Qt.AA_UseHighDpiPixmaps)
    app.setStyle('fusion')
    window = ui()
    window.show()
    app.exec_()

I tried using app.setStyle('fusion') as suggested on posts with similar CSS issues, but it fails to rectify the problem.

I even tried follow the steps mentioned over here but it doesn't seem to work for me.
<p>I have applied the following style-sheet to a QComboBox (under a custom class named 'selections'):</p>
<pre><code>.selections{
color: #fdfffc;
height: 25px;
border-radius: 10px;
background-color: rgb(35, 35, 35);
padding: 5px;
padding-left: 15px;
combobox-popup:0;
}

.selections::drop-down{
color: #fdfffc;
height: 25px;
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
background-color: rgb(35, 35, 35);
}

.selections:hover{
border: 1px solid rgb(75,75,75);
}

.selections QListView{
color: #fdfffc;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
background-color: rgb(35, 35, 35);
outline: 0px;
}

.selections QListView::item{
color: #fdfffc;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
background-color: rgb(35, 35, 35);
padding: 5px;
padding-left: 15px;
outline: 0px;
height: 25px;
}

.selections QListView::item:selected{
background-color: #f34643;
border: 5px solid #f74f4f;
border-radius: 5px;
padding-left: 10px;
}
</code></pre>
<p>It appears just fine when previewed in QtDesigner, but fails when run in Python (my version is 3.12):</p>
<p>Qt Designer Preview:<br />
<img src="https://i.sstatic.net/bZ3XEIXU.png" alt="Qt Designer Preview" /></p>
<p>Python Result:<br />
<img src="https://i.sstatic.net/wi9d8rTY.png" alt="Python Result" /></p>
<p>Here is my Python code:</p>
<pre><code>#App Libraries
from PyQt5.QtWidgets import QMainWindow, QApplication, QWidget, QVBoxLayout, QHBoxLayout, QButtonGroup, QDialog, QTabWidget
from PyQt5 import QtWidgets as qtw
from PyQt5.QtGui import *
from PyQt5.QtCore import QPoint, QRect, QSize, Qt
from PyQt5.QtGui import QIcon, QIconEngine, QImage, QPainter, QPixmap
from PyQt5.uic import loadUi
from PyQt5.QtCore import Qt as QtCore
import sys
import os
import pyqtgraph as pg

# Rewriting the Icon Map Engine for higher resolution images & Icons
class PixmapIconEngine(QIconEngine):

def __init__(self, iconPath: str):
self.iconPath = iconPath
super().__init__()

def paint(self, painter: QPainter, rect: QRect, mode: QIcon.Mode, state: QIcon.State):
painter.setRenderHints(QPainter.Antialiasing |
QPainter.SmoothPixmapTransform)
painter.drawImage(rect, QImage(self.iconPath))

def pixmap(self, size: QSize, mode: QIcon.Mode, state: QIcon.State) -> QPixmap:
pixmap = QPixmap(size)
pixmap.fill(Qt.transparent)
self.paint(QPainter(pixmap), QRect(QPoint(0, 0), size), mode, state)
return pixmap

class ui(QMainWindow):
def __init__(self, parent = None):
super(ui, self).__init__()
loadUi('main_window.ui', self)

if __name__ == "__main__":
app = QApplication(sys.argv)
os.environ["QT_ENABLE_HIGHDPI_SCALING"] = "0"
os.environ["QT_SCALE_FACTOR"] = '1.25'
app.setAttribute(Qt.AA_UseHighDpiPixmaps)
app.setStyle('fusion')
window = ui()
window.show()
app.exec_()
</code></pre>
<p>I tried using <code>app.setStyle('fusion')</code> as suggested on posts with similar CSS issues, but it fails to rectify the problem.</p>
<p>I even tried follow the steps mentioned over <a href="https://stackoverflow.com/questions/65539775/stylesheet-does-not-work-properly-in-pyqt">here</a>
but it doesn't seem to work for me.</p>
 

Latest posts

Top