Qt之模型/视图（自定义进度条）

在之前的章节中分享过关于QHeaderView表头排序、添加复选框等内容，相信大家模型/视图、自定义风格有了一定的了解，下面我们来分享一个更常用的内容-自定义进度条。

实现方式：

从QAbstractTableModel中设置对应的进度数据，因为我们需要显示进度条，而不是直接显示进度文本，所以原始的数据不需要直接显示在界面上，所以不需要使用Qt::DisplayRole，可以使用Qt::UserRole来代替。

委托QStyledItemDelegate中根据进度索引所对应的数据来获取进度，然后为QStyleOptionProgressBar设置进度值、显示文本等信息。

设置样式，这里需要QStyle在绘制的时候设置drawControl的最后一个参数，是一个QWidget *，这里我们使用QProgressBar即可。

void ProgressBarDelegate::paint(QPainter *painter, const QStyleOptionViewItem option, const QModelIndex index) const

 QStyleOptionViewItem viewOption(option);

 initStyleOption( viewOption, index);

 if (option.state.testFlag(QStyle::State_HasFocus))

 viewOption.state = viewOption.state ^ QStyle::State_HasFocus;

 QStyledItemDelegate::paint(painter, viewOption, index);

 if (index.column() == FILE_DOWNLOAD_PROGRESS_COLUMN)

 int nProgress = index.model()- data(index, Qt::UserRole).toInt();

 int nLeft = 8;

 int nTop = 8;

 int nWidth = option.rect.width() - 2 * nLeft;

 int nHeight = option.rect.height() - 2 * nTop;

 // 设置进度条的风格

 QStyleOptionProgressBar progressBarOption;

 progressBarOption.initFrom(option.widget);

 // 设置进度条显示的区域

 progressBarOption.rect = QRect(option.rect.left() + nLeft, option.rect.top() + nTop, nWidth, nHeight);

 // 设置最小值

 progressBarOption.minimum = 0;

 // 设置最大值

 progressBarOption.maximum = 100;

 // 设置对齐方式

 progressBarOption.textAlignment = Qt::AlignCenter;

 // 设置进度

 progressBarOption.progress = nProgress;

 // 设置文本（百分比）

 progressBarOption.text = QString("%1%").arg(nProgress);

 // 设置文本可见

 progressBarOption.textVisible = true;

 QProgressBar progressBar;

 //绘制进度条

 QApplication::style()- drawControl(QStyle::CE_ProgressBar, progressBarOption, painter, progressBar);

}

FileDownloadRecord record; record.strFileName = QString("/root/user/file%1.log").arg(i + 1); record.nSize = 1024 / ((i + 2) *(i + 2)) ; record.nStatus = i; record.nProgress = qrand() % 100 + 1; list.append(record); emit transfer(list); msleep(1000); }

这里为了美观，我设置进度条距离左、上、右、下的距离均为8px，而且单元格里面只显示了一个进度条。

这里只需要控制好单元格绘制区域位置rect即可，你可以在里面添加任意自定义的控件，而且可以添加任意多个，随意排列组合。

C/C++ Qt StandardItemModel 数据模型应用 QStandardItemModel 是标准的以项数据为单位的基于M/V模型的一种标准数据管理方式，Model/View 是Qt中的一种数据编排结构，其中Model代表模型，View代表视图，视图是显示和编辑数据的界面组件，而模型则是视图与原始数据之间的接口，通常该类结构都是用在数据库中较多，例如模型结构负责读取或写入数据库，视图结构则负责展示数据，其条理清晰，编写代码便于维护。
C/C++ Qt QChart 绘图组件应用 QtCharts 组件是QT中提供图表绘制的模块，该模块可以方便的绘制常规图形，Qtcharts 组件基于`GraphicsView`模式实现，其核心是`QChartView`和`QChart`的二次封装版。
C/C++ Qt TableWidget 表格组件应用 TableWidget 表格结构组件，该组件可以看作是TreeWidget树形组件的高级版，表格组件相比于树结构组件灵活性更高，不仅提供了输出展示二维表格功能，还可以直接对表格元素直接进行编辑与修改操作，表格结构分为表头，表中数据两部分，表格结构可看作一个二维数组，通过数组行列即可锁定特定元素，如下代码是针对表格结构的基本使用方法，分别实现了表头数据的初始化，元素的插入等基本操作。