python - PyQt QListWidget custom items

Question

how can i create a QListWidgetItem that has 1 image and 2 labels/strings underneath, that have support for css?

this is the last thing i have tried:

class CustomListWidgetItem(QListWidgetItem, QLabel):
    def __init__(self, parent=None):
        QListWidgetItem.__init__(self, parent)
        QLabel.__init__(self, parent)

i'm using PyQt btw

Can you explain why that didn't work? Did you get error messages or just not see the behavior you expected? — skrrgwasme
because in the next line i tried doing self.setText("test") and it didnt display "test" — HKH515

Kitsune Meyoko Kitsune Meyoko · Accepted Answer · 2014-08-07T17:43:06

how can i create a QListWidgetItem that has 1 image and 2 labels/strings underneath, that have support for css?

In this case, you can't (it actually has an API for adding icons easily, but two labels/strings is impossible). But, you can create your own custom widget and put it into QtGui.QListWidget.

Create your custom widget.
Create your QtGui.QListWidget in the main application.
Create a custom widget object and set item in QListWidgetItem by QListWidgetItem is in QtGui.QListWidget by using the QListWidget.setItemWidget (self, QListWidgetItem item, QWidget widget) method.

This is an example to explain my solution:

import sys
from PyQt4 import QtGui

class QCustomQWidget (QtGui.QWidget):
    def __init__ (self, parent = None):
        super(QCustomQWidget, self).__init__(parent)
        self.textQVBoxLayout = QtGui.QVBoxLayout()
        self.textUpQLabel    = QtGui.QLabel()
        self.textDownQLabel  = QtGui.QLabel()
        self.textQVBoxLayout.addWidget(self.textUpQLabel)
        self.textQVBoxLayout.addWidget(self.textDownQLabel)
        self.allQHBoxLayout  = QtGui.QHBoxLayout()
        self.iconQLabel      = QtGui.QLabel()
        self.allQHBoxLayout.addWidget(self.iconQLabel, 0)
        self.allQHBoxLayout.addLayout(self.textQVBoxLayout, 1)
        self.setLayout(self.allQHBoxLayout)
        # setStyleSheet
        self.textUpQLabel.setStyleSheet('''
            color: rgb(0, 0, 255);
        ''')
        self.textDownQLabel.setStyleSheet('''
            color: rgb(255, 0, 0);
        ''')

    def setTextUp (self, text):
        self.textUpQLabel.setText(text)

    def setTextDown (self, text):
        self.textDownQLabel.setText(text)

    def setIcon (self, imagePath):
        self.iconQLabel.setPixmap(QtGui.QPixmap(imagePath))

class exampleQMainWindow (QtGui.QMainWindow):
    def __init__ (self):
        super(exampleQMainWindow, self).__init__()
        # Create QListWidget
        self.myQListWidget = QtGui.QListWidget(self)
        for index, name, icon in [
            ('No.1', 'Meyoko',  'icon.png'),
            ('No.2', 'Nyaruko', 'icon.png'),
            ('No.3', 'Louise',  'icon.png')]:
            # Create QCustomQWidget
            myQCustomQWidget = QCustomQWidget()
            myQCustomQWidget.setTextUp(index)
            myQCustomQWidget.setTextDown(name)
            myQCustomQWidget.setIcon(icon)
            # Create QListWidgetItem
            myQListWidgetItem = QtGui.QListWidgetItem(self.myQListWidget)
            # Set size hint
            myQListWidgetItem.setSizeHint(myQCustomQWidget.sizeHint())
            # Add QListWidgetItem into QListWidget
            self.myQListWidget.addItem(myQListWidgetItem)
            self.myQListWidget.setItemWidget(myQListWidgetItem, myQCustomQWidget)
        self.setCentralWidget(self.myQListWidget)

app = QtGui.QApplication([])
window = exampleQMainWindow()
window.show()
sys.exit(app.exec_())

Note: I have image file icon.png, size 48 x 48 pixel.

QListWidget.setItemWidget

Experimental result

enter image description here

python - PyQt QListWidget custom items

1 Answers