QTextEdit 实现自适应高度的聊天气泡（简单易懂有注释）

DamonGX

已于 2023-01-26 20:16:14 修改

阅读量938

点赞数 3

文章标签： ui qt 开发语言

于 2023-01-26 20:09:46 首次发布

本文链接：https://blog.csdn.net/RexSalt/article/details/128767261

版权

查阅了很多博客，直接照抄也无法实现自适应高度的聊天气泡，因此自己不断地尝试，终于完成可以用的简单版本

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
   
    ui->setupUi(this);
//    ui->textEdit->setAlignment(Qt::AlignCenter);

    connect(ui->textEdit,&QTextEdit::textChanged,this,&Widget::myResize)

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

DamonGX

关注关注

3
点赞
踩
12

收藏

觉得还不错? 一键收藏
3
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

Qt实现聊天气泡功能（附完整源码）

希望我的博客，能帮上你解决学习中工作中所遇到的问题

07-25

814

Qt实现聊天气泡功能（附完整源码）

QT中 QPlainTextEdit自适应高度的问题（防止出现滚动条）

C++ 开发者的博客

12-18

3092

问题说明在QT开发过程中，经常使用到QPlainTextEdit来填入大量的文字，一般我们都会设置QPlainText的固定高度或者默认高度，但是随着文字的增多，就会自动出现滚动条，有时候我们可能需要QPlainText的高度随着自动适应文字的高度（即是说不需要出现滚动条）解决办法解决办法参考 QPlainText自适应高度的论坛，发现如果有大量空行，还是会出现滚动条，因此就在此基础上修改了一下，是否正确需要自己去验证一下，代码如下： int getDivisionValue(int x,int y)

3 条评论您还未登录，请先登录后发表或查看评论

Qt实现微信气泡聊天效果

03-12

Qt实现微信气泡聊天效果，这里只是做了一个Demo,可以发送消息，消息撤回使用QWebChannl HTML与Qt通信，取出撤回的消息序号，从而撤回消息。https://blog.csdn.net/qq_25532071/article/details/88427192文章中有效果及详细介绍

QML仿微信聊天界面-消息气泡自适应

最新发布

wertertwtyetytey的博客

03-16

3264

