【C++ Qt】输入类控件(上) LineEdit、QTextEdit

06-02 1430阅读

【C++ Qt】输入类控件(上) LineEdit、QTextEdit

每日激励:“不设限和自我肯定的心态:I can do all things。 — Stephen Curry”

绪论​:

本次分享聚焦 Qt 框架里常用的输入框组件,重点讲解 QLineEdit(单行输入框)和 QTextEdit(多行输入框)。先了解 QLineEdit 的核心属性,比如控制输入显示模式的 echoMode、限制输入格式的 inputMask,还有它提供的文本改变等信号,再通过个人信息输入、密码一致性验证等案例,掌握其实际用法。接着介绍支持多行输入及富文本、markdown 格式的 QTextEdit,了解它的关键属性和核心信号,通过获取内容、响应操作等案例,学会如何运用它。

————————

早关注不迷路,话不多说安全带系好,发车啦(建议电脑观看)。

Line Edit

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

核心属性:

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

核⼼信号

属性说明
void cursorPositionChanged (intold, 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: 实例 个人信息(密码的隐藏)

用户输入个人信息:姓名、密码、性别、电话

将上述内容统一获取到

【C++ Qt】输入类控件(上) LineEdit、QTextEdit

  1. ui文件 拖转 4个 label:姓名、…
  2. 再在对应的label后面添加 edit 、性别 提供 男女单选框
  3. 最终下面添加一个按钮:提交(具体如上图)
  4. 构造设置:
    1. 给输入框添加 placeholder(输入提示)
    2. 清空按钮 ClearButtonEnabled(当存在值时能够快速删除的按钮)
    3. 其中对于密码来说还要添加echomode模式设置为 QLineEdit::Password
    4. 手机号码,限制格式 InputMask(“000-0000-0000”)3-4-4的效果输入,他能更具输入框进行内容的简单校验
  5. 给按钮设置槽函数
    1. 控件调用text获取打印姓名、命名
    2. 性别通过控价调用isChecked获取(返回真假)再配合判断进行打印~

此处只是简单打印,实际开发可以将内容发给服务器

【C++ Qt】输入类控件(上) LineEdit、QTextEdit

#include "widget.h"
#include "ui_widget.h"
#include 
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    ui->lineEdit_name->setPlaceholderText("输入用户名");
    ui->lineEdit_name->setClearButtonEnabled(true);
    ui->lineEdit_pwd->setPlaceholderText("输入密码");
    ui->lineEdit_pwd->setClearButtonEnabled(true);
    ui->lineEdit_pwd->setEchoMode(QLineEdit::Password);//设置为密码的形式,这样当输入时就无法查看到了
    ui->lineEdit_tel->setPlaceholderText("输入手机号");
    ui->lineEdit_tel->setClearButtonEnabled(true);
    //限制手机号的格式,"000-0000-0000"
    ui->lineEdit_tel->setInputMask("000-0000-0000");//实现简单的校
}
Widget::~Widget()
{
    delete ui;
}
void Widget::on_pushButton_clicked()
{
    //获取值并打印查看
    qDebug() lineEdit_name->text() isChecked()){
        qDebug() radioButton_2->isChecked()){
         qDebug() 
    ui-setupUi(this);
    ui->lineEdit_name->setPlaceholderText("输入用户名");
    ui->lineEdit_name->setClearButtonEnabled(true);
    ui->lineEdit_pwd->setPlaceholderText("输入密码");
    ui->lineEdit_pwd->setClearButtonEnabled(true);
    ui->lineEdit_pwd->setEchoMode(QLineEdit::Password);//设置为密码的形式,这样当输入时就无法查看到了
    ui->lineEdit_tel->setPlaceholderText("输入手机号");
    ui->lineEdit_tel->setClearButtonEnabled(true);
    //限制手机号的格式,"000-0000-0000"
//    ui->lineEdit_tel->setInputMask("000-0000-0000");//实现简单的校验
    //设置验证器
    QRegExp reg("^1\\d{10}$");//^代表开始 以1开头再加上10个整数 &表示结束
    //给lineEdit注册一个验证器
    ui->lineEdit_tel->setValidator(new QRegExpValidator(reg));//注意需要加上 QRegExpValidator的头文件
}
Widget::~Widget()
{
    delete ui;
}
void Widget::on_pushButton_clicked()
{
    //获取值并打印查看
    qDebug() lineEdit_name->text() isChecked()){
        qDebug() radioButton_2->isChecked()){
         qDebug() 
    QString str = arg1;
    int t;
    //通过输入框调用设置进去的validator进行判断是否符合
    if(ui-lineEdit_tel->validator()->validate(str,t) == QValidator::Acceptable){//符合条件会返回:QValidator::Acceptable
      ui->pushButton->setEnabled(true);
    }
}

实操2: 验证两次密码输入是否一样

【C++ Qt】输入类控件(上) LineEdit、QTextEdit

  1. 打开ui文件 拖拽两个LineEdit
  2. 构造函数中进行初始化:
    1. 设置echoMode为密码模式
  3. 同样使用textEdited信号来进行判定是否有输入内容
  4. 再在顶上通过放上一个label内部执行判断,输入框的状态:
  5. 给两个输入框添加槽函数:
    1. 为空(s1.isEmpty & s2.isEmpty)、密码不一致、密码一致(s1 == s2)
    2. 搞一个compare公共函数存储上述判断内容
  6. (void)arg1:来避免不使用arg1带来的警告

