QT编辑框带行号

很可惜,qt的几个编辑框并没有相关功能。所以我们要自己实现一个。

先讲讲原理:
QPlainTextEdit继承自QAbstractScrollArea,编辑发生在其viewport()的边距内。我们可以通过将视口的左边缘设置一个空白区域,用于绘制行号。

之所以使用QPlainTextEdit而不是QTextEdit,因为它针对处理纯文本进行了优化。更重要的是它允许我们在高亮多行文字。
 

一.LineNumberArea类

我们新建一个类,叫做LineNumberArea,继承QWidget,并在上绘制行号。

class LineNumberArea : public QWidget
{
public:LineNumberArea(CodeEditor *editor) : QWidget(editor), codeEditor(editor){}QSize sizeHint() const override{return QSize(codeEditor->lineNumberAreaWidth(), 0);}protected:void paintEvent(QPaintEvent *event) override{codeEditor->lineNumberAreaPaintEvent(event);}private:CodeEditor *codeEditor;
};

二.CodeEditor类

CodeEditor继承QPlainTextEdit,LineNumberArea是他的私有成员变量。

此外我们还要增加几个方法,用于计算左侧行号的渲染绘制的空白区域大小。

详见代码

class CodeEditor : public QPlainTextEdit
{Q_OBJECTpublic:CodeEditor(QWidget *parent = nullptr);void lineNumberAreaPaintEvent(QPaintEvent *event);//响应绘制事件int lineNumberAreaWidth();//计算行号宽度protected:void resizeEvent(QResizeEvent *event) override;//响应窗口尺寸改变事件private slots:void updateLineNumberAreaWidth(int newBlockCount);//更新行号宽度void highlightCurrentLine();//高亮当前行void updateLineNumberArea(const QRect &rect, int dy);//更新行号区域private:QWidget *lineNumberArea;
};

当编辑器中的行数发生变化或者编辑器的viewport()滚动时或者编辑器的大小发生时,我们需要调整左侧区域大小,并绘制行号。因此我们需要updateLineNumberWidth()和updateLineNumberArea()方法。

三.CodeEditor类实现

在构造函数中,我们将QPlainTextEdit中的信号连接到对应的槽函数。

然后计算行号区域宽度并高亮显示第一行。

CodeEditor::CodeEditor(QWidget *parent) : QPlainTextEdit(parent)
{lineNumberArea = new LineNumberArea(this);connect(this, &CodeEditor::blockCountChanged, this, &CodeEditor::updateLineNumberAreaWidth);connect(this, &CodeEditor::updateRequest, this, &CodeEditor::updateLineNumberArea);connect(this, &CodeEditor::cursorPositionChanged, this, &CodeEditor::highlightCurrentLine);updateLineNumberAreaWidth(0);//计算行号区域宽度highlightCurrentLine();//高亮显示
}

lineNumberAreaWidth()函数计算LineNumberArea的宽度并返回。

一般取编辑器最后一行的文字,并计算该行文字的宽度。

按字符’9‘的宽度作为单个字符的宽度。

int CodeEditor::lineNumberAreaWidth()
{int digits = 1;int max = qMax(1, blockCount());//计算数位while (max >= 10) {max /= 10;++digits;}//取字符9的宽度int space = 3 + fontMetrics().horizontalAdvance(QLatin1Char('9')) * digits;return space;
}

当我们更新行号区域的宽度时,需调用QAbstractScrollArea::setViewportMargins(),更新设置左侧行号区的宽度。

void CodeEditor::updateLineNumberAreaWidth(int /* newBlockCount */)
{setViewportMargins(lineNumberAreaWidth(), 0, 0, 0);
}

当编辑器视口滚动时,会调用updateLineNumberArea。QRect是编辑区域中需要更新(重绘)的部分。dy是鼠标滚动时的距离,单位是像素。

void CodeEditor::updateLineNumberArea(const QRect &rect, int dy)
{if (dy)lineNumberArea->scroll(0, dy);elselineNumberArea->update(0, rect.y(), lineNumberArea->width(), rect.height());if (rect.contains(viewport()->rect()))updateLineNumberAreaWidth(0);
}

当编辑器的大小发生变化时,我们还需要调整行号区域的大小。

void CodeEditor::resizeEvent(QResizeEvent *e)
{QPlainTextEdit::resizeEvent(e);QRect cr = contentsRect();lineNumberArea->setGeometry(QRect(cr.left(), cr.top(), lineNumberAreaWidth(), cr.height()));
}

当光标位置改变时,我们突出显示当前行,即包含光标的行。

void CodeEditor::highlightCurrentLine()
{QList<QTextEdit::ExtraSelection> extraSelections;if (!isReadOnly()) {QTextEdit::ExtraSelection selection;QColor lineColor = QColor(Qt::yellow).lighter(160);selection.format.setBackground(lineColor);selection.format.setProperty(QTextFormat::FullWidthSelection, true);selection.cursor = textCursor();selection.cursor.clearSelection();extraSelections.append(selection);}setExtraSelections(extraSelections);
}

