Qt 技巧笔记(七) QLineEdit 单行输入控件

Qt是一个跨平台C++图形界面开发库，利用Qt可以快速开发跨平台窗体应用程序，在Qt中我们可以通过拖拽的方式将不同组件放在指定的位置，实现图形化开发的方便了开发效率，本章将重点介绍LineEdit单行输入框组件的常用方法及灵活运用。

在Qt中，QLineEdit是一个用于输入单行文本的控件，它提供了一个允许用户输入和编辑文本的文本框。该组件是Qt的基础控件之一，通常用于获取用户输入和编辑文本的文本框。是构建用户交互界面的基础组件之一，通常与其它控件一起使用，例如按钮，标签等，以构建完整的用户输入界面。

以下是QLineEdit的一些常用方法和属性配置，以下表格形式进行说明：

方法	描述
QLineEdit()	构造函数，创建一个空的LineEdit。
clear()	清空LineEdit中的文本。
setText(const QString &)	设置LineEdit的文本内容。
text() const	获取LineEdit的当前文本内容
setPlaceholderText(const QString &)	设置占位文本，显示在LineEdit中，提供用户输入提示
placeholderText() const	获取占位文本
setMaxLength(int)	设置最大输入长度
maxLength() const	获取最大输入长度。
setReadOnly(bool)	设置LineEdit为只读状态，用户无法编辑
isReadOnly() const	检查LineEdit是否为只读状态
setEchoMode(QLineEdit::EchoMode)	设置回显模式，用于处理密码等敏感信息的显示。
echoMode() const	获取当前的回显模式。
setValidator(QValidator *)	设置输入验证器，用于限制输入的内容。
validator() const	获取当前的输入验证器。
inputMask() const	获取当前的输入掩码。
undo()	撤销上一次操作。
redo()	重做上一次撤销的操作。
cut()	剪切当前选中的文本。
copy()	复制当前选中的文本。
paste()	粘贴剪切板的内容。
selectAll()	选中LineEdit中的所有文本。
deselect()	取消文本的选择状态。

这些方法提供了QLineEdit的基本功能，包括文本的设置，获取，清空，以及一些编辑和格式化的操作。具体使用时可以根据需求选择合适的方法。

重要信号及说明

属性	说明
void cursorPositionChanged(int old, int new)	当⿏标移动时发出此信号，old为先前的位置，new为新位置
void editingFinished()	当按返回或者回⻋键时，或者⾏编辑失去焦点时，发出此信号;
void returnPressed()	当返回或回⻋键按下时发出此信号.如果设置了验证器, 必须要验证通过, 才能触发.
void selectionChanged()	当选中的⽂本改变时，发出此信号。
void textChanged(const QString &text)	当QLineEdit中的⽂本改变时，发出此信号，text是新的⽂本。代码对⽂本的修改能够触发这个信号.
void textEdited(const QString &text))	当QLineEdit中的⽂本改变时，发出此信号，text是新的⽂本。代码对⽂本的修改不能触发这个信号.

枚举：QLineEdit::EcoMode 描述输入框如何显示其内容。

常量	值	描述
`QLineEdit::Normal`	0	正常显示输入的字符，默认选项。
`QLineEdit::NoEcho`	1	不显示任何输入，常用于密码类型，其密度长度都需要保密的时候。
`QLineEdit::Password`	2	显示平台相关的密码掩码字符，而不是实际的字符输入
`QLineEdit::PasswordEchoOnEdit`	3	在编辑的时候显示字符，负责显示密度类型。

一、QLineEdit控件常用属性设置详解

1.基本文本属性

QLineEdit 提供了多种方法来设置和获取文本内容：

C++ 复制代码

// 设置文本内容
lineEdit->setText("Hello, Qt");
// 获取文本内容
QString text=lineEdit->text();

QLinedit 设置只读模式

C++ 复制代码

