11.QT-输入类控件|Line Edit|Text Edit|录入个人信息|验证输入框数据|验证两次输入一致|切换显示密码|获取多行输入内容|验证输入框各种信号(C++)

Line Edit

QLineEdit ⽤来表⽰单⾏输⼊框.可以输⼊⼀段⽂本,但是不能换⾏.

属性	说明
text	输⼊框中的⽂本
inputMask	输⼊内容格式约束
maxLength	最⼤⻓度
frame	是否添加边框
echoMode	显⽰⽅式. • QLineEdit::Normal ：这是默认值，⽂本框会显⽰输⼊的⽂本。 • QLineEdit::Password ：在这种模式下，输⼊的字符会被隐藏，通常⽤星号（*）或等号（=）代替。 • QLineEdit::NoEcho ：在这种模式下，⽂本框不会显⽰任何输⼊ 的字符。
cursorPosition	光标所在位置
alignment	⽂字对⻬⽅式,设置⽔平和垂直⽅向的对⻬.
dragEnabled	是否允许拖拽
readOnly	是否是只读的(不允许修改)
placeHolderText	当输⼊框内容为空的时候,显⽰什么样的提⽰信息
clearButtonEnabled	是否会⾃动显⽰出"清除按钮"

属性	说明
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是新的⽂本。 代码对⽂本的修改不能触发这个信号

代码示例:录⼊个⼈信息

让用户输入个人信息～
1)姓名 2)密码 3）性别 4)电话
通过提交按钮，把上述内容给统一获取到～~

1)在界⾯上创建三个输⼊框和两个单选按钮,⼀个普通按钮.
三个输⼊框的 objectName 为 lineEdit_name , lineEdit_password ,lineEdit_phone
两个单选按钮的 objectName 为 radioButton_male , radioButton_female
按钮的 objectName 为 pushButton

2)编写widget.cpp,在构造函数中编写初始化代码.

#include "widget.h"
#include "ui_widget.h"
#include <QDebug>
  
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
  
    //编写第一个输入框，用来输入姓名
    ui->lineEdit_name->setPlaceholderText("请输入姓名");
    ui->lineEdit_name->setClearButtonEnabled(true);
  
    //初始化第二个输入框
    ui->lineEdit_password->setPlaceholderText("请输入密码");
    ui->lineEdit_password->setClearButtonEnabled(true);
    //把显示模式设置成显示密码的模式
    ui->lineEdit_password->setEchoMode(QLineEdit::Password);
  
    //初始化第三个输入框
    ui->lineEdit_phone->setPlaceholderText("请输入电话号码");
    ui->lineEdit_phone->setClearButtonEnabled(true);
    //手机号码固定格式，此处的0代表数字 InputMask可以对输入内容进行简单校验
    ui->lineEdit_phone->setInputMask("000-0000-0000");
}
  
Widget::~Widget()
{
    delete ui;
}
  
  
void Widget::on_pushButton_submit_clicked()
{
    QString gender = ui->radioButton_male->isChecked() ? "男" : "女";
  
    qDebug() << "姓名: " << ui->lineEdit_name->text()
             << "密码: " << ui->lineEdit_password->text()
             << "性别: " << gender
             << "电话: " << ui->lineEdit_phone->text();
  
}

4)执⾏程序,可以看到,随着⽤⼾输⼊内容之后,点击按钮,就能打印到输⼊的信息

inputMask只能进⾏简单的输⼊格式校验.
实际开发中,基于正则表达式的⽅式是更核⼼的⽅法.

代码⽰例:使⽤正则表达式验证输⼊框的数据

此处要求在输⼊框中输⼊⼀个合法的电话号码(1开头,11位,全都是数字).如果验证不通过,则确定按钮⽆法点击.
就需要使用"正则表达式"
计算机中的通用概念，和具体的编程语言无关，
正则表达式，本质上就是一个带有特殊字符的字符串.特殊字符用来表示另一个字符串的特征此时就可以借助正则表达式来描述出一些具有一定特点的字符串
基于这些特点，就可以完成字符串的匹配

关于正则表达式
正则表达式是⼀种在计算机中常⽤的,使⽤特殊字符描述⼀个字符串的特征的机制.在进⾏字符串匹配时⾮常有⽤.
正则表达式的语法还⽐较复杂,⼀般都是随⽤随查,不需要背下来.
参考:
正则表达式语法 | Microsoft Learn
正则表达式语法测试工具 - 在线工具

1)在界⾯上创建输⼊框和⼀个按钮.