每当LineNumberArea接收到绘制事件(paintEvent)时,就会调用CodeEditor的lineNumberAreaPaintEvent。

lineNumberAreaPaintEvent将遍历所有可见的线条,并在每行的额外区域中绘制行号。在纯文本编辑中,每一行都由一个QTextBlock组成;

void CodeEditor::lineNumberAreaPaintEvent(QPaintEvent *event)
{QPainter painter(lineNumberArea);painter.fillRect(event->rect(), Qt::lightGray);QTextBlock block = firstVisibleBlock();int blockNumber = block.blockNumber();int top = qRound(blockBoundingGeometry(block).translated(contentOffset()).top());int bottom = top + qRound(blockBoundingRect(block).height());while (block.isValid() && top <= event->rect().bottom()) {if (block.isVisible() && bottom >= event->rect().top()) {QString number = QString::number(blockNumber + 1);painter.setPen(Qt::black);painter.drawText(0, top, lineNumberArea->width(), fontMetrics().height(),Qt::AlignRight, number);}block = block.next();top = bottom;bottom = top + qRound(blockBoundingRect(block).height());++blockNumber;}
}

参考资料:

Code Editor Example | Qt Widgets 5.15.17

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/883422.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

VScode插件:前端每日一题

大文件上传如何做断点续传&#xff1f; 在前端实现大文件上传的断点续传&#xff0c;通常会将文件切片并分块上传&#xff0c;记录每块的上传状态&#xff0c;以便在中断或失败时只上传未完成的部分。以下是实现断点续传的主要步骤和思路&#xff1a; 1. 文件切片 (File Slici…

ubuntu 20.4 安装 openssl 3.x

ubuntu 20.4 安装 openssl 3.x ubuntu 20.4 自带了openssl 1.0.2&#xff0c;升级为 openssl 3.x&#xff1a; # 下载 openssl 源代码压缩包 wget https://www.openssl.org/source/openssl-3.0.10.tar.gz# 安装编译包 sudo apt-get install -y g sudo apt-get install -y mak…

python把一张小图粘贴到一张大图上

在Python中&#xff0c;你可以使用Pillow库&#xff08;Python Imaging Library的一个分支&#xff09;来实现将一张小图粘贴到一张大图的左上角&#xff08;0, 0&#xff09;位置。以下是一个示例代码&#xff0c;展示了如何完成这一任务&#xff1a; 首先&#xff0c;确保你…

QtCreator通过CMake多文件编译.cpp、.qss、.h、.ui文件,达到MVC三层架构的效果

博主在构建C项目的时候&#xff0c;一般都喜欢将头文件和源文件分开为不同的文件夹&#xff0c;比如include目录下只存放.h文件和.ui文件&#xff0c;src目录下只存放.cpp和.qss文件&#xff0c;res目录下只存放图片、音频等文件&#xff0c;这时候使用CMake对项目进行分文件管…

qml圆形图片,qml圆形头像制作

代码比较简单&#xff0c;就不细讲了&#xff0c;大家直接看下面源码吧&#xff01;如果对你有所帮助&#xff0c;可以帮角角点个关注嘛&#xff1f; import QtQuick import QtQuick.Effects import Qt5Compat.GraphicalEffectsWindow {width: 640height: 480visible: truetit…

使用代理服务器后sse数据合并问题

如果是使用本地代理服务器devServer compress:false,如果是发布到生产环境下的代理服务器nginx 增加如下配置&#xff0c;该配置同时支持websocket和sse proxy_http_version 1.1; #设置代理请求使用 HTTP/1.1 版本。WebSocket 需要 HTTP/1.1&#xff0c;因为它支持持久连接和更…

【python库】PandasGUI介绍

Github地址&#xff1a;https://github.com/adamerose/PandasGUI 在数据科学和分析过程中&#xff0c;数据的可视化和交互操作是非常重要的环节。尽管 Pandas 是一个强大的数据处理库&#xff0c;但其缺乏用户友好的图形界面&#xff0c;这使得数据探索和分析变得相对繁琐。pan…

【每日一题】LeetCode - 盛最多水的容器

给定一个长度为 n 的整数数组 height。有 n 条垂线&#xff0c;第 i 条线的两个端点是 (i, 0) 和 (i, height[i])。要求找出其中的两条线&#xff0c;使得它们与 x 轴共同构成的容器可以容纳最多的水。 输入示例&#xff1a; height [1,8,6,2,5,4,8,3,7]输出&#xff1a; 4…

2024年1024程序人生总结

