查看完整版本: [-- 基于QtWidget的聊天气泡 --]

QTCN开发网 -> Qt 作品展 -> 基于QtWidget的聊天气泡 [打印本页] 登录 -> 注册 -> 回复主题 -> 发表主题

nigoole 2019-06-16 12:33

基于QtWidget的聊天气泡

1、更新表情插入功能。
2、重新调整算法。
3、较之前的版本完善了很多功能
老版本:聊天气泡

新版展示,功能未完善,陆续更新中。
[attachment=20483]
[attachment=20484]



1、目前表情缺陷,暂时不支持动态播放。

liudianwu 2019-06-16 13:40
倪大侠牛逼啊!

nigoole 2019-06-16 15:54
liudianwu:倪大侠牛逼啊![表情] [表情] [表情]  (2019-06-16 13:40) 

感谢刘总捧场~!

gaoheyang 2019-06-17 08:30
文本能选择吗

305750665 2019-06-17 09:09
倪总太牛逼了

305750665 2019-06-17 09:10
倪总也玩梦幻西游?

listen342325 2019-06-17 09:31
能不能复制?widget不断重绘会不会高cpu?

文华在线 2019-06-17 10:17
不错的界面

nigoole 2019-06-17 10:34
gaoheyang:文本能选择吗
 (2019-06-17 08:30) 

选择功能正在改进!~目前支持单个item的文本操作,具体的拖拽划线选择还在改进中。

nigoole 2019-06-17 10:34
305750665:倪总也玩梦幻西游? (2019-06-17 09:10) 

很多年前的回忆了~抓了张以前的照片出来!应该是13年的

nigoole 2019-06-17 10:35
文华在线:不错的界面[表情]  (2019-06-17 10:17) 

感谢,继续努力中。。。

nigoole 2019-06-17 10:37
listen342325:能不能复制?widget不断重绘会不会高cpu? (2019-06-17 09:31)

纯文本的数据,cpu波动不大,如果多放几张高清大图消耗还有得看,不过图片可以处理,显示没必要加载高清,可以先图片弄成预览的分辨率,点击查看高清大图。
另外列表也在改进中,会做成只会刷新固定的个数的item,滚动切换当前显示的item,这样大大减少CPU开支!

青春的年代 2019-06-17 11:45
倪总厉害,单纯的技术没有任何广告点赞,要是贴上代码就更完美了

nigoole 2019-06-17 14:39
青春的年代:倪总厉害,单纯的技术没有任何广告点赞,要是贴上代码就更完美了 (2019-06-17 11:45) 

暂时还没打算开源!~后面再说吧~~毕竟还是雏形!

nigoole 2019-06-17 14:43
简单介绍下富文本的绘制吧:
QTextDocument+QPainter完成的,
  1. QTextDocument document;
        QTextOption option;
        option.setAlignment(Qt::AlignJustify);
        option.setWrapMode(QTextOption::WordWrap);
        document.setHtml(item->m_strText);
        document.setDefaultTextOption(option);
        document.setDefaultFont(item->m_font);
        document.setDocumentMargin(2);
        document.setTextWidth(bubbleRect.width());
        document.setDefaultStyleSheet(QString("*{color: %1;}").arg(item->m_strTextColor));
        painter->translate(bubbleRect.topLeft());
        document.drawContents(painter);// 绘制

另外试了下gif动图,目前只能依赖QMovie实现,效果勉强能接受,但是执行效率有点头疼,后面在研究改进算法
[attachment=20486]

mengkun 2019-06-18 08:45
换用新版的 QQ 小表情吧,感觉好看些

[attachment=20488]

[attachment=20487]

nigoole 2019-06-18 11:10
mengkun:换用新版的 QQ 小表情吧,感觉好看些
[图片]
[图片] (2019-06-18 08:45) 

OK!~感谢捧场

nigoole 2019-06-20 09:19
技术更新(GIF图像刷新解析)
1、最开始用的QMovie做了个demo,效果差强人意。
2、最后通过几个qt大佬的指点总结,用定时器来完成。
感谢雨田大佬lgao622的技术指点

具体操作步骤:
1、首先文本(包括表情)数据肯定是用QTextDocument来缓存。
2、判断文本数据是否包含gif图像资源,如果有,用QImageReader将图像文件每帧图像缓存到map映射表中,同时需要注意将每下一帧的延迟累加做成一个时间轴,每个时间点插入当前帧的图像,完事用QMap缓存。
3、列表里面启动一个定时器,间隔10毫秒。
4、遍历item的gif缓存数据,每到一个时间点抓取当前帧的图像,修改textdocumet的resouce资源,然后重新update下列表完成。

