Word wrap in QListView

[jiveaxe]

Hi everybody,
I was trying to create a listView with word wrap function for text in items (rather than using horizontal scrollbar).

I know that is necessary using delegates but the QT Manual wasn't of much help to me:

• SpinBoxDelegate example shows how insert a spinbox in a tableView but the spinBox is visible only when editing and not in view mode. It doesn't use paint().
• StarDelegate example doesn't use a common widget but a paintDevice. It reimplement paint() (obviously).

Does somebody know an example/tutorial for delegate a common widget in view mode?

Delegating a QLabel for my purpose is correct or is recommended a different widget? Have I to reimplement paint() function?

I don't still have a sample code (a decent code ) to post now, so if some patient man want submit some hints would be very appreciated.

Best regards

[marcel]

You will have to do some something similar to the star delegate, only simpler.
No editor is needed.
You need the to override the paint for the delegate, and using the painter passed to you, paint the item text.
Here is where you do the wrapping.
Based on the item width, you can insert "\n"s in the text, or you can use a QTextLayout.
With the text layout you would have to draw the text on a pixmap, and display this pixmap in the delegate.

Regards

[jiveaxe]

Ok marcel, I will follow your suggestion: modify stardelegate example and use qtextlayout.
Eventually I will post the resulting code.

Bye

[jiveaxe]

Well, I have some new and some code to post.

Following marcel's suggestion I have modified the stardelegate example removing the editor and related parts. I have changed the parameter passed to StarRating (from int, the rating, to QString, the text to wordwrap) and used the code from this post; in this way the tableWidget contains a rich text column and long text is wrapped but it overlaps rows below: the cell height is not updated to enclose the multi-line text (hoping i was clear!).

Then i have made a new copy of the source code and substituted QTableWidget with QListWidget; after some editing i have obtained a working application but without wordwrap (it used a horizontal scrollbar if text is too long).

My questions are:
1) how disable scrollbar in qlistwidget and fix the width forcing word wrap?
2) how change row height according wordwrapping?

The application, like Star Delegate example, has 2 classes:
- TextDelegate.
- TextPainter.

Here the code (sorry for the long post):

textdelegate.h

#ifndef TEXTDELEGATE_H
#define TEXTDELEGATE_H
 
#include <QItemDelegate>
 
class TextDelegate : public QItemDelegate
{
	Q_OBJECT
 
	public:
		TextDelegate(QWidget *parent = 0) : QItemDelegate(parent) {}
 
		void paint(QPainter *painter, const QStyleOptionViewItem &option,
				   const QModelIndex &index) const;
		QSize sizeHint(const QStyleOptionViewItem &option,
					   const QModelIndex &index) const;
};
 
#endif

#ifndef TEXTDELEGATE_H
#define TEXTDELEGATE_H

#include <QItemDelegate>

class TextDelegate : public QItemDelegate
{
	Q_OBJECT

	public:
		TextDelegate(QWidget *parent = 0) : QItemDelegate(parent) {}

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

#endif

To copy to clipboard, switch view to plain text mode 

textdelegate.cpp

#include <QtGui>
 
#include "textdelegate.h"
#include "textpainter.h"
 
void TextDelegate::paint(QPainter *painter, const QStyleOptionViewItem &option,
						 const QModelIndex &index) const
{
	if (qVariantCanConvert<TextPainter>(index.data())) {
		TextPainter textPainter = qVariantValue<TextPainter>(index.data());
 
		if (option.state & QStyle::State_Selected)
			painter->fillRect(option.rect, option.palette.highlight());
 
		textPainter.paint(painter, option, TextPainter::ReadOnly);
	} else {
		QItemDelegate::paint(painter, option, index);
	}
}
 
QSize TextDelegate::sizeHint(const QStyleOptionViewItem &option,
							 const QModelIndex &index) const
{
	if (qVariantCanConvert<TextPainter>(index.data())) {
		TextPainter textPainter = qVariantValue<TextPainter>(index.data());
		return textPainter.sizeHint();
	} else {
		return QItemDelegate::sizeHint(option, index);
	}
}

#include <QtGui>

#include "textdelegate.h"
#include "textpainter.h"

void TextDelegate::paint(QPainter *painter, const QStyleOptionViewItem &option,
						 const QModelIndex &index) const
{
	if (qVariantCanConvert<TextPainter>(index.data())) {
		TextPainter textPainter = qVariantValue<TextPainter>(index.data());

		if (option.state & QStyle::State_Selected)
			painter->fillRect(option.rect, option.palette.highlight());

		textPainter.paint(painter, option, TextPainter::ReadOnly);
	} else {
		QItemDelegate::paint(painter, option, index);
	}
}

QSize TextDelegate::sizeHint(const QStyleOptionViewItem &option,
							 const QModelIndex &index) const
{
	if (qVariantCanConvert<TextPainter>(index.data())) {
		TextPainter textPainter = qVariantValue<TextPainter>(index.data());
		return textPainter.sizeHint();
	} else {
		return QItemDelegate::sizeHint(option, index);
	}
}

To copy to clipboard, switch view to plain text mode 

textpainter.h

#ifndef TEXTPAINTER_H
#define TEXTPAINTER_H
 
#include <QMetaType>
#include <QString>
 
class TextPainter
{
	public:
		enum EditMode { Editable, ReadOnly };
 
