在没有确切了解您希望列表项是什么样子的情况下,建议“最佳”解决方案有点困难,但我们会尝试一下。
Qt 线程上实际上有一篇很棒的帖子here最后给出了他们用来创建列表的所有代码,类似于他们在顶部显示的列表。
基本上,每个项目都有一个大图标,右侧有标题和描述文本,每个项目的样式都不同。
创建自定义委托听起来很可怕,但它基本上只是为列表提供一个自定义小部件。它的工作原理本质上就像一个模板。您可以定义列表项的外观,并使用列表中的数据来绘制它。您只需继承 QAbstractItemDelegate 即可。
#include <QPainter>
#include <QAbstractItemDelegate>
class ListDelegate : public QAbstractItemDelegate
{
public:
ListDelegate(QObject *parent = 0);
void paint ( QPainter * painter, const QStyleOptionViewItem & option, const QModelIndex & index ) const;
QSize sizeHint ( const QStyleOptionViewItem & option, const QModelIndex & index ) const;
virtual ~ListDelegate();
};
最大的工作是编写绘制函数的代码。我将在这里展示基础知识,但您可以参考上面的链接以获取更长的示例。
ListDelegate::ListDelegate(QObject *parent)
: QAbstractItemDelegate(parent)
{
}
void ListDelegate::paint ( QPainter * painter, const QStyleOptionViewItem & option, const QModelIndex & index ) const
{
QRect r = option.rect;
QPen fontPen(QColor::fromRgb(51,51,51), 1, Qt::SolidLine);
if(option.state & QStyle::State_Selected)
{
painter->setBrush(Qt::cyan);
painter->drawRect(r);
}
else
{
//BACKGROUND ALTERNATING COLORS
painter->setBrush( (index.row() % 2) ? Qt::white : QColor(252,252,252) );
painter->drawRect(r);
}
painter->setPen(fontPen);
//GET TITLE, DESCRIPTION AND ICON
QIcon ic = QIcon(qvariant_cast<QPixmap>(index.data(Qt::DecorationRole)));
QString title = index.data(Qt::DisplayRole).toString();
QString description = index.data(Qt::UserRole).toString();
int imageSpace = 10;
if (!ic.isNull())
{
//ICON
r = option.rect.adjusted(5, 10, -10, -10);
ic.paint(painter, r, Qt::AlignVCenter|Qt::AlignLeft);
imageSpace = 55;
}
//TITLE
r = option.rect.adjusted(imageSpace, 0, -10, -30);
painter->setFont( QFont( "Lucida Grande", 6, QFont::Normal ) );
painter->drawText(r.left(), r.top(), r.width(), r.height(), Qt::AlignBottom|Qt::AlignLeft, title, &r);
//DESCRIPTION
r = option.rect.adjusted(imageSpace, 30, -10, 0);
painter->setFont( QFont( "Lucida Grande", 5, QFont::Normal ) );
painter->drawText(r.left(), r.top(), r.width(), r.height(), Qt::AlignLeft, description, &r);
}
QSize ListDelegate::sizeHint ( const QStyleOptionViewItem & option, const QModelIndex & index ) const
{
return QSize(200, 60); // very dumb value
}
ListDelegate::~ListDelegate()
{
}
所以你可以在这段代码中看到我们从列表中获取了三位数据。图标、标题和说明。然后我们显示绘制图标,并按照我们喜欢的方式绘制两个文本字符串。但重要的部分是获取数据本身。我们基本上是要求列表使用传递给我们的“索引”为我们提供数据。
QIcon ic = QIcon(qvariant_cast<QPixmap>(index.data(Qt::DecorationRole)));
QString title = index.data(Qt::DisplayRole).toString();
QString description = index.data(Qt::UserRole + 1).toString();
您会注意到每一位信息都是使用不同的“角色”检索的。通常,列表只显示一项内容 - 通过 DisplayRole 访问。图标存储在 DecorationRole 中。但如果您想存储更多内容,那么您可以开始使用 UserRole。您可以使用 UserRole、UserRole +1、UserRole +2 等来存储大量内容......
那么如何将所有这些信息存储在每个项目中。简单的...
QListWidgetItem *item = new QListWidgetItem();
item->setData(Qt::DisplayRole, "Title");
item->setData(Qt::UserRole, "Description");
myListWidget->addItem(item);
最后,如何使用您精美的新委托使列表显示该项目?
myListWidget->setItemDelegate(new ListDelegate(myListWidget));
希望这能澄清一些事情。