实现消息气泡自适应变换：中英文混合自适应；自动换行自适应；单行文本：多行文本改变宽度文本自动调整实现方案： Rectangle{ id:bodyleft height:ctxLH*(tt.lineCount-1)+35 implicitWidth:Mat...

Qt实现的聊天画面消息气泡

老杜的博客

12-12

1512

采用基于QWidget+Mingw实现的原生的消息气泡通过覆写QWidget::paintEvent(QPaintEvent *event)方法，每当窗口尺寸变化时都会触发paintEvent事件，在覆写QWidget::paintEvent(QPaintEvent *event)方法中重新绘制聊天气泡在QListWidget添加QListWidgetItem项目实现聊天气泡，可以实现气泡跟随窗口尺寸变化而动态的使气泡的宽高。

Qt5气泡式聊天框.rar

07-29

气泡聊天，自己重绘界面，根据此链接，在满足自己的需求上，进行适当的修改， https://blog.csdn.net/u014597198/article/details/81505832 不足之处，可能是对英文的分割还不是很好，对中文还是可以的

Qt中QTextEdit高度自适应

01-06

当QTextEdit中输入的文字长度过长，QTextEdit就会出现滚动条。如果不想出现滚动条，而想QTextEdit的高度随着文字的增加或减少而改变。 //widget.h #ifndef WIDGET_H #define WIDGET_H #include #include #include #include class Widget : public QWidget { Q_OBJECT public: Widget(QWidget *parent = 0); ~Widget(); QTextEdit *textEdit; private slots:

基于qt开发的一款聊天气泡框

09-18

一直想开发一款聊天应用，但是苦于聊天气泡框的实现，拖了好几年，最近心血来潮，觉得再次研究一番，又是从qt+webivew实现，到网上案例走了一遍，感觉都不理想，于是想着自己重头实现以一下，花了两天，终于做出来了，效果还不错，代码也很简洁，居然只四百行，一个类文件搞定，不可思议，看来自己做的才是最合适的，其他人搞的都太复杂，参考https://blog.csdn.net/fanhenghui/article/details/108670603，需要源码找我私聊

QT5开发的气泡聊天Demo，简单易懂

04-18

参考网上其他大能的资料做的demo，简单易懂，资源是整个QT工程代码，用QT5.14.2开发的，气泡聊天展示效果图见https://blog.csdn.net/u014385680/article/details/105585630

Qt实现PC端微信中的聊天气泡

qq_22302267的博客

10-12

3619

效果在网上找了一些Qt实现的聊天气泡,都不尽如人意，有的是不能复制聊天text，有的是text显示不全，以下是QTextEdit适应text高度的代码: void TextBubble::adjustTextHeight() { qreal doc_margin = m_pTextEdit->document()->documentMargin(); //字体到...

Qt 绘制的聊天气泡效果

03-23

Qt 绘制的聊天气泡效果

QWidget 绘制的聊天气泡效果

12-12

基于Qt5设计的QWidget聊天气泡样式，列表刷新，每次只会刷新当前几个ITEM，内存可禁得起考验的。详细介绍参考： http://www.qtcn.org/bbs/read-htm-tid-62316.html

Demo_MessageChat_Qt:Qt5气泡式聊天框——QListWidget+QPainter。气泡式聊天的显示是由QListWidget作为控件，每个气泡是由QListWidgetItem提升成QWidget来实现的。每个气泡可以理解为可以自由布置里面内容的QWidget。每个Item保存聊天的对话、发送状态、时间、种类等。这个QWidget主要是显示一个头像+气泡，气泡里面是聊天的内容等。气泡是在paintEvent事件中，采用QPainter来绘制的

05-12

1、Qt的应用开发之 Demo_MessageChat_Qt Qt5气泡式聊天框——QListWidget+QPainter。气泡式聊天的显示是由QListWidget作为控件，每个气泡是由QListWidgetItem提升成QWidget来实现的。每个气泡可以理解为可以自由布置里面内容的QWidget。每个Item保存聊天的对话、发送状态、时间、种类等。这个QWidget主要是显示一个头像+气泡，气泡里面是聊天的内容等。气泡是在paintEvent事件中，采用QPainter来绘制的。 2、更新信息开发者：沙振宇（沙师弟专栏）创建时间：2018-07-23 最后一次更新时间：2019-12-27 此项目CSDN博客：Qt5气泡式聊天框——QListWidget+QPainter实现此项目博客地址： 3、效果

qt 气泡聊天界面_微信聊天气泡框素材

hw5230的博客

06-07

1190

QT仿微信聊天气泡

weixin_73548574的博客

01-30

540

qt仿微信聊天气泡

QTextEdit/QTextBrowser自适应高度

xiehanhust的博客

09-19

2584

QTextEdit/QTextBrowser自适应高度

QT用QWidget做的气泡聊天功能，可发图片、文件、文本等气泡信息，功能简单，适合初学者

蓝之羽的博客

04-17

4903

参考网上其他大能的demo，自己写了个比较简单的气泡聊天demo，可以发图片、文件、文字信息，在气泡信息上有右键菜单复制文本功能，图片可以双击打开，文件可以右键菜单打开文件和打开目录；气泡信息之前有显示日期功能，日期显示功能在不活动3钟后会再次插入显示；效如下：暂不支持GIF动画展示，所以demo还没上传 ...

C++ Qt 实现微信聊天界面、气泡消息、gif斗图、表情包

琅嬛福地

01-04

5873

在使用Qt开发项目时，如果有气泡消息的需求，那将是很麻烦的事情，相比其它控件的自定义，气泡消息比较复杂，例如下图：当消息的数量超过聊天窗口时需要处理上下滑动，还有动态图片gif的显示等，消息的气泡是异形窗口，用Qt实现问题不大，但是整个聊天还会涉及到其它内容，例如链接的解析，显然用qt来做将是很复杂的。聊天界面设计下面介绍如何使用Qt QWebEngineView和html js实现类似微信的聊天信息窗口，demo 界面如下：如果你是手写布局，可以直接使用QWebEngineView，我是在Qt

QTextEdit自适应高度

03-09

QTextEdit是Qt框架中的一个文本编辑器控件，它可以用于显示和编辑文本内容。要实现QTextEdit的自适应高度，可以通过以下步骤进行操作： 1. 设置QTextEdit的文本内容自动换行：可以使用`setWordWrapMode`函数将文本内容设置为自动换行模式，这样当文本内容超出QTextEdit的宽度时，会自动换行显示。 2. 监听QTextEdit的文本内容变化：可以使用`textChanged`信号来监听QTextEdit的文本内容变化。当文本内容发生变化时，可以根据文本内容的长度来调整QTextEdit的高度。 3. 调整QTextEdit的高度：可以使用`setFixedHeight`函数来设置QTextEdit的固定高度，根据文本内容的行数和每行的高度来计算出合适的高度值，并将其设置为QTextEdit的高度。下面是一个示例代码，演示了如何实现QTextEdit的自适应高度： ```cpp // 设置QTextEdit的自适应高度 void setAdaptiveHeight(QTextEdit* textEdit) { // 设置文本内容自动换行 textEdit->setWordWrapMode(QTextOption::WrapAtWordBoundaryOrAnywhere); // 监听文本内容变化 QObject::connect(textEdit, &QTextEdit::textChanged, [=]() { // 获取文本内容 QString text = textEdit->toPlainText(); // 获取每行的高度 int lineHeight = textEdit->fontMetrics().lineSpacing(); // 计算文本内容的行数 int lineCount = text.count('\n') + 1; // 计算合适的高度值 int height = lineCount * lineHeight; // 设置QTextEdit的高度 textEdit->setFixedHeight(height); }); } ``` 使用上述代码，可以将`setAdaptiveHeight`函数应用到需要自适应高度的QTextEdit控件上，当文本内容发生变化时，QTextEdit的高度会自动调整以适应文本内容的显示。