Add custom items to QListWidget

Question

How can I add customized items to a QListWidget with a background color that I choose, and add a bottom border to each item, like this draft example in the picture below.

This is the code that I wrote:

from PyQt5 import QtWidgets, QtGui
import sys


class CustomListHead(QtWidgets.QWidget):
    def __init__(self):
        super(CustomListHead, self).__init__()
        self.project_title = QtWidgets.QLabel("Today")
        self.set_ui()

    def set_ui(self):
        grid_box = QtWidgets.QGridLayout()
        grid_box.addWidget(self.project_title, 0, 0)

        self.setLayout(grid_box)
        self.show()


class CustomListItem(QtWidgets.QWidget):
    def __init__(self):
        super(CustomListItem, self).__init__()
        self.project_title = QtWidgets.QLabel("Learn Python")
        self.task_title = QtWidgets.QLabel("Learn more about forms, models and include")
        self.set_ui()

    def set_ui(self):
        grid_box = QtWidgets.QGridLayout()

        grid_box.addWidget(self.project_title, 0, 0)
        grid_box.addWidget(self.task_title, 1, 0)

        self.setLayout(grid_box)
        self.show()


class MainWindowUI(QtWidgets.QMainWindow):
    def __init__(self):
        super(MainWindowUI, self).__init__()
        self.list_widget = QtWidgets.QListWidget()
        self.set_ui()

    def set_ui(self):
        custom_head_item = CustomListHead()

        item = QtWidgets.QListWidgetItem(self.list_widget)
        item.setSizeHint(custom_head_item.sizeHint())

        self.list_widget.setItemWidget(item, custom_head_item)
        self.list_widget.addItem(item)

        custom_item = CustomListItem()
        item = QtWidgets.QListWidgetItem(self.list_widget)
        item.setSizeHint(custom_item.sizeHint())

        self.list_widget.addItem(item)
        self.list_widget.setItemWidget(item, custom_item)

        vertical_layout = QtWidgets.QVBoxLayout()
        vertical_layout.addWidget(self.list_widget)

        widget = QtWidgets.QWidget()
        widget.setLayout(vertical_layout)
        self.setCentralWidget(widget)
        self.show()


app = QtWidgets.QApplication(sys.argv)
ui = MainWindowUI()
sys.exit(app.exec_())

example

Pavan Chandaka Pavan Chandaka · Accepted Answer · 2016-10-05T20:39:04

I see you have QListWidgetItem with you.

From documentation you can customize each widget item, customize it and add to your listwidget:

The appearance of the text can be customized with setFont(), setForeground(), and setBackground(). Text in list items can be aligned using the setTextAlignment() function. Tooltips, status tips and "What's This?" help can be added to list items with setToolTip(), setStatusTip(), an d setWhatsThis().

http://doc.qt.io/qt-5/qlistwidgetitem.html#details

Add custom items to QListWidget

1 Answers