用Qt寫(xiě)一個(gè)簡(jiǎn)單的代碼編輯器

時(shí)間：2021-07-03 15:58:33

關(guān)鍵字： QT 代碼編輯器

手機(jī)看文章

掃描二維碼
隨時(shí)隨地手機(jī)看文章

[導(dǎo)讀]在此部件上繪制行號(hào)，并將其放置在CodeEditor的viewport()的左邊距區(qū)域上，QWidget類也可以幫助我們對(duì)其內(nèi)容進(jìn)行滾動(dòng)。

來(lái)源：技術(shù)讓夢(mèng)想更偉大

作者：李肖遙
這次的代碼編輯器比較簡(jiǎn)單，主要有以下幾個(gè)功能：

簡(jiǎn)單編輯
顯示行號(hào)
突出顯示當(dāng)前行

如下圖所示，主要來(lái)看看怎么實(shí)現(xiàn)。

代碼編輯器的實(shí)現(xiàn)

代碼編輯器主要是使用了CodeEditor和LineNumberArea，其實(shí)現(xiàn)步驟如下：
CodeEditor是繼承QPlainTextEdit的小部件，在CodeEditor（LineNumberArea）中保留一個(gè)單獨(dú)的小部件，在其上繪制行號(hào)。
QPlainTextEdit繼承自QAbstractScrollArea，并且編輯在其viewport()的邊距內(nèi)進(jìn)行。通過(guò)將視口的左邊距設(shè)置為繪制行號(hào)所需的尺寸，為行號(hào)區(qū)域騰出空間。
在編輯代碼時(shí)，我們首選QPlainTextEdit而不是QTextEdit，因?yàn)樗厌槍?duì)處理純文本進(jìn)行了優(yōu)化。
除了用戶可以使用鼠標(biāo)或鍵盤(pán)進(jìn)行的選擇之外，QPlainTextEdit還允許我們添加選擇，我們使用此功能突出顯示當(dāng)前行。

LineNumberArea類

在此部件上繪制行號(hào)，并將其放置在CodeEditor的viewport()的左邊距區(qū)域上，QWidget類也可以幫助我們對(duì)其內(nèi)容進(jìn)行滾動(dòng)。另外，如果使用斷點(diǎn)或其他代碼編輯器功能擴(kuò)展編輯器，單獨(dú)的窗口小部件是正確的選擇。
class LineNumberArea : public QWidget
{
public:
LineNumberArea(CodeEditor *editor) : QWidget(editor) {
codeEditor = editor;
}
QSize sizeHint() const {
return QSize(codeEditor->lineNumberAreaWidth(), 0);
}
protected:
void paintEvent(QPaintEvent *event) {
codeEditor->lineNumberAreaPaintEvent(event);
}
private:
CodeEditor *codeEditor;
};

CodeEditor類定義

這是代碼編輯器的類定義：
class CodeEditor : public QPlainTextEdit
{
Q_OBJECT
public:
CodeEditor(QWidget *parent = 0);
void lineNumberAreaPaintEvent(QPaintEvent *event);
int lineNumberAreaWidth();
protected:
void resizeEvent(QResizeEvent *event);
private slots:
void updateLineNumberAreaWidth(int newBlockCount);
void highlightCurrentLine();
void updateLineNumberArea(const QRect