代码片段:
图像解析
  1. /**
    * @brief BubbleItemInfo::ReadGifPixmaps
    * 读取Gif图像文件每帧的图像数据,缓存到队列
    * @param strName
    */
    void BubbleItemInfo::ReadGifPixmaps(const QString &strName)
    {
        if (strName.isEmpty()) return;

        QImageReader reader;
        reader.setFileName(strName);
        if (reader.supportsAnimation())
        {
            QMap<int,QPixmap> pixmaps;
            int nCount = reader.imageCount();
            int ndelay = 0;

            for (int i = 0; i < nCount; i++) {
                // 跳到顺序号为i的图像
                reader.jumpToImage(i);

                // 读取图像
                if (reader.canRead())
                {
                    QImage image = reader.read();
                    ndelay += reader.nextImageDelay();
    //                image.save(QString("ttt_%1.png").arg(ndelay));
                    pixmaps.insert(ndelay, QPixmap::fromImage(image));
                }
            }

            m_gifIndex.insert(strName, 0);
            m_gifInfos.insert(strName, pixmaps);
        }
    }
遍历刷新:
  1. /**
    * @brief BubbleItemInfo::RefreshDocumentResource
    * @param bOk 返回true,表示有刷新
    */
    void BubbleItemInfo::RefreshDocumentResource(bool &bOk)
    {
        for (int i = 0; i < m_listEmotionUrl.size(); i++) {
            QString strFile = m_listEmotionUrl.at(i);

            if (!m_gifInfos.contains(strFile)) continue;

            int index = m_gifIndex.value(strFile);
            QMap<int, QPixmap> pixmaps = m_gifInfos.value(strFile);
            if (index > pixmaps.lastKey()) {
                index = 0;
            }

            // 更新time id,累加,步进10
            m_gifIndex.insert(strFile, index + 10);

            if (pixmaps.contains(index)) {
                QPixmap pixmap = pixmaps.value(index);
                if (pixmap.isNull()) { continue; }
                bOk = true;
                m_document->addResource(QTextDocument::ImageResource, QUrl(strFile), pixmap);
            } /*else if (0 == index && pixmaps.size() > 2) {
                bOk = true;
                m_document->addResource(QTextDocument::ImageResource, QUrl(strFile), pixmaps.first());
            }*/
        }
    }




liuchangyin 2019-06-20 09:51
    

305750665 2019-06-20 14:46
倪总又谦虚了。谈不上指点,就相互交流学习

fzw003 2019-06-21 08:07
QFrame 插入QTextEdit【git上面有demo,移库后 以前的帖子都丢了】 QFrame上面爱放什么东西放什么东西。纯widget+QtextEdit,基本上得把QtextEdit功能摸个遍的玩。

nigoole 2019-06-21 08:43
fzw003:QFrame 插入QTextEdit【git上面有demo,移库后 以前的帖子都丢了】 QFrame上面爱放什么东西放什么东西。纯widget+QtextEdit,基本上得把QtextEdit功能摸个遍的玩。 (2019-06-21 08:07) 

方法很多,自己想尝试不一样的方法,或者说想用自己的想法去做一些尝试!~学习学习呗~

nigoole 2019-06-21 08:47
昨天按照qq的表情框做了一份表情选择界面,同样采用QWidget完成的,鼠标悬停的时候,如果是gif会自动播放。
动图上传不了,来2个截图吧!
[attachment=20510]
[attachment=20511]

表情数据加载是直接加载目录,指定目录即可。

ustone 2019-10-25 12:44
图片是怎么绘制的?支持右键保存吗?

nigoole 2019-10-25 19:00
ustone:图片是怎么绘制的?支持右键保存吗? (2019-10-25 12:44) 

支持另存的

ustone 2019-10-25 21:19
代码开源吗?

deandx 2020-01-03 16:18
代码开源吗,想学习下

nigoole 2020-01-07 08:32
deandx:代码开源吗,想学习下 (2020-01-03 16:18) 

上一个完整版本开源了的,你可以先看看!~这个实现方式大致相同,只是换了种思路而已!

jobfind 2021-10-18 16:48
圣骑士 牛X 啊    


查看完整版本: [-- 基于QtWidget的聊天气泡 --] [-- top --]



Powered by phpwind v8.7 Code ©2003-2011 phpwind
Gzip disabled