Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Vertically centered QListView



  • Hi,

    I have a QListView with default settings (top to bottom flow). I'd like the items to be displayed centered vertically, i.e. if they don't take up the whole height of the list widget, the free space should be distributed evenly at the top and bottom of the list.

    Is there a way to achieve that?

    Thanks.



  • Depends on either the model or the delegate.

    If your model is writable and supports multiple roles you can use:

    QAbstractItemModel* const model = listView->model();
    for(int i=model->rowCount()-1;i>=0;--i{
    Q_ASSUME(model->setData(model->index(i,0),Qt::AlignVCenter,Qt::TextAlignmentRole));
    }
    

    Otherwise subclass QStyledItemDelegate:

    class AlignVCenterDelegate : public QStyledItemDelegate{
    Q_OBJECT
    Q_DISABLE_COPY(AlignCenterDelegate)
    public:
    explicit AlignCenterDelegate(QObject* parent=Q_NULLPTR) : QStyledItemDelegate(parent){}
    void paint(QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index) const Q_DECL_OVERRIDE 
    {
        Q_ASSERT(index.isValid());
        QStyleOptionViewItem opt = option;
        initStyleOption(&opt, index);
        opt.displayAlignment=Qt::AlignVCenter;
        const QWidget *widget =option.widget;
        QStyle *style = widget ? widget->style() : QApplication::style();
        style->drawControl(QStyle::CE_ItemViewItem, &opt, painter, widget);
    }
    };
    

    and call listView->setItemDelegate(new AlignVCenterDelegate(listView));



  • I'm afraid it doesn't work for me.

    I just created the simplest project possible which creates a model and a delegate (here it is: https://bitbucket.org/rsippl/vcenterqlistview). In the delegate, I used your code. I also tried returning Qt::AlignVCenter in the model's data method, still no success. As you can see in the picture, all list entries are at the top of the window, not vertically centered:
    0_1521232707755_notcentered.png


  • Lifetime Qt Champion

    Hi and welcome to devnet,

    If I understand things correctly, you would have to re-implement the delegate sizeHint method to make the item take more space vertically.



  • @SGaist, hi, thank you. Which item, the first one? How do I calculate that additional vertical space? I guess that would be the height of the widget minus the sum of the height of each item. If that difference is positive, half of it would be what I'm looking for. I can get the height of the items via the model, but how do I get the height of the widget from inside the item delegate?


  • Lifetime Qt Champion

    After further thinking, you may have to implement your own view to handle that case. The model does indeed have no idea what the view is (and it must not) and the delegate doesn't have that information either.



  • I got it to work by extending the QListView. In the resizeEvent() method, I compute how much vertical space the items take up, compare that to the height of the widget, then set the viewport margins accordingly. Thanks!



  • if you want the lines to grow to fill the viewport:
    replace qlistview with qtableview and then call:

    tableview->verticalHeader()->setSectionResizeMode(QHeaderView::Stretch);
    tableview->verticalHeader()->hide();
    tableview->horizontalHeader()->setSectionResizeMode(QHeaderView::Stretch);
    tableview->horizontalHeader()->hide();
    tableview->setShowGrid(false);
    

    If you want the viewport to shrink to the number of elements use listView->setSizeAdjustPolicy(QAbstractScrollArea::AdjustToContents);


Log in to reply