【C++ Qt】输入类控件(上) LineEdit、QTextEdit

#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);//设置为密码
    ui->lineEdit_2->setEchoMode(QLineEdit::Password);//设置为密码模式
}
Widget::~Widget()
{
    delete ui;
}
void Widget::compare(){
    QString str1 = ui->lineEdit->text();
    QString str2 = ui->lineEdit_2->text();
    if(str1.isEmpty() || str2.isEmpty()){
        ui->label->setText("请输入密码");
    }
    else if(str1 == str2){
        ui->label->setText("密码一致");
    }else{
        ui->label->setText("密码不一致");
    }
}
//当文本发送改变进行判断
void Widget::on_lineEdit_textEdited(const QString &arg1)
{
    (void) arg1;//使用arg1不要去除警告
    compare();
}
//当文本发送改变进行判断
void Widget::on_lineEdit_2_textEdited(const QString &arg1)
{
     (void) arg1;//使用arg1不要去除警告
    compare();
}

【C++ Qt】输入类控件(上) LineEdit、QTextEdit

实操3:针对密码,让其可以通过一个按钮进行显示

  1. 拖拽check box、LinuxEdit
  2. 构造函数:
    1. 初始情况下,输入框的密码方式为密码模式
    2. 对显示密码的按钮,使用toggled信号编写槽(因为有个checked参数代表选中/每选中)
  3. 槽函数(右键快速生成)
    1. 判断checked
    2. 为true将输入框的显示模式setEchoMode设为“Normal”
    3. 为false则设置为“隐藏密码”状态

      【C++ Qt】输入类控件(上) LineEdit、QTextEdit

      【C++ Qt】输入类控件(上) LineEdit、QTextEdit

构造函数:
ui->lineEdit_3->setEchoMode(QLineEdit::Password);//设置为密码模式
槽函数:
void Widget::on_checkBox_toggled(bool checked)
{
    //其中的 checked 代表是否选中
    if(checked == true){
        //设置editline的模式
        ui->lineEdit_3->setEchoMode(QLineEdit::Normal);//Normal代表真常文本格式
    }else{
        ui->lineEdit_3->setEchoMode(QLineEdit::Password);
    }
}

QTextEdit

QTextEdit 表⽰多⾏输⼊框. 也是⼀个支持 富⽂本 & markdown 的编辑器

其中能显示多行的还有 QPlainTextEdit,但它不能支持富文本和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:获取多⾏输⼊框的内容

  1. 拖拽TextEdit和label,使用 textChange 信号添加信号槽
  2. 获取文本(toPlainText)存放到text变量中
  3. 将text中的内容设置到label中
void Widget::on_textEdit_textChanged()
{
    //将textEdit中的内容放到label中
    QString text = ui->textEdit->toPlainText();//toPlainText
    ui->label->setText(text);
}

【C++ Qt】输入类控件(上) LineEdit、QTextEdit


实操2:TextLabel中常用信号

  1. 拖拽个TextEdit
  2. 根据两个信号:textChanged、selectionChanged进行操作
  3. 在textChange(内容被修改时触发的信号)信号槽:
    1. 直接打印文本内容
  4. 在selectionChanged(内容被选择时触发的信号)中:
    1. 首先获取光标对象,通过控件调用 textCursor 获取光标选中文本
    2. 打印对象中的文本(selectedText)
  5. 其他信号:
  6. CursorPositionChanged(光标选择改变时触发的信号)
    1. 获取光标对象(方法同上)
    2. 打印光标的位置(光标对象调用position)
  7. undoAvailabel、redoAvailabel、copyAvailable
    1. 进行输入(ctrl + z),撤销(ctrl + y),撤销的撤销
    2. 打印查看 参数 b
//内容改变时触发
void Widget::on_textEdit_2_textChanged()
{
    qDebug() textEdit_2->toPlainText();
}
//鼠标选择改变时触发
void Widget::on_textEdit_2_selectionChanged()
{
    QTextCursor text = ui->textEdit_2->textCursor();
    qDebug() 
    QTextCursor cursor = ui-textEdit_2->textCursor();//获取光标对象
    qDebug() 
    qDebug() 
    qDebug() 
    qDebug() 
免责声明:我们致力于保护作者版权,注重分享,被刊用文章因无法核实真实出处,未能及时与作者取得联系,或有版权异议的,请联系管理员,我们会立即处理! 部分文章是来自自研大数据AI进行生成,内容摘自(百度百科,百度知道,头条百科,中国民法典,刑法,牛津词典,新华词典,汉语词典,国家院校,科普平台)等数据,内容仅供学习参考,不准确地方联系删除处理! 图片声明:本站部分配图来自人工智能系统AI生成,觅知网授权图片,PxHere摄影无版权图库和百度,360,搜狗等多加搜索引擎自动关键词搜索配图,如有侵权的图片,请第一时间联系我们。

相关阅读

目录[+]

取消
微信二维码
微信二维码
支付宝二维码