2024-1024 0.大环境0.1.经济0.2.战争 1.我的程序人生1.1.游戏 2.节日祝福 0.大环境 今年的1024最大的感触就是没有节日氛围&#xff0c;往年公司还会准备节日礼物&#xff0c;今年没有&#xff0c;由此可见大环境有多么糟糕。 除此之外&#xff0c;就是到公司应聘的程序员越来…

如何理解前端与后端开发

前端与后端开发是构建现代Web应用的两个主要部分&#xff0c;它们共同工作&#xff0c;为用户提供完整的在线体验。以下是对前端和后端开发的理解和它们之间的主要区别&#xff1a; 前端开发&#xff08;客户端开发&#xff09; 用户界面&#xff08;UI&#xff09;&#xff…

2025前端面试-浏览器的事件循环和浏览器的事件循环的区别是什么---002

浏览器的事件循环和浏览器的事件循环的区别是什么 JS是单线程的浏览器中JS执行和DOM渲染公用一个线程异步 异步中又有宏任务和微任务 宏任务 setTimtout setInterval微任务 Promise async await(先执行同步任务后执行异步任务&#xff09;微任务在下一轮DOM渲染之前执行&…

Python快速入门教程

目录 1. Python 简介 2. 环境准备 3. 第一个 Python 程序 4. 变量与数据类型 5. 基本操作与控制结构 6. 函数与模块 7. 实践项目 结语 Python 是一种非常友好的编程语言&#xff0c;特别适合初学者。它的语法简洁&#xff0c;容易上手&#xff0c;并且广泛应用于各种领…

C++结合图形编程与物联网:你更偏向哪种方式来学习信息学奥赛?

随着信息学奥赛在全国范围内的热度逐年攀升&#xff0c;学生和家长们越来越重视如何有效备赛。传统的编程学习方式侧重于算法和数据结构&#xff0c;但随着科技的发展&#xff0c;图形化编程与物联网&#xff08;IoT&#xff09;项目逐渐成为新兴的学习路径。通过C结合图形化编…

Rust 力扣 - 1. 两数相加

文章目录 题目描述题解思路题解代码题目链接 题目描述 题解思路 我们使用一个全局的备忘录&#xff0c;然后我们遍历数组&#xff0c;如果当前元素在备忘录里面找到了&#xff0c;就返回备忘录里面记录的下标和当前下标记录&#xff0c;没找到就把当前元素匹配的元素和当前元素…

N.Katz对数学的贡献我一无所知

当年我在Columbia大学数学系&#xff0c;每次数论seminar我都听&#xff0c;这个系列seminar是由Goldfeld跟Szpiro主持的&#xff0c;那次本来Katz是应邀来做报告的&#xff0c;但他却对Goldfeld出言不逊&#xff08;也对广大听众&#xff09;&#xff0c;言语中带着训斥&#…

人工智能_神经网络103_感知机_感知机工作原理_感知机具备学习能力_在学习过程中自我调整权重_优化效果_多元线性回归_逻辑回归---人工智能工作笔记0228

由于之前一直对神经网络不是特别清楚,尤其是对神经网络中的一些具体的概念,包括循环,神经网络卷积神经网络以及他们具体的作用,都是应用于什么方向不是特别清楚,所以现在我们来做教程来具体明确一下。 当然在机器学习之后还有深度学习,然后在深度学习中对各种神经网络的…

Java对称加密:AES 高级加密标准

1、对称加密简述 对称加密&#xff0c;又称对称密钥加密或私钥加密&#xff0c;是一种在加密和解密过程中使用相同一个密钥的加密算法。这种加密方式的核心在于&#xff0c;发送方使用某个密钥对数据进行加密&#xff0c;接收方则使用完全相同的密钥对数据进行解密。由于加密和…

Kotlin-协程基础

coroutines并不在kotlin的标准库中&#xff0c;但kotlin提供了协程支持 使用协程&#xff0c;先引入协程包 implementation("org.jetbrains.kotlinx:kotlinx-coroutines-core:1.9.0") 先来一个简单的协程例子&#xff1a; fun main() {runBlocking {launch {dela…

基于物联网的智慧考场系统设计(论文+源码)

1. 功能设计 &#xff08;1&#xff09;温度监测与控制功能&#xff1a; 系统需要能够实时采集考场内的温度信息&#xff0c;通过DS18B20传感器获取准确的数据&#xff0c;并在OLED屏幕和APP上显示。当温度异常过高时&#xff0c;系统应自动启动继电器&#xff0c;模拟空调开启…

数字IC后端实现 | Innovus各个阶段常用命令汇总

应各位读者要求&#xff0c;小编最近按照Innovus流程顺序整理出数字IC后端项目中常用的命令汇总。限于篇幅&#xff0c;这次只更新到powerplan阶段。有了这份Innovus常用命令汇总&#xff0c;学习数字IC后端从此不再迷路&#xff01;如果大家觉得这个专题还不错&#xff0c;想继…