// 设置为只读模式
lineEdit->setReadOnly(true);
// 获取是否为只读模式
bool isReadOnly= lineEdit->isReadOnly();

QLineEdit 文本最大长度限制，使用maxLength()函数可以限制用户输入的最大字符数：

C++ 复制代码

// 获取当前设置的最大长度
int maxLen = lineEdit->maxLength();
// 设置最大长度为10个字符
lineEdit->setMaxLength(10);

这在需要限制输入长度的场景非常有用，如手机号码、邮政编码等固定长度的输入。

QLineEdit的站位文本：占位文本是当输入框为空时显示的提示文本，它不会作为实际内容：

C++ 复制代码

// 设置占位文本
lineEdit->setPlaceholderText("请输入用户名...");

2. 显示模式属性

通过设置回显模式，可以控制输入文本的显示方式，这在密码输入等场景中特别有用：

C++ 复制代码

// 设置回显模式
// QLineEdit::Normal - 正常显示输入的字符（默认）
// QLineEdit::NoEcho - 不显示任何内容，但仍然可以复制
// QLineEdit::Password - 显示为密码字符（通常为*或●）
// QLineEdit::PasswordEchoOnEdit - 编辑时显示正常字符，失去焦点后显示为密码字符
lineEdit->setEchoMode(QLineEdit::Password);

这种属性设置使得QLineEdit可以灵活处理各种敏感信息的输入需求

3.输入验证属性

输入掩码是一种强大的输入格式化工具，可以强制用户按照特定格式输入：

C++ 复制代码

// 设置电话号码输入掩码（中国格式）
lineEdit->setInputMask("+86 000 0000 0000");
// 设置日期输入掩码
lineEdit->setInputMask("0000-99-99");
// 清除输入掩码
lineEdit->setInputMask("");

输入掩码可以确保用户输入的数据格式正确，减少数据验证的工作量.

验证器可以更灵活地控制用户输入的内容：

c++ 复制代码

// 整数验证器（0-100）
QIntValidator *intValidator = new QIntValidator(0, 100, this);
lineEdit->setValidator(intValidator);
// 浮点数验证器
QDoubleValidator *doubleValidator = new QDoubleValidator(0.0, 100.0, 2, this);
lineEdit->setValidator(doubleValidator);
// 正则表达式验证器（只允许输入字母和数字）
QRegularExpressionValidator *regexValidator = new QRegularExpressionValidator(QRegularExpression("^[A-Za-z0-9]+$"), this);
lineEdit->setValidator(regexValidator);

通过验证器，可以确保用户输入符合特定规则，如只能输入数字、英文字母等

二、文本对齐方式解决

文本对齐方式决定了QLineEdit内部文本的显示位置，通过setAlignment()函数进行设置：

1. 水平对齐方式

C++ 复制代码

// 水平左对齐（默认）
lineEdit->setAlignment(Qt::AlignLeft);
// 水平居中对齐
lineEdit->setAlignment(Qt::AlignHCenter);
// 水平右对齐
lineEdit->setAlignment(Qt::AlignRight);
// 水平两端对齐
lineEdit->setAlignment(Qt::AlignJustify);

2.垂直对齐方式

C++ 复制代码

// 垂直上对齐
lineEdit->setAlignment(Qt::AlignTop);
// 垂直居中对齐（默认）
lineEdit->setAlignment(Qt::AlignVCenter);
// 垂直下对齐
lineEdit->setAlignment(Qt::AlignBottom);

3.组合对齐方式

可以同时设置水平和垂直对齐：

C++ 复制代码

// 文本居中显示
lineEdit->setAlignment(Qt::AlignHCenter | Qt::AlignVCenter);
// 文本右下角显示
lineEdit->setAlignment(Qt::AlignRight | Qt::AlignBottom);

文本对齐属性（alignment）表示显示文本的对齐方式，通过这些设置可以创建更加美观和用户友好的界面。

