Qt重新绘制ComboBox

最新推荐文章于 2024-06-22 13:51:39 发布
最新推荐文章于 2024-06-22 13:51:39 发布
阅读量1.2k 收藏 1
点赞数 1
分类专栏： Qt 文章标签： Qt ComboBox 自定义控件 绘制
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u014147126/article/details/117783660
版权

文章目录

前言

Qt 重新绘制ComboBox，原因无他，没想到自己画的更丑。自定义控件看这篇，这里就直接画了
在这里插入图片描述

一、基类？

继承QComboBox，继承QWidget更好，相当于自己重新写个控件，这里主要是懒，想用现成的东西……

二、使用步骤

1.代码文件

代码如下（没啥好看的，瞎写的废话），完整项目压缩包放最后：

.h文件

#ifndef SELFCOMBOBOX_H
#define SELFCOMBOBOX_H

#include <QComboBox>

class SelfComboBox : public QComboBox
{
    Q_OBJECT

public:
    SelfComboBox(QWidget *parent = 0);
    ~SelfComboBox();

    void paintEvent(QPaintEvent *e) override;
    //覆盖
    void addItem(const QString &text, const QVariant &userData = QVariant());
    void insertItem(int index, const QString &text, const QVariant &userData = QVariant());

    //属性
    Q_PROPERTY(qreal itemHeight READ getItemHeight WRITE setItemHeight);
    Q_PROPERTY(QFont font READ getFont WRITE setFont);
    Q_PROPERTY(double viewSpace READ getViewSpace WRITE setViewSpace);

protected:
    void focusOutEvent(QFocusEvent *e) override;

public slots:
    void wheelEvent(QWheelEvent *event) override;
    void mousePressEvent(QMouseEvent *event) override;
    void mouseReleaseEvent(QMouseEvent *event) override;
    void mouseMoveEvent(QMouseEvent *event) override;
    void resizeEvent(QResizeEvent *e) override;
    void onTimerCallBack();
    void onViewTimerCallBack();

    double getItemHeight(){return itemHeight;}
    void setItemHeight(double iHeight);
    QFont getFont(){return font;}
    void setFont(QFont f);
    double getViewSpace(){return viewSpace;}
    void setViewSpace(double vs);

private:
    double radius = 1;
    double maxRadius = 255;
    double minRadius = 1;
    bool isExpand = false;
    double yOffect = 0;
    bool isViewOpen = false;
    int curOpenNum = 0;
    int maxNum = 4;
    int curDrawNum = 0;
    int curTopIndex = 0;
    int curClickNum = -1;
    int roundRadius = 8;
    qreal itemHeight = 0.0;
    int space = 2;
    QFont font = QFont("SimHei", 18);
    double viewSpace = 15.0;
//    QString comboStr = "Select";
    QRect *activePoints = nullptr;
    //数据存储
    QStringList allData;
    QVariantList allVData;

    QTimer *timer = nullptr;
    QTimer *viewTimer = nullptr;
    void drawRoundedView(QPainter *);
    void drawRoundedViewTitle(QPainter *);
    void onComboBtnClick();
    void onAnimChange(bool isExpand);
};

#endif // SELFCOMBOBOX_H

.cpp文件 挑重点发……

void SelfComboBox::paintEvent(QPaintEvent *e)
{
    QPainter painter(this);
    painter.setRenderHint(QPainter:: Antialiasing, true);
    this->drawRoundedViewTitle(&painter);
    //最主要的绘制地方就是这个啦
    this->drawRoundedView(&painter);
}

//重写
void SelfComboBox::addItem(const QString &text, const QVariant &userData)
{
    this->allData.push_back(text);
    this->allVData.push_back(userData);
    if(this->allData.length() == 1)
    {
        this->setCurrentIndex(0);
        this->setCurrentText(text);
    }
    //懒得维护count之类的……
    QComboBox::addItem(text, userData);
    update();
}

