Problem with QComboBox with icons in it -- on macOS

[cculianu]

Describe Your Environment

Please, report the output of the command (from v2.6+) or fill the information below:

calin@CalinMBP2016 ~/src/ec/ec-slp $ ~/Library/Python/3.6/bin/qdarkstyle --all
usage: qdarkstyle [-h] [-i] [-b] [-a] [-v] [--all]

optional arguments:
  -h, --help          show this help message and exit
  -i, --information   Show information about environment (important for bug
                      report)
  -b, --bindings      Show available bindings for Qt
  -a, --abstractions  Show available abstraction layers for Qt bindings
  -v, --version       Show qdarkstyle version
  --all               Show all information options at once

Information about your current environment setup:
  - QDarkStyle: 2.6.8
  - OS: Darwin 17.7.0 x86_64
  - Platform: darwin
  - Python: 3.6.8.final.0
  - Python API: 1013
  - Binding in use:     Not set or nonexistent
  - Abstraction in use: Not set or nonexistent
  - qtpy (QT_API):                Not set or nonexistent
  - pyqtgraph (PYQTGRAPH_QT_LIB): Not set or nonexistent
  - Qt.py (__binding__):          Not set or nonexistent

Qt bindings available:
  - PyQt5

Qt abstraction layers available:

• QDarkStyle: 2.6.8
• OS: 17.7.0 x86_64 (macOS 10.13.6 High Sierra)
• Python: 3.6.8

- PyQt: 5.11.3

Language

Python

Description / Steps to Reproduce [if necessary]

[Description of the issue]

1. Make a QComboBox with items that have both icons and text in them
2. Use the QComboBox and see it look terrible

Actual Result

It looks all mushed.

Expected Results / Proposed Result

For it to not look mushed.

Relevant Code [if necessary]

# NOTE: this code requires icons/tab_coins.png and icons/tab_slp_icon.png in a subdir.
# Use any files you want and replace the icon filename to test

import sys

from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtWidgets import *
import qdarkstyle


app = QApplication(sys.argv)

ss_orig = app.styleSheet()
is_dark = False

def toggleStyle():
    global is_dark
    if not is_dark:
        app.setStyleSheet(qdarkstyle.load_stylesheet_pyqt5())
        is_dark = True
    else:
        app.setStyleSheet(ss_orig)
        is_dark = False

toggleStyle()

w = QWidget()
w.resize(250,300)
v = QVBoxLayout(w)
#v.addWidget(QLabel("This is a test"))
cb = QComboBox()
cb.addItem(QIcon("icons/tab_coins.png"), "Hello")  # replace with your icon file
cb.addItem(QIcon("icons/tab_slp_icon.png"), "FooBar") # replace with your icon file
cb.addItem(QIcon("icons/tab_coins.png"), "Why?!?") # replace with your icon file
v.addWidget(cb)
v.addSpacing(1)
pb = QPushButton('Toggle Dark')
pb.clicked.connect(toggleStyle)
v.addWidget(pb)
w.show()

app.exec_()

[dpizetta]

@goanpeca could you take care of this one? I think that is something related to #132 and #145. @cculianu is this happening in versions v2.6.7 or v2.6.6? Tks for both

[goanpeca]

Yes!, I can, sorry I forgot about this. Thanks for the ping

[cculianu]

@dpizetta @goanpeca

2.6.7 -- The bug is there -- exactly the same behavior.
2.6.6 -- The bug is not there -- works as expected.

I haven't tried anything before then. And, of course, 2.6.8 is also broken. :)

Thanks for looking into it!

[goanpeca]

Working on this now :-p

[goanpeca]

So @cculianu QComboBox has a problem with QSS (I have read it somewhere but do not have the link handy)

So basically the implementation of the item delegate of the QComboBox Listview uses QItemDelegate and not a QStyledItemDelegate and that is why a lot of the CSS on the ::item of a QComboBox is hacky, or distorts the list weirdly (at least on MAC)

So the only general solution I see for this, is to do

cb.setItemDelegate(QStyledItemDelegate(cb))

I have tried many iterations and I do not see a solution for this :-|

So it seems we will have to provide some patched widgets to offer users solutions for known issues like the QComboBox which is problematic

[cculianu]

I struggled to fix it by trying all sorts of selectors and style attributes as well. This workaround does indeed work... it's good enough for now if you say no other fix is possible.

Attached is a screenshot of it working:

[goanpeca]

@dpizetta it seems we either use the cb.setItemDelegate(QStyledItemDelegate(cb)) workaround or live with the text being cropped

Either way, users will need to patch something (minimum widths, or setting the delegate)

[cculianu]

Since you say it's a bug in Qt basically I'm ok with either you guys closing this issue or re-labeling it as a Qt bug (perhaps there is value in keeping it open?).

Thanks so much for the research and hard work on it -- and for finding the workaround. For my uses, the workaround is good enough.

[dpizetta]

@goanpeca thanks for this finding. So, one more patch to our guide. I suggest we create two more tags: (qt problem, qt bug), and something like (needs code, needs a patch) to indicate that there is a solution using the code. What do you think?

@cculianu thanks for reporting :)

[cculianu]

Thanks for the help and the workaround! :)

[goanpeca]

@dpizetta sure, qt bug seems reasonable to me.

Now between these two options what do you prefer our users have to deal with?

• Setting a minimum width for comboboxes so text is not cropped
• Setting the StyleDelegate on Comboboxes

[dpizetta]

@goanpeca, I'm more comfortable with the second option. Tks

[dpizetta]

@goanpeca could you add this issue to known-issues and/or insert the patch in the code? Tks :) I think this is the last one to the release :)

[goanpeca]

@ccordoba12 I have been struggling all morning with this issue. I found: https://bugreports.qt.io/browse/QTBUG-30282

[goanpeca]

Ok I found a solution. Seems to be a persistent problem on Mac. I will open a PR for the suggested fix to this issue

[dpizetta]

Thank you @goanpeca !

[dpizetta]

Also, may we need to add to your example another combo box (editable/non-editable) with icons to keep comparison. Can you do it or would you like me to add those?

[goanpeca]

Also, may we need to add to your example another combo box (editable/non-editable) with icons to keep comparison. Can you do it or would you like me to add those?

Haha I just told you this over the PR on spyder. I think we could have a combobox that mixes items with and without icons? instead of a combobox with only icons and one without icons?

Could you do this? I tried to open the ui files and I got some error with QtDesigner

[dpizetta]

Haha I just told you this over the PR on spyder.

Heheh, yeap, almost an identical sentence hehehe.

I think we could have a combobox that mixes items with and without icons? instead of a combobox with only icons and one without icons? Could you do this? I tried to open the ui files and I got some error with QtDesigner

Ok, nice. I do it :)