此处的规则是，输入框要检查输入的内容是否是合法的手机号码
如果是，则按钮设为可用状态
如果不是，则设为禁用状态
2)编写widget.cpp,把按钮初始enabled设为false.给输⼊框添加验证器.

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    //给单行输入框设置验证器，基于正则表达式完成
    QRegExp regExp("^1\\d{10}$");
    ui->lineEdit->setValidator(new QRegExpValidator(regExp));
    //ui->lineEdit->setValidator(new QRegExpValidator(QRegExp("^1\\d{10}$")));
}

• 使⽤ QRegExp 创建⼀个正则表达式对象. "^1\\d{10}$" 表⽰"以1开头,后⾯跟上任意的10个⼗进制数字".
  ^表示以xXX开头
  ～后面跟着的1，意思就是以1开头，
  ld表示数字，为了在C++字符串中使用，需要写作\d
  {10}表示前面的内容重复出现10次.\d数字要重复出现10次 $表示结尾了.
• 使⽤ QRegExpValidator 创建⼀个验证器对象.Qt中内置了四个主要的验证器对象.
  

QRegularExpressionValidator 在匹配性能上做出了⼀定优化.但是从使⽤⻆度讲,和QRegExpValidator 差别不⼤.我们使⽤ QRegExpValidator 即可

验证输入框的内容，是否合法
只要输入框中的内容发生改变了，验证操作就应该被执行

3)编写widget.cpp,给 lineEdit 添加 textEdited 信号的slot函数.

• on_lineEdit_textEdited 的参数是当前输⼊框的内容.
• 通过 lineEdit->validator() 获取到内置的验证器.

State validate(QString &, int &)

• 通过 validate ⽅法验证⽂本是否符合要求.
  • 第⼀个参数填写的是要验证的字符串.由于参数要求是 QString& ⽽不是 const QString& ,需要把这个变量复制⼀下.
  • 第⼆个参数是⼀个int&,是输出型参数.当验证的字符串不匹配时,返回这个字符串的⻓度.
  • 返回值是⼀个枚举. QValidator::Acceptable 表⽰验证通过,QValidator::Invalid 表⽰验证不通过.
    程序员可以自定义一个Validator，重写validate函数. 刚才用的RegExpValidator是Qt内置的

void Widget::on_lineEdit_textEdited(const QString &text)
{
    QString content = text;
    int pos = 0;
    if (ui->lineEdit->validator()->validate(content, pos) == QValidator::Acceptable) {
        //验证通过
        ui->pushButton->setEnabled(true);
    } else {
        //验证不通过
        ui->pushButton->setEnabled(false);
    }
}

代码⽰例:验证两次输⼊的密码⼀致

验证两次输入的密码是否一致
使用textEdited信号，来触发对于两个输入框内容的判定～~
1)在界⾯上创建两个输⼊框和⼀个label

2)编写代码,设置两个输⼊框的 echoMode 为 Password

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
  
    //初始化，设置两个输入框的echomode
    ui->lineEdit->setEchoMode(QLineEdit::Password);
    ui->lineEdit_2->setEchoMode(QLineEdit::Password);
    ui->label->setText("密码为空");
}

3)给两个输⼊框设置 textEdited slot函数

void Widget::on_lineEdit_textEdited(const QString &arg1)
{
    (void) arg1;
    this->compare();
}
  
void Widget::on_lineEdit_2_textEdited(const QString &arg1)
{
    (void) arg1;
    this->compare();
}
  
void Widget::compare()
{
    const QString& s1 = ui->lineEdit->text();
    const QString& s2 = ui->lineEdit_2->text();
    if (s1.isEmpty() && s2.isEmpty()) {
        ui->label->setText("密码为空");
    } else if (s1 == s2) {
        ui->label->setText("两次输入的密码一致");
    } else {
        ui->label->setText("两次输入的密码不一致");
    }
}

(void) arg1;

这个写法就是类型转换
这个写法对于代码的实际逻辑是没有任何影响的同时可以“骗过”编译器，警告就没了～~

4)执⾏程序,观察效果.

代码⽰例:切换显⽰密码

1)创建⼀个输⼊框和⼀个复选按钮.

2)修改widget.cpp,设置输⼊框的 echoMode 为 Password

#include "widget.h"
#include "ui_widget.h"
  
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
  
    //初始化显示模式
    ui->lineEdit->setEchoMode(QLineEdit::Password);
}
  
