Search code examples
qtqlistwidgetqlistwidgetitem

How to set icon at left of text in a QLIstWidgetItem?


I have a QListWidget which is used in iconMode as the viewMode. When I set an QIcon and the text for a QListWidgetItem, icon is showed on top of the text. If I use the QlistWidget in listMode as the viewMode, icon is shown at the left side of the text. How to show the icon at the left side of the text when the QListWidget is in iconMode ?

I tried setTextAlignment(Qt::AlignRight) for QLIstWidgetItems. But it didn't work.


Solution

  • The decorationPosition property of QStyleOptionViewItem determines the position of the icon, so the solution is to modify those properties:

    • Override viewOptions() method of QListWidget:
    #include <QtWidgets>
    
    class ListWidget: public QListWidget
    {
    public:
        using QListWidget::QListWidget;
    protected:
        QStyleOptionViewItem viewOptions() const override{
            QStyleOptionViewItem option = QListWidget::viewOptions();
            option.decorationPosition = QStyleOptionViewItem::Left;
            return option;
        }
    };
    
    int main(int argc, char *argv[])
    {
        QApplication a(argc, argv);
        ListWidget w;
        w.setViewMode(QListView::IconMode);
        for (QStyle::StandardPixmap sp: {
             QStyle::SP_ArrowBack,
             QStyle::SP_ArrowDown,
             QStyle::SP_ArrowForward,
             QStyle::SP_ArrowLeft,
             QStyle::SP_ArrowRight,
             QStyle::SP_ArrowUp})
        {
            QIcon icon = QApplication::style()->standardPixmap(sp);
            QListWidgetItem *it = new QListWidgetItem("foo");
            it->setIcon(icon);
            w.addItem(it);
        }
        w.show();
        return a.exec();
    }
    
    • Override initStyleOption() method of QStyledItemDelegate
    #include <QtWidgets>
    
    class StyledItemDelegate: public QStyledItemDelegate
    {
    public:
        using QStyledItemDelegate::QStyledItemDelegate;
    protected:
        void initStyleOption(QStyleOptionViewItem *option,
                             const QModelIndex &index) const override
        {
            QStyledItemDelegate::initStyleOption(option, index);
            option->decorationPosition = QStyleOptionViewItem::Left;
        }
    };
    
    int main(int argc, char *argv[])
    {
        QApplication a(argc, argv);
        QListWidget w;
        w.setViewMode(QListView::IconMode);
        StyledItemDelegate *delegate = new StyledItemDelegate(&w);
        w.setItemDelegate(delegate);
        for (QStyle::StandardPixmap sp: {
             QStyle::SP_ArrowBack,
             QStyle::SP_ArrowDown,
             QStyle::SP_ArrowForward,
             QStyle::SP_ArrowLeft,
             QStyle::SP_ArrowRight,
             QStyle::SP_ArrowUp})
        {
            QIcon icon = QApplication::style()->standardPixmap(sp);
            QListWidgetItem *it = new QListWidgetItem("foo");
            it->setIcon(icon);
            w.addItem(it);
        }
        w.show();
        return a.exec();
    }
    

    enter image description here