QListView : Increasing the cell width and height

Reply to QListView : Increasing the cell width and height on Thu, 23 Jul 2015 14:32:22 GMT

mrjj — Thu, 23 Jul 2015 14:32:22 GMT

@dheerendra
You are most welcome.
Bear in mind that you might need to support a few more type of drawing if it must support states like
disabled. Also, it does not work with styles/stylesheets without a bit of tweaking.

Reply to QListView : Increasing the cell width and height on Thu, 23 Jul 2015 13:21:11 GMT

dheerendra — Thu, 23 Jul 2015 13:21:11 GMT

@mrjj said:

QStyle* style = option.widget ? option.widget->style() : QApplication::style();
QRect rect = option.rect;

QString thetext = index.model()->data ( index.model()->index ( index.row(), 0 ) ).toString();

if ( option.state & QStyle::State_Selected ) {
    painter->save();
    // draw selection rext
    style->drawControl ( QStyle::CE_ItemViewItem, &option, painter, option.widget );
    // get icon and scale it
    QIcon icon = qvariant_cast ( index.model()->data ( index, Qt::DecorationRole ) );
    //scale it . note must be big enough or you get a smaller
    QSize mysize = option.decorationSize;
    mysize.scale ( mysize.width() + 10, mysize.width() + 10, Qt::KeepAspectRatio );
    QPixmap iconPixmap = icon.pixmap ( mysize );
    //draw icon
    painter->drawPixmap (  option.rect.x() , option.rect.center().y() - mysize.height()/2 , iconPixmap  );        
    // Change font
    QFont font = option.font;
    font.setPointSize ( option.font.pointSize() + 10 );
    painter->setFont ( font );
    // adjust text to after image
    QRect textrect = option.rect;
    textrect.setLeft ( textrect.left() + mysize.width() );
    painter->drawText ( textrect , Qt::AlignLeft | Qt::AlignVCenter, thetext );
    painter->restore();
} else {
    QStyledItemDelegate::paint ( painter, option, index );
}

}

QSize TestDelegate::sizeHint ( const QStyleOptionViewItem& option, const QModelIndex& index ) const
{
QSize result = QStyledItemDelegate::sizeHint ( option, index );
result.setHeight ( result.height() * 2 );
return result;
}

Thank you. This helps. I appreciate your help.

Reply to QListView : Increasing the cell width and height on Thu, 23 Jul 2015 12:45:07 GMT

mrjj — Thu, 23 Jul 2015 12:45:07 GMT

@dheerendra
Hi
You do not need to force it to redraw as it will when you move to it or click it.

You can try this code for test
it gets you this
http://postimg.org/image/llsmepjhj/
(update: drawn center)
Note: the icon can only scale to how large it really is. (it seems)
So a 60x60 image will max give you 60x60. So if your icon is still small when row is selected, image/icon need to be bigger.
The icon in the sample are inserted with setIcon for the listviewitem. Not sure how you put icons in.

I suspect one can do it smarter using style->drawControl and change stuff in option but never really did dig into that.

void TestDelegate::paint ( QPainter *painter, const QStyleOptionViewItem& option, const QModelIndex& index ) const
{

    QStyle* style = option.widget ? option.widget->style() : QApplication::style();
    QRect rect = option.rect;

    QString thetext = index.model()->data ( index.model()->index ( index.row(), 0 ) ).toString();

    if ( option.state & QStyle::State_Selected ) {
        painter->save();
        // draw selection rext
        style->drawControl ( QStyle::CE_ItemViewItem, &option, painter, option.widget );
        // get icon and scale it
        QIcon icon = qvariant_cast ( index.model()->data ( index, Qt::DecorationRole ) );
        //scale it . note must be big enough or you get a smaller
        QSize mysize = option.decorationSize;
        mysize.scale ( mysize.width() + 10, mysize.width() + 10, Qt::KeepAspectRatio );
        QPixmap iconPixmap = icon.pixmap ( mysize );
        //draw icon
        painter->drawPixmap (  option.rect.x() , option.rect.center().y() - mysize.height()/2 , iconPixmap  );        
        // Change font
        QFont font = option.font;
        font.setPointSize ( option.font.pointSize() + 10 );
        painter->setFont ( font );
        // adjust text to after image
        QRect textrect = option.rect;
        textrect.setLeft ( textrect.left() + mysize.width() );
        painter->drawText ( textrect , Qt::AlignLeft | Qt::AlignVCenter, thetext );
        painter->restore();
    } else {
        QStyledItemDelegate::paint ( painter, option, index );
    }

}

QSize TestDelegate::sizeHint ( const QStyleOptionViewItem& option, const QModelIndex& index ) const
{
    QSize result = QStyledItemDelegate::sizeHint ( option, index );
    result.setHeight ( result.height() * 2 ); 
    return result;
}

Reply to QListView : Increasing the cell width and height on Thu, 23 Jul 2015 12:07:01 GMT

dheerendra — Thu, 23 Jul 2015 12:07:01 GMT

Thank you. Yes delegate is the options. How do you force the redraw when the particular row is selected ? I would like to increase the font and icon size only for the row selected. Other rows(non-selected) rows should remain as is. When the new row is selected, previous selected row should be unselected as well.

Reply to QListView : Increasing the cell width and height on Thu, 23 Jul 2015 11:23:08 GMT

mrjj — Thu, 23 Jul 2015 11:23:08 GMT

Hi
I had no luck changing the font size using a style sheet so I ended up
making a delegate
You can then draw the selected row your self using bigger font and icon.

class TestDelegate : public QStyledItemDelegate
{
public:
TestDelegate(QObject* parent = 0);

protected:
virtual void paint(QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index) const;
QSize sizeHint ( const QStyleOptionViewItem& option, const QModelIndex& index ) const;

};