Widget::~Widget()
{
    delete ui;
}
  
  
void Widget::on_checkBox_toggled(bool checked)
{
    if (checked) {
        //true，显示密码状态，把显示模式，设为Normal
        ui->lineEdit->setEchoMode(QLineEdit::Normal);
    } else {
        //false，隐藏密码状态，把显示模式，设为Password
        ui->lineEdit->setEchoMode(QLineEdit::Password);
    }
}

Text Edit

QTextEdit 表⽰多⾏输⼊框.也是⼀个富⽂本&markdown编辑器.
并且能在内容超出编辑框范围时⾃动提供滚动条.

属性	说明
markdown	输⼊框内持有的内容.⽀持markdown格式.能够⾃动的对markdown⽂本进⾏渲染成html
html	输⼊框内持有的内容.可以⽀持⼤部分html标签.包括img和table等.
placeHolderText	输⼊框为空时提⽰的内容.
readOnly	是否是只读的
undoRedoEnable	是否开启undo/redo功能. 按下ctrl+z触发undo 按下ctrl+y触发redo
autoFormating	开启⾃动格式化.
tabstopWidth	按下缩进占多少空间
overwriteMode	是否开启覆盖写模式
acceptRichText	是否接收富⽂本内容
verticalScrollBarPolicy	垂直⽅向滚动条的出现策略 • Qt::ScrollBarAsNeeded :根据内容⾃动决定是否需要滚动条。这是默认值。 • Qt::ScrollBarAlwaysOff :总是关闭滚动条。 • Qt::ScrollBarAlwaysOn :总是显⽰滚动条。
horizontalScrollBarPolicy	⽔平⽅向滚动条的出现策略 • Qt::ScrollBarAsNeeded :根据内容⾃动决定是否需要滚动条。这是默认值。 • Qt::ScrollBarAlwaysOff :总是关闭滚动条。 • Qt::ScrollBarAlwaysOn :总是显⽰滚动条。

信号	说明
textChanged()	⽂本内容改变时触发
selectionChanged()	选中范围改变时触发
cursorPositionChanged()	光标移动时触发
undoAvailable(bool)	可以进⾏undo操作时触发
redoAvailable(bool)	可以进⾏redo操作时触发
copyAvaiable(bool)	⽂本被选中/取消选中时触发

代码⽰例:获取多⾏输⼊框的内容

1)创建⼀个多⾏输⼊框和⼀个label

2)给多⾏输⼊框添加slot函数.处理 textChanged 信号.

• 通过 toPlainText ⽅法获取到内部的⽂本.
• 类似的, QTextEdit 还提供了 toMarkdown 和 toHtml .根据需要我们调整不同的获取⽅式.

void Widget::on_textEdit_textChanged()
{
    //获取到多行输入框的内容
    const QString& text = ui->textEdit->toPlainText();
    ui->label->setText(text);
}

3)执⾏程序,可以看到当输⼊框中的内容发⽣变化时,label中的内容同步发⽣改变.

代码⽰例:验证输⼊框的各种信号

1)创建多⾏输⼊框

2)给输⼊框添加以下⼏个slot函数

• QTextEdit 中包含了⼀个 QTextCursor 对象,通过这个对象可以获取到当前光标位置和选中的内容.

void Widget::on_textEdit_textChanged()
{
    qDebug() << "textChanged: " << ui->textEdit->toPlainText();
}
  
void Widget::on_textEdit_selectionChanged()
{
    QTextCursor cursor =  ui->textEdit->textCursor();
    qDebug() << "selectionChanged: " << cursor.selectedText();
}

void Widget::on_textEdit_cursorPositionChanged()
{
    QTextCursor cursor = ui->textEdit->textCursor();
    qDebug() << "cursorPositionChanged: " << cursor.position();
}

void Widget::on_textEdit_undoAvailable(bool b)
{
    qDebug() << "undoAvailable: " << b;
}
  
void Widget::on_textEdit_redoAvailable(bool b)
{
    qDebug() << "redoAvailable: " << b;
}
  
void Widget::on_textEdit_copyAvailable(bool b)
{
    qDebug() << "copyAvailable: " << b;
}

1. 编写内容时, textChanged 和 cursorPositionChanged 会触发
2. 选中⼀段⽂本时, cursorPositionChanged , selectionChanged , copyAvailable 会触发.
3. 按下ctrl+z时, textChanged , undoAvailable , redoAvailable ,cursorPositionChanged 会触发
4. 按下ctrl+y, textChanged , undoAvailable , redoAvailable ,cursorPositionChanged 会触发