void SelfComboBox::focusOutEvent(QFocusEvent *e)
{
    if(this->viewTimer && this->viewTimer->isActive())
    {
        this->viewTimer->stop();
    }
    this->isViewOpen = false;
    this->viewTimer->start(10);
}
//下方区域滚动
void SelfComboBox::wheelEvent(QWheelEvent *event)
{
    this->yOffect += (event->delta() * 0.25);
    this->yOffect = this->yOffect <= 0.0 ? 0.0 : this->yOffect;
    update();
}

void SelfComboBox::mousePressEvent(QMouseEvent *event)
{
    if(this->viewTimer && this->viewTimer->isActive())
    {
        this->viewTimer->stop();
    }
    QRect detectArea(0, 0, width(), itemHeight);
    if(detectArea.contains(event->pos()))
    {
        this->isViewOpen = !this->isViewOpen;
        this->viewTimer->start(50);
    }
    //下方区域检测
    this->curClickNum = -1;
    if(event->button() == Qt::LeftButton)
    {
        for (int i = 0; i < this->curDrawNum; i++)
        {
            if(this->activePoints[i].contains(event->pos()))
            {
                this->curClickNum = i + this->curTopIndex;
                this->onAnimChange(true);
                break;
            }
        }
    }
}

void SelfComboBox::mouseReleaseEvent(QMouseEvent *event)
{
    if(this->curClickNum != -1)
    {
        this->setCurrentIndex(this->curClickNum);
        this->setCurrentText(this->allData[this->curClickNum]);

        this->focusOutEvent(nullptr);
    }
    this->onAnimChange(false);
}

void SelfComboBox::mouseMoveEvent(QMouseEvent *event)
{
    // 这里必须使用buttons()
    if(event->buttons() & Qt::LeftButton) //进行的按位与
    {
        this->curClickNum = -1;
        for (int i = 0; i < this->curDrawNum; i++)
        {
            if(this->activePoints[i].contains(event->pos()))
            {
                this->curClickNum = i + this->curTopIndex;
                update();
                break;
            }
        }
    }
}