三、正则化表达式控制详解

正则表达式是文本处理的强大工具，在QLineEdit中可以通过多种方式应用正则表达式来控制输入。

1. 使用QRegularExpressionValidator

C++ 复制代码

// 只允许输入电子邮件地址
QRegularExpressionValidator *emailValidator = new QRegularExpressionValidator(
QRegularExpression(R"([a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,})"),
this
);
lineEdit->setValidator(emailValidator);
// 只允许输入IP地址
QRegularExpressionValidator *ipValidator = new QRegularExpressionValidator(
QRegularExpression(R"(^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$)"),
this
);
lineEdit->setValidator(ipValidator);

2. 使用QInputMask结合正则表达式

虽然输入掩码本身不直接支持正则表达式，但可以通过组合使用实现更复杂的输入控制：

C++ 复制代码

// 创建一个自定义的输入验证器类
class CustomValidator : public QValidator {
public:
explicit CustomValidator(QObject *parent = nullptr) : QValidator(parent) {}
State validate(QString &input, int &pos) const override {
QRegularExpression regex("^[A-Za-z0-9]+$");
if (regex.match(input).hasMatch()) {
return Acceptable;
}
return Intermediate;
}
};
// 使用自定义验证器
lineEdit->setValidator(new CustomValidator(this));

3. 实时正则匹配反馈

可以通过信号槽机制实现实时正则匹配反馈：

C++ 复制代码

// 连接textChanged信号
connect(lineEdit, &QLineEdit::textChanged, [](const QString &text) {
QRegularExpression regex("^[A-Za-z0-9]+$");
if (regex.match(text).hasMatch()) {
qDebug() << "输入符合要求";
lineEdit->setStyleSheet(""); // 清除样式
} else {
qDebug() << "输入不符合要求";
lineEdit->setStyleSheet("background-color: #ffcccc;"); // 设置错误样式
}
});

通过这些正则表达式控制技术，可以确保用户输入的数据格式正确，提高数据质量和用户体验。

四、样式设置详解

QSS（Qt Style Sheets）是Qt提供的样式表功能，类似于网页开发中的CSS，可以用来定制QLineEdit的外观。

1. 基本样式设置

c++ 复制代码

// 设置背景色
lineEdit->setStyleSheet("background-color: #f0f0f0;");
// 设置文本颜色
lineEdit->setStyleSheet("color: #333333;");
// 设置边框
lineEdit->setStyleSheet("border: 1px solid #cccccc;");
// 设置圆角边框
lineEdit->setStyleSheet("border: 1px solid #cccccc; border-radius: 5px;");
// 设置内边距
lineEdit->setStyleSheet("padding: 5px;");

2. 焦点状态样式

C++ 复制代码

// 焦点状态样式
lineEdit->setStyleSheet(
"QLineEdit {"
"   background-color: #ffffff;"
"   border: 1px solid #cccccc;"
"   border-radius: 3px;"
"   padding: 5px;"
"}"
"QLineEdit:focus {"
"   border: 1px solid #0078d7;"
"   background-color: #f0f8ff;"
"}"
);

3. 只读状态样式

C++ 复制代码

// 只读状态样式
lineEdit->setStyleSheet(
"QLineEdit {"
"   background-color: #f9f9f9;"
"}"
"QLineEdit[readOnly=\"true\"] {"
"   background-color: #eeeeee;"
"   color: #666666;"
"}"
);

4. 错误状态样式

C++ 复制代码

// 错误状态样式
lineEdit->setStyleSheet(
"QLineEdit {"
"   border: 1px solid #cccccc;"
"}"
"QLineEdit.error {"
"   border: 1px solid #ff0000;"
"   background-color: #ffeeee;"
"}"
);
// 动态设置错误状态
lineEdit->setProperty("error", true);
lineEdit->style()->unpolish(lineEdit);
lineEdit->style()->polish(lineEdit);
lineEdit->update();

