解决Qt重绘事件中进行了耗时的图片操作导致卡顿问题

先简单描述一下我出现的问题,我是在写一个聊天界面,然后对于图片消息来说,一旦图片比较大时,滑动聊天界面就会出现了明显卡顿情况,原因是和我在写这个ImageMessage时直接在paintEvent中就进行了耗时的图片操作,也是我对于重绘事件的不够了解导致的
在c++ - Stabilize QWidget::paintEvent() calls frequency - Stack Overflow
QWidget Class | Qt Widgets | Qt 6.9.1中可以看到.大致告诉我们在paintEvent中不要进行一些其他的操作,他只负责绘制.

我这个MessageImage就是左下角这个长矩形,有点难度的地方在这个如何计算图片放置的位置,需要用到父元素来计算,我在解决卡顿时把updateUi从paintEvent直接提出来就出现了父元素为NULL,因为我使用MessageImage没有直接传父元素给构造函数,而是先创建在放入layout中,也就导致了更新ui时出现父元素为空的情况,然后我采用的是新增一个字段表示是否完成ui更新,updateUI将state设置为false__updateUi在父元素为空时会直接返回没有更新图片和state,然后让showEvent去再判断是否成功了,没成功再执行 一次 updateUi,这样就将原本卡顿的显示解决了.

1. class MessageImage : public QWidget {
2.         Q_OBJECT
3. public:
4.         MessageImage(const QString& fileId,const QByteArray& content, bool isLeft);
5.         void updateUI(const QString& fileId, const QByteArray& content);
7. protected:
8.         void paintEvent(QPaintEvent* event) override;
9.     void showEvent(QShowEvent* event) override;
10. private:
11.     void __updateUi();
12. private:
13.         QPushButton* image;
14.         QString fileId;
15.     QPixmap image_pixmap;
16.         bool isLeft;
17.     bool state; // 0 -- 未更新
18. };
19. //==========================================================================================
20. MessageImage::MessageImage(const QString& fileId, const QByteArray& content, bool isLeft)
21.         :isLeft(isLeft),fileId(fileId),state(false)
22. {
23.         this->setSizePolicy(QSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding));
24.         this->setStyleSheet("QPushButton{border:none;} QWidget{background-color:red}");
25.     image = new QPushButton(this);
26.     if (content.isEmpty()) {
27.                 model::DataCenter* dataCenter = model::DataCenter::getInstance();
28.                 connect(dataCenter, &model::DataCenter::getSingleFileDone, this,&MessageImage::updateUI,Qt::UniqueConnection);
29.                 dataCenter->getSingleFileAsync(fileId);
30.     }
31.     else {
32.         updateUI(fileId, content);
33.     }
34. }
35. void MessageImage::updateUI(const QString& fileId, const QByteArray& content)
36. {
37.     if (this->fileId.isEmpty() || content.isEmpty()) {
38.         return;
39.     }
40.     this->fileId = fileId;
41.     __scaledImageToWidth(content, image_pixmap);
42.     this->state = false;
43.     __updateUi();
44.         this->update();
46. }
47. void MessageImage::showEvent(QShowEvent* event)
48. {
49.     QWidget::showEvent(event);
50.     if (!state) {
51.         __updateUi();  
52.     }
53. }
54. void MessageImage::paintEvent(QPaintEvent* event)
55. {
56.     Q_UNUSED(event);
57.     QWidget::paintEvent(event);
58. }
59. void __scaledImageToWidth(const QByteArray& body,__out QPixmap& pixmap) {
60.     pixmap.loadFromData(body);
61.     pixmap = pixmap.scaledToWidth(120, Qt::SmoothTransformation);
62. }
63. void MessageImage::__updateUi() {
64.     QObject* obj = this->parent();
65.     if (obj == nullptr || !obj->isWidgetType()) {
66.         return;
67.     }
68.     QWidget* parent = dynamic_cast<QWidget*> (obj);
69.     if (image_pixmap.isNull()) {
70.         image_pixmap.load(":/resource/images/xiaoju.jpg");
71.     }
72.     QRect r = image_pixmap.rect();
73.     qDebug() << "image rect " << r;
74.     parent->setMinimumHeight(r.height() + 30);
75.     image->setIconSize(QSize(r.width(), r.height()));
76.     image->setIcon(QIcon(image_pixmap));
77.     if (isLeft) {
78.         image->setGeometry(0, 0, r.width(), r.height());
79.     }
80.     else {
81.         image->setGeometry(parent->width() - r.width() - 65, 0, r.width(), r.height());
82.     }
83.     this->state = true;
84. }

复制代码

来源：程序园用户自行投稿发布，如果侵权，请联系站长删除
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！