void SelfComboBox::drawRoundedView(QPainter *painter)
{
    if(this->curOpenNum <= 0)
    {
        return;
    }
	//为啥这里逻辑那么奇怪（主要是我先在这里面写完，再把变量提出去的……）
    int maxNum = this->curOpenNum;
    int drawNum = maxNum;
    //数据条
    int dataNum = this->count();//this->count();
    //第一个起点
    //Y偏移量
    int bgOffect = 2;
    double beginPosX = 2, beginPosY = itemHeight + this->viewSpace, itemWidth = width() - bgOffect * 2;
    double bgBeginPosY = beginPosY;
    if(dataNum <= maxNum)
    {
        maxNum = dataNum;
        yOffect = 0;
    }
    curTopIndex = floor(yOffect * 1.0 / (itemHeight + space));
    int curBottomIndex = curTopIndex + maxNum;
    double topLeftNum = (yOffect * 1.0 / (itemHeight + space)) - curTopIndex;
    curTopIndex = curTopIndex + maxNum >= dataNum ? dataNum - maxNum: curTopIndex;
    topLeftNum = curTopIndex + maxNum >= dataNum ? 0.0: topLeftNum;
    curBottomIndex = curTopIndex + maxNum;
    if(topLeftNum > 0.0)
    {
        curBottomIndex += 1;
        drawNum += 1;
    }
    if(yOffect >= (dataNum - maxNum) * (itemHeight + space))
    {
        yOffect = (dataNum - maxNum) * (itemHeight + space);
    }
    this->curDrawNum = drawNum;
    beginPosY = beginPosY - topLeftNum * (itemHeight);
    //画背景
    painter->setPen(Qt::PenStyle::NoPen);
    QBrush brush(Qt::BrushStyle::SolidPattern);
    brush.setColor(QColor(15, 15, 15, 255 * 0.1));
    painter->setBrush(brush);
    painter->drawRoundedRect(beginPosX-bgOffect, bgBeginPosY+bgOffect, itemWidth+bgOffect * 2, itemHeight * maxNum + space * (maxNum - 1), this->roundRadius, this->roundRadius);
    painter->setClipRegion(QRegion(beginPosX, bgBeginPosY, itemWidth, itemHeight * maxNum + space * (maxNum - 1)));
    painter->setClipping(true);
    //画小按钮
    QPen pen(Qt::PenStyle::SolidLine);
    pen.setJoinStyle(Qt::PenJoinStyle::RoundJoin);
    pen.setColor(QColor(176, 211, 212, 255));
    painter->setFont(font);

    for(int index = 0; index < drawNum; index++)
    {
        brush.setColor(Qt::white);
        painter->setBrush(brush);
        painter->setPen(Qt::PenStyle::NoPen);

        int beginY = beginPosY + ((itemHeight + space) * index);
        QRect info_rect(beginPosX, beginY, itemWidth, itemHeight);
        QPainterPath path;
        path.setFillRule( Qt::WindingFill );
        if(index == 0 || index == drawNum - 1)
        {
            if(index == 0)
            {
                info_rect = QRect(beginPosX, bgBeginPosY + ((itemHeight + space) * index), itemWidth, (1 - topLeftNum) * itemHeight);
//                info_rect.setHeight((1 - topLeftNum) * itemHeight);
//                info_rect.setTop(bgBeginPosY + ((itemHeight + space) * index));
                path.addRoundedRect (info_rect, this->roundRadius, this->roundRadius);
                QRect temp_rect(info_rect.left(), info_rect.top() + info_rect.height() / 2.0, info_rect.width(), info_rect.height() / 2.0 + 0.5);
                path.addRect(temp_rect);
            }
            else
            {
                if(topLeftNum > 0.0) info_rect.setHeight(topLeftNum * itemHeight);
                path.addRoundedRect (info_rect, this->roundRadius, this->roundRadius);
                QRect temp_rect(info_rect.left(), info_rect.top(), info_rect.width(), info_rect.height()/2.0 + 1);
                path.addRect(temp_rect);
            }
        }
        else
        {
            path.addRect(info_rect);
        }
//        painter->drawRoundedRect(beginPosX, beginY, itemWidth, itemHeight, this->roundRadius, this->roundRadius);
        if(curTopIndex + index == curClickNum)
        {
            QRadialGradient radial(beginPosX + itemWidth * 0.5, beginY + itemHeight, this->radius, beginPosX + itemWidth * 0.5, beginY);
            if(this->radius > 1)
            {
                radial.setColorAt(0, QColor(124, 34, 235));
            }
            radial.setColorAt(1, Qt::white);
            // 设置显示模式
            radial.setSpread(QGradient::PadSpread);
            // 设置画刷填充
            painter->setBrush(radial);
//            pen.setColor(QColor(0, 0, 0, 125));
        }
        else
        {
            painter->setBrush(Qt::white);
//            pen.setColor(QColor(176, 211, 212, 255));
        }
        this->activePoints[index] = info_rect;
        painter->drawPath(path);
        painter->setPen(pen);
        painter->drawText(beginPosX, beginY, itemWidth, itemHeight, Qt::AlignCenter, this->allData[index + curTopIndex]);
    }
    //这里！两种方法，第一种是设置绘制区域，第二种是注释的代码，擦拭掉多出来的区域
    painter->setClipping(false);
//    QRect destination(beginPosX, beginPosY, itemWidth, bgBeginPosY - beginPosY);
//    painter->eraseRect(destination);
//    QRect bottomDes(beginPosX, bgBeginPosY + (maxNum * space - 1) + (maxNum * itemHeight) + 1, itemWidth, itemHeight - (bgBeginPosY - beginPosY));
//    painter->eraseRect(bottomDes);
    //画顶部底部小三角
    int triWidth = 15, triHeight = 8;
    if(curTopIndex > 0 || topLeftNum > 0.0)
    {
        double topY = bgBeginPosY - triHeight;
        QPoint first(beginPosX + itemWidth * 0.5 - triWidth * 0.5, bgBeginPosY);
        QPoint second(beginPosX + itemWidth * 0.5 + triWidth * 0.5, bgBeginPosY);
        QPoint third(beginPosX + itemWidth * 0.5, topY);
        QPoint points[3] = {first, second, third};
        painter->setPen(Qt::NoPen);
        painter->drawPolygon(points, 3);
    }
    if(curBottomIndex < dataNum)
    {
        double bottomPosY = bgBeginPosY + (maxNum * space - 1) + (maxNum * itemHeight);
        double topY = bottomPosY + triHeight;
        painter->setPen(Qt::NoPen);

        brush.setColor(QColor(15, 15, 15, 255 * 0.1));
        painter->setBrush(brush);
        QPoint bgFirst(beginPosX + itemWidth * 0.5 - triWidth * 0.5 - bgOffect, bottomPosY);
        QPoint bgSecond(beginPosX + itemWidth * 0.5 + triWidth * 0.5 + bgOffect, bottomPosY);
        QPoint bgThird(beginPosX + itemWidth * 0.5, topY + bgOffect);
        QPoint bgPoints[3] = {bgFirst, bgSecond, bgThird};
        painter->drawPolygon(bgPoints, 3);

        brush.setColor(Qt::white);
        painter->setBrush(brush);
        QPoint first(beginPosX + itemWidth * 0.5 - triWidth * 0.5, bottomPosY - 1);
        QPoint second(beginPosX + itemWidth * 0.5 + triWidth * 0.5, bottomPosY - 1);
        QPoint third(beginPosX + itemWidth * 0.5, topY - 1);
        QPoint points[3] = {first, second, third};
        painter->drawPolygon(points, 3);
        //重新设置Size
        this->resize(width(), topY + bgOffect);
    }
    else
    {
        double bottomPosY = bgBeginPosY+bgOffect+itemHeight * maxNum + space * (maxNum - 1);
        //重新设置Size
        this->resize(width(), bottomPosY);
    }
}