5. 高级样式技巧

5.1 渐变背景

C++ 复制代码

// 设置渐变背景
lineEdit->setStyleSheet(
"QLineEdit {"
"   background: qlineargradient(x1:0, y1:0, x2:0, y2:1, "
"                               stop:0 #f6f7fa, stop:1 #dadbde);"
"}"
);

5.2 自定义占位符文本样式

C++ 复制代码

// 自定义占位符文本样式
lineEdit->setStyleSheet(
"QLineEdit {"
"   color: #333333;"
"}"
"QLineEdit::placeholder {"
"   color: #999999;"
"}"
);

5.3 图标装饰

C++ 复制代码

// 添加左侧搜索图标
lineEdit->setStyleSheet(
"QLineEdit {"
"   border: 1px solid #cccccc;"
"   padding-left: 20px;"
"   background-image: url(:/images/search.png);"
"   background-repeat: no-repeat;"
"   background-position: center left;"
"}"
);

过这些样式设置技巧，可以创建出美观且符合品牌风格的QLineEdit控件，提升应用程序的整体用户体验。

五、综合应用示例

下面是一个综合运用上述知识的示例，创建一个功能完善的用户名输入框：

C++ 复制代码

// 创建用户名输入框
QLineEdit *usernameEdit = new QLineEdit(this);
// 设置基本属性
usernameEdit->setPlaceholderText("请输入用户名（3-16位字母、数字或下划线）");
usernameEdit->setMaxLength(16);
// 设置验证器
QRegularExpressionValidator *usernameValidator = new QRegularExpressionValidator(
QRegularExpression("^[a-zA-Z0-9_]{3,16}$"),
this
);
usernameEdit->setValidator(usernameValidator);
// 设置对齐方式
usernameEdit->setAlignment(Qt::AlignLeft | Qt::AlignVCenter);
// 设置样式
usernameEdit->setStyleSheet(
"QLineEdit {"
"   border: 1px solid #cccccc;"
"   border-radius: 4px;"
"   padding: 5px 8px;"
"   background-color: #ffffff;"
"}"
"QLineEdit:focus {"
"   border: 1px solid #0078d7;"
"   background-color: #f0f8ff;"
"}"
"QLineEdit[error=\"true\"] {"
"   border: 1px solid #ff0000;"
"   background-color: #ffeeee;"
"}"
);
// 连接信号槽
connect(usernameEdit, &QLineEdit::textChanged, this, [usernameEdit](const QString &text) {
QRegularExpression regex("^[a-zA-Z0-9_]{3,16}$");
if (regex.match(text).hasMatch()) {
usernameEdit->setProperty("error", false);
} else {
usernameEdit->setProperty("error", true);
}
usernameEdit->style()->unpolish(usernameEdit);
usernameEdit->style()->polish(usernameEdit);
usernameEdit->update();
});

六、总结

QLineEdit作为Qt框架中最常用的控件之一，通过灵活的属性设置、文本对齐方式、正则表达式控制和样式设置，可以满足各种输入场景的需求。掌握这些技巧，可以帮助开发者创建出更加用户友好、功能完善的用户界面。

Qt 技巧笔记(七) QLineEdit 单行输入控件

一、QLineEdit控件常用属性设置详解

1.基本文本属性

2. 显示模式属性

3.输入验证属性

二、文本对齐方式解决

1. 水平对齐方式

2.垂直对齐方式

3.组合对齐方式

三、正则化表达式控制详解

1. 使用QRegularExpressionValidator

2. 使用QInputMask结合正则表达式

3. 实时正则匹配反馈

四、样式设置详解

1. 基本样式设置

2. 焦点状态样式

3. 只读状态样式

4. 错误状态样式

5. 高级样式技巧

5.1 渐变背景

5.2 自定义占位符文本样式

5.3 图标装饰

五、综合应用示例

六、总 结

六、总结