		TextPainter(QString text = "");
 
		void paint(QPainter *painter, const QStyleOptionViewItem &option, EditMode mode) const;
		QSize sizeHint() const;
 
	private:
 
		QString itemText;
};
 
Q_DECLARE_METATYPE(TextPainter)
 
#endif

#ifndef TEXTPAINTER_H
#define TEXTPAINTER_H

#include <QMetaType>
#include <QString>

class TextPainter
{
	public:
		enum EditMode { Editable, ReadOnly };

		TextPainter(QString text = "");

		void paint(QPainter *painter, const QStyleOptionViewItem &option, EditMode mode) const;
		QSize sizeHint() const;

	private:

		QString itemText;
};

Q_DECLARE_METATYPE(TextPainter)

#endif

To copy to clipboard, switch view to plain text mode 

textpainter.cpp

#include <QtGui>
 
#include "textpainter.h"
 
const int PaintingScaleFactor = 20;
 
TextPainter::TextPainter(QString text)
{
	itemText = text;
}
 
QSize TextPainter::sizeHint() const
{
	return PaintingScaleFactor * QSize(itemText.length()/2-2, 1);
}
 
void TextPainter::paint(QPainter *painter, const QStyleOptionViewItem &option, EditMode mode) const
{
	if (mode == Editable) {
		painter->setBrush(option.palette.highlight());
	} else {
		painter->setBrush(option.palette.foreground());
	}
 
 
	painter->save();
	QTextDocument doc;
	doc.setHtml(itemText);
	QAbstractTextDocumentLayout::PaintContext context;
	doc.setPageSize( option.rect.size());
	painter->translate(option.rect.x(), option.rect.y()-20);
	doc.documentLayout()->draw(painter, context);
	painter->restore();
}

#include <QtGui>

#include "textpainter.h"

const int PaintingScaleFactor = 20;

TextPainter::TextPainter(QString text)
{
	itemText = text;
}

QSize TextPainter::sizeHint() const
{
	return PaintingScaleFactor * QSize(itemText.length()/2-2, 1);
}

void TextPainter::paint(QPainter *painter, const QStyleOptionViewItem &option, EditMode mode) const
{
	if (mode == Editable) {
		painter->setBrush(option.palette.highlight());
	} else {
		painter->setBrush(option.palette.foreground());
	}


	painter->save();
	QTextDocument doc;
	doc.setHtml(itemText);
	QAbstractTextDocumentLayout::PaintContext context;
	doc.setPageSize( option.rect.size());
	painter->translate(option.rect.x(), option.rect.y()-20);
	doc.documentLayout()->draw(painter, context);
	painter->restore();
}

To copy to clipboard, switch view to plain text mode 

[jiveaxe]

I forgot main.cpp (maybe someone needs it):

#include <QApplication>
#include <QListWidget>
#include <QStringList>
 
#include "textdelegate.h"
#include "textpainter.h"
 
 
int main(int argc, char *argv[])
{
	QApplication app( argc, argv );
 
	QListWidget listWidget;
	listWidget.setItemDelegate(new TextDelegate);
	listWidget.setAlternatingRowColors(true);
	listWidget.setResizeMode(QListWidget::Adjust);
 
	QStringList list;
	list << "The <b>QListWidget</b> class provides an item-based list widget."
		 << "The <b>QListWidgetItem</b> class provides an item for use with the QListWidget item view class."
		 << "The <b>QObject</b> class is the base class of all Qt objects."
		 << "Qt's <b>drag and drop</b> infrastructure is fully supported by the model/view framework. Items in lists, tables, and trees can be dragged within the views, and data can be imported and exported as MIME-encoded data.";
 
	for (int row = 0; row < list.size(); ++row) {
		QListWidgetItem *item = new QListWidgetItem;
		item->setData(0, qVariantFromValue(TextPainter(list.at(row))));
		listWidget.insertItem(row, item);
	}
 
	listWidget.setWindowTitle(QObject::tr("Text Delegate"));
	listWidget.show();
 
 
	return app.exec();
}

#include <QApplication>
#include <QListWidget>
#include <QStringList>

#include "textdelegate.h"
#include "textpainter.h"


int main(int argc, char *argv[])
{
	QApplication app( argc, argv );

	QListWidget listWidget;
	listWidget.setItemDelegate(new TextDelegate);
	listWidget.setAlternatingRowColors(true);
	listWidget.setResizeMode(QListWidget::Adjust);
	
	QStringList list;
	list << "The <b>QListWidget</b> class provides an item-based list widget."
		 << "The <b>QListWidgetItem</b> class provides an item for use with the QListWidget item view class."
		 << "The <b>QObject</b> class is the base class of all Qt objects."
		 << "Qt's <b>drag and drop</b> infrastructure is fully supported by the model/view framework. Items in lists, tables, and trees can be dragged within the views, and data can be imported and exported as MIME-encoded data.";

	for (int row = 0; row < list.size(); ++row) {
		QListWidgetItem *item = new QListWidgetItem;
		item->setData(0, qVariantFromValue(TextPainter(list.at(row))));
		listWidget.insertItem(row, item);
	}

	listWidget.setWindowTitle(QObject::tr("Text Delegate"));
	listWidget.show();


	return app.exec();
}

To copy to clipboard, switch view to plain text mode 

Bye

[marcel]

I did not test the code yet, but I don't think it is a good idea to use the text layout like that.
Anyway, keeping the code, I think you can compute the wrapped text bounding rect separately from the text layout.
You should use QFontMetrics, just like in the other post, and compute the size hint height according to how many lines of text you have and the text height(also given by font metrics ).


Regards

[jiveaxe]

How can I get the number of lines?

Thanks

[jiveaxe]

Have found numLines() in Q3MultiLineEdit; maybe switching from QTextDocument to it can help. What do you say?

Bye

Edit: Forgot this post, Q3MultiLineEdit is for QT3.

[marcel]

Look how it is done in the other post!
Generally, if the item rect is rW, and the unwrapped text width returned by font metrics tW.
You have:

float f = tW/rW;
int approxLineCount = int(f) + 1;

float f = tW/rW;
int approxLineCount = int(f) + 1;

To copy to clipboard, switch view to plain text mode 

approxLineCount tells you how many lines of text you approximately have. In the worst case it can give you one extra line, but never less than what you really have.

To get the required height for the item, just multiply approxLineCount to the text height returned by the font metrics.

Regards

[jiveaxe]

Ok marcel; I try.

Bye

[jiveaxe]

I have done some progresses, but have a problem retrieving the "item rect" (rW of marcel's last post); I tryed to get it with option.rect.width() but its value is zero and the application fault computing f. Here the new sizeHint:

QSize TextPainter::sizeHint(const QStyleOptionViewItem &option, const QModelIndex &index) const
{
	QFontMetrics fontMetrics = option.fontMetrics;
	QRect rect = fontMetrics.boundingRect(index.data().toString());
	float f = rect.width() / option.rect.width();
	int approxLineCount = int(f) + 1;
	return QSize(option.rect.width(), approxLineCount * fontMetrics.height());
}

QSize TextPainter::sizeHint(const QStyleOptionViewItem &option, const QModelIndex &index) const
{
	QFontMetrics fontMetrics = option.fontMetrics;
	QRect rect = fontMetrics.boundingRect(index.data().toString());
	float f = rect.width() / option.rect.width();
	int approxLineCount = int(f) + 1;
	return QSize(option.rect.width(), approxLineCount * fontMetrics.height());
}

To copy to clipboard, switch view to plain text mode 

Regards

[marcel]

You get a 0 width several times before the widget is actually displayed on the screen and the layout(if any) is set up.

So you should test this and do nothing if you get 0.
After the widget is properly initialized by the layout, any subsequent paint events will call your delegate's paint event and pass the correct item rect.

Regards