void SelfComboBox::drawRoundedViewTitle(QPainter *painter)
{
    double beginPosX = 2, beginPosY = 0, itemWidth = width() - 4;
    painter->setPen(Qt::PenStyle::NoPen);
    QBrush brush(Qt::BrushStyle::SolidPattern);
    brush.setColor(QColor(15, 15, 15, 255 * 0.1));
    painter->setBrush(brush);
    painter->drawRoundedRect(beginPosX-2, beginPosY+2, itemWidth + 4, itemHeight, this->roundRadius, this->roundRadius);
    painter->setBrush(Qt::white);
    painter->drawRoundedRect(beginPosX, beginPosY, itemWidth, itemHeight, this->roundRadius, this->roundRadius);

    QPen pen(Qt::PenStyle::SolidLine);
    pen.setJoinStyle(Qt::PenJoinStyle::RoundJoin);
    pen.setColor(QColor(0, 0, 0, 125));
    painter->setPen(pen);
    painter->setFont(font);
    QString firstText = this->count() > 0 ? this->allData[0] : "";
    QString curText = this->currentText() == "" ? firstText : this->currentText();
    painter->drawText(beginPosX, beginPosY, itemWidth, itemHeight, Qt::AlignCenter, curText);
    //绘制三角形角标
    int triWidth = 12, triHeight = 7, triHeightMove = 1;
    int isDown = -1;
    isDown = this->isViewOpen ? -1 : 1;
    brush.setColor(Qt::white);
    painter->setBrush(brush);
    QPoint first(beginPosX + itemWidth * 0.8, beginPosY + itemHeight * 0.5 - triHeight * 0.5 * isDown + triHeightMove);
    QPoint second(beginPosX + itemWidth * 0.8 + triWidth, beginPosY + itemHeight * 0.5 - triHeight * 0.5 * isDown + triHeightMove);
    QPoint third(beginPosX + itemWidth * 0.8 + triWidth * 0.5, beginPosY + itemHeight * 0.5 + triHeight  * 0.5 * isDown + triHeightMove);
    QPainterPath painterPath;
    painterPath.setFillRule( Qt::WindingFill );
    painterPath.moveTo(first);
    painterPath.lineTo(second);
    painterPath.lineTo(third);
    painter->fillPath(painterPath, QColor(176, 211, 212, 255));
}

小重点

