QT学习笔记3：使用ui界面加少量代码创建一个登陆界面

大部分QT教程都是用代码实现，这里分享一个用ui界面设计的QT应用

界面效果及所实现功能

界面效果：
所实现功能：
1.用户名以明文显示，密码以***显示（看不到）
2.可以预设一个用户名和密码
3.当输入用户名与预设的不相同时时，按下确认会显示用户不存在；
当输入用户名正确，密码不正确，按下确认键会显示密码错误；
用户名密码正确，显示登陆成功；
4.按下取消退出这个界面

全部代码

整个工程只有widg.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_2->setEchoMode(QLineEdit::Password);   //设置密码显示方式
}

Widget::~Widget()
{
    delete ui;
}

void Widget::on_pushButton_2_clicked()
{
    this->close();
}

void Widget::on_pushButton_clicked()
{
    if(ui->lineEdit->text() =="xiaozhikang")
    {
      if(ui->lineEdit_2->text() =="123456"){
          qDebug()<<"登陆成功"<<endl;
          this->close();
      }
      else{
          qDebug() <<"密码错误" <<endl;
      }

    }
    else {
       qDebug()<<"用户不存在"<<endl;
    }
}

但还是把其他文件的放在这里：
widget.h

#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>

namespace Ui {
class Widget;
}

class Widget : public QWidget
{
    Q_OBJECT

public:
    explicit Widget(QWidget *parent = nullptr);
    ~Widget();

private slots:
    void on_pushButton_2_clicked();

    void on_pushButton_clicked();

private:
    Ui::Widget *ui;
};

#endif // WIDGET_H

main.cpp

#include "widget.h"
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    Widget w;
    w.show();

    return a.exec();
}

具体实现

1.创建一个包含ui文件的项目

选中Qwidget，其他按默认的来
得到如下文件：

2.在ui界面把大体布局设置好

双击widget.ui,进入如下界面：

选中两个label拖入中间的灰色区域：
选中两个lineedit拖入：
选中两个pushbutton拖入：
调整大小、输入文字：

3.设置字体和字号：

在属性的font一栏选择：

4.实现确认和取消的功能：

鼠标选中取消，右击->转到槽->clicked()
会跳转到widget.cpp,同时输入箭头所示代码：

void Widget::on_pushButton_2_clicked()     //这里是实现"取消"的槽函数，也就是实现"取消"的功能
{
    this->close();
}

同样的在“确认”处右击->转到槽->clicked()，记得包含QDebug文件，同时输入以下代码：

void Widget::on_pushButton_clicked()
{
    if(ui->lineEdit->text() =="xiaozhikang")
    {
      if(ui->lineEdit_2->text() =="123456"){
          qDebug()<<"登陆成功"<<endl;
          this->close();
      }
      else{
          qDebug() <<"密码错误" <<endl;
      }

    }
    else {
       qDebug()<<"用户不存在"<<endl;
    }
}

5.将密码隐藏显示：

输入如下一行代码：

	ui->lineEdit_2->setEchoMode(QLineEdit::Password);   //设置密码显示方式

6.大功告成：

若出现乱码如图：

选中编辑->select encoding->UTF-8->按编码重新载入/按编码保存

完成：