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

Brucine

Can you explain why that didn't work? Did you get error messages or just not see the behavior you expected? – Halley

because in the next line i tried doing self.setText("test") and it didnt display "test" – Brucine

Answer 1

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.

1. Create your custom widget.

2. Create your QtGui.QListWidget in the main application.

3. 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

Idioblast

This example is too fabulous awesome! (With Nyaruko wwww) Thank you! – Foursome

Bump. I have a question here @Kitsune How would you access the items in myQCustomQWidget ? If i select the [0] row from the main QList how would i access to the text variable in myQCustomQWidget for example the TextDown ? – Emulsion

@Arukaito, you could simply add a method in class QCustomQWidget def getTextUp(self): return self.textUpQLabel.text() and access it as follows for row in range(self.myQListWidget.count()): item = self.myQListWidget.itemWidget(self.list.item(row)) text = item.getTextUp() – Lillis