主要是滚动的时候，怎么防止文字或者里面的东西在区域外显示：
1、先画出来在擦掉eraseRect，缺点就是应用起来的时候会把别人的控件显示擦掉。
2、设置裁剪区域，这样就不用担心区域外的事了

painter->setClipRegion(QRegion(x, y, width, height));
painter->setClipping(true);
xxxxxx
painter->setClipping(false);

3、用图片混合模式搞QPainter::CompositionMode，好麻烦，如果是做绘画，橡皮檫的可以用这个来实现（大概）

总结

最主要的还是在区域内绘制吧，其次为啥不用QSS，想加一点动画……（其实就是闲的），最后还是贴项目整体代码（瞎写的……）有个Bug……，count为0会报错，在drawRoundedView加个判断。代码就不重新改重新上传了，见谅

void SelfComboBox::drawRoundedView(QPainter *painter)
{
    if(this->curOpenNum <= 0)
    {
        return;
    }
    //这里！！！！！！！！！！！！！！！!！!！！！
    if(this->count() <= 0)
    {
        return;
    }
    ...
}
代号2008
关注
专栏目录
QtQuick PC端开发实战系列(14)_自定义ComboBox
zhengtianzuo的博客
03-25 360
总目录传送门 本博文技术等级: ★★☆☆☆☆☆☆☆☆ 联系方式: 作者 郑天佐 QQ 278969898 主页 http://www.camelstudio.cn 邮箱 camelsoft@163.com 博客 http://blog.csdn.net/zhengtianzuo06 github https://github.com/zhengtianzuo QQ群 199672080 觉得分享的内容还不错, 就请作者喝杯咖啡吧~~ ...
重绘CheckBox资料
09-26
重绘CheckBox资料
Qt之QComboBox定制（二）
08-20
列表下拉框、表格下拉框和城市列表下拉框。讲述博客：Qt之QComboBox定制(二)
重写QcomboBox
刘一儿(嵌入式)
01-10 3068
这是小弟做的QcomboBox异变类GComboBox。。。请大家欣赏。
pyqt5：重写QComboBox控件
莫诺库诺的博客
04-12 1528
pyqt5：重写QComboBox控件 需求：pyqt5中的QComboBox类在单击组合框时不像一般Button类，可以发出clicked()信号，为了实现类似功能，需要重写QComboBox控件和其中的QMousePressEvent事件，并且需要自定信号。 实现： 新建一个.py文件，名为MyComboBox.py，代码如下： from PyQt5 import QtGui from PyQt5.Qt import * from PyQt5.QtCore import * class MyComb
重写QComboBox，实现下拉复选框
最新发布
qq_41264992的博客
06-22 558
重写QComboBox
Qt 重载QComboBox，实现右侧删除键
qq_44723937的博客
04-09 3931
自定义QComboBox
SelfComboBox.rar 重新绘制ComboBox
06-10
在本文中，我们将深入探讨如何使用Qt库来实现一个自定义的`ComboBox`，即标题中提到的"SelfComboBox.rar 重新绘制ComboBox"。Qt是一个跨平台的应用程序开发框架，广泛用于创建美观且功能丰富的GUI应用程序。在描述中...
QT 自定义混合控件——基于View/Model/Delegate的QTableView/QTreewidget/Combobox实现
04-01
在本项目"QT自定义混合控件——基于View/Model/Delegate的QTableView/QTreewidget/Combobox实现"中，我们将深入探讨如何利用QT库中的核心组件构建一个强大的数据展示和交互界面。 首先，我们要理解View/Model/...
qt 代码combobox去除箭头
09-13
要想在Qt代码中去除ComboBox的箭头，可以使用QSS（Qt Style Sheets）来修改ComboBox的样式。下面是一个实现方法： 1. 在Qt代码中，给ComboBox控件设置一个特定的ObjectName，例如： ```cpp QComboBox *comboBox ...
qtdesigner 里comboBox里的项显示不全，增加一个鼠标悬停标签，怎么做
05-27
paint()函数用于绘制列表项和悬停标签，当鼠标悬停在列表项上时，绘制一个半透明的矩形作为悬停标签。 在ComboBox类的构造函数中，我们将itemDelegate属性设置为HoverDelegate的实例。这将确保在下拉列表中显示项时...
qt之QComboBox定制
07-27
说起下拉框，想必大家都比较熟悉，在我们注册一些网站的时候，会出现大量的地区数据供我们选择，这个时候出现的就是下拉框列表，再比如字体选择的时候也是使用的下拉框。下拉框到处可见，作为一个图形库，qt也提供了QtComboBox类来供我们使用，但是有些时候简单的下拉列表已经满足不了我们的需求，如58上选择岗位是一个下拉表格，这个时候就需要我们自己定制一下QComboBox。
Qt重绘控件之移动信号
09-23
Qt+Vs控件重绘手机信号i的例子下载。具体可查看https://blog.csdn.net/automoblie0/article/details/101225592
Qt之QComboBox 自定义实现多个ComboBox实时同步数据
03-21
1. 支持多个同一类的ComboBox数据共享 2. 支持不同种类的ComboBox共享不同种类的数据 3. 如有需要可自行扩展 ... ... 4. 实例:https://blog.csdn.net/Ilson_/article/details/88725341
QCombox(重写)+QCompleter（自动补全，自动加载qcombox的下拉选项，设置背景颜色）
ligare的博客
07-05 2671
示例： QCombox(重写)+QCompleter（自动补全，自动加载qcombox的下拉选项，设置背景颜色） Qt——QLineEdit使用总结QT combox的使用示例(输入后捕捉enter键，以及输入编辑框如何加输入限制（正则表达式）)QComboBox自定义样式（重载下拉框）综合用法.........
Qt QComboBox点击操作——重写showPopup()函数
weixin_40953784的博客
06-06 8249
环境：win10，Qt5.9.7 + msvc2017 问题：做项目的时候用到QComboBox展示串口号，但是有个问题是因为初始化的时候获取串口号列表，软件运行起来后，串口更新了也无法识别，必须重启软件重新初始化才行。（因为一些原因无法做成弹框等形式） 查询资料发现QComboBox是没有类似clicked的信号，所以没法直接用内置的信号槽处理。 后来在一篇pyqt5中的博客（https:...
QT 控件重绘
断点
10-28 6383
前言： 转载请附上连接,本帖原创请勿照抄。 QT重绘控件是指通过实现控件头文件，使用QSS或者样式表来对某个控件进行重新绘制。 1、重绘QButton按钮；2、重绘QComboBox下拉框；3、其它控件重绘的办法。 1. 重绘QButton 重绘控件感觉一般在VS里面开发的时候，使用重绘比较方便，相对于关联控件设置来说，直接代码重绘要比关联控件要便捷，如果使用QT Creator来进行开发的话个人感觉还是拖控件再用样式表较为方便。 //.h 源文件 //...
【Qt串口调试助手】1.3 - 重写ComboBox下拉框的鼠标点击事件，实现点击下拉框扫描可用串口
Mark_md的博客
10-13 3671
由于ComboBox没有鼠标点击信号，所以如果想实现点击下拉框响应，需要重写ComboBox下拉框的鼠标点击事件。在点击事件中，添加扫描可用串口代码，实现点击下拉框时重新扫描串口。并且下拉框内容输出端口硬件信息，便于区分与选择。 GitHub源码：Qt串口调试助手下载 实现结果：点击串口选择下拉框，重新扫描可用串口，并且显示端口硬件信息。 1. 新建类，继承 QComboBox，重写鼠标点击事件 代码中，对一些方法和属性的说明： scanActivePort：扫描可用...
Qt之QComboBox定制(二)
朝十晚八
07-19 1673
文章目录 一篇文章Qt之QComboBox定制讲到了qt实现自定义的下拉框，该篇文章主要实现了列表式的下拉框，这一节我还将继续讲解QComboBox的定制，而这一节我将会讲述更高级的用法，不仅仅是下拉列表框，而可以实现下拉框为表格，原理其实上一篇文章中的列表框类似，不过在这篇文章我将会重点讲述一下不同的地方，好了，下边我先截取一下demo中的运行效果图，如图1所示，效果并不是那么美观，不过确实有...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值