【qt】制作一个简单的qt界面(qq登陆界面)

来源

B站大学

步骤

1. 创建QT工程

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
确认基类是QWidgt,其他默认。
在这里插入图片描述

2. .pro文件参数解释

在这里插入图片描述

3. 界面框架搭建

在这里插入图片描述

3.1 页面大小调节

geometry : 高度宽度调整整个页面大小

在这里插入图片描述

3.2 提示显示信息设置

Display Widgets -> Label 显示框

直接拖拽到界面中,调整大小
在这里插入图片描述

alignment -> 水平的 -> AlignHCenter : 设置label中的文本居中显示

在这里插入图片描述

front -> 点大小 : 调节label中文本字体

在这里插入图片描述
同理,拖拽label,建立账号密码提示框并调节。
在这里插入图片描述

3.3 输入框设置

Input Widgets -> Line Edit : 输入框(不自动换行,多场都放在一行)

拖拽到页面中,建立账号密码输入框。
在这里插入图片描述
同时,我们还要设置密码输入框的属性,将密码具体内容对外界隐藏。首先选中密码输入框,然后进行如下调整:

echoMode -> Password : 将输入框内容显示为圆圈(加密)
在这里插入图片描述

3.4 按钮设置

Buttons -> Push Button : 按钮触发

拖拽,向界面中加入注册和登录按钮。
在这里插入图片描述
至此基本图形框架就搭好了。运行看一下:
在这里插入图片描述
运行结果:
在这里插入图片描述
但登录和注册的按钮都无法使用,因此需要对按钮进行设置,即设置qt的信号和槽。

4. 设置信号和槽

4.1 给控件改名字

改名字单纯是为了方便自己,方便他人。
选中某一控件,根据对应位置,直接双击,然后输入要修改的名字。(label没必要修改名字)
在这里插入图片描述

4.2 信号和槽

信号:控件发出的特定信号。单机控件就会触发此信号。

查看刚添加的按钮的信号(push button)。
在这里插入图片描述
在这里插入图片描述
发现当前页面找不到push button的信号,所以从他的父类(QAbstractButton)中去找。
在这里插入图片描述
找到,共四个信号,常用的是click信号。

槽:通常将某个槽函数绑定在控件的信号上,当点击控件触发信号时,也就会触发这个槽函数。

4.3 关联信号和槽

<1> 自动关联
sign in按钮为例:选中控件->右击->转到槽->clicked在这里插入图片描述在这里插入图片描述
所做工作:1. 在widget.h中声明槽函数

  • 注意:槽函数只能声明到private slotspublic slots中。

在这里插入图片描述
2. 在widget.cpp中创建槽函数,具体实现功能在在此槽函数中编写。
在这里插入图片描述
例如,打印一串字符,每点击一次sign in按钮,就会打印一行。所以,槽函数关联成功。若不相关联的话,就把.h和.cpp中相关内容删除即可。
在这里插入图片描述
<2> 手动关联
log in按钮为例:并不只是将自动关联中的步骤实现一下,而需要使用connect函数。

connect(ui->logBt, SIGNAL(clicked()), this, SLOT(on_loginBt_clicked()));
// 控件,信号,当前,槽函数
connect(A, SIGNAL(B), C, SLOT(D));
// 当对象A发出信号B的时候,会触发对象C的槽函数D

在这里插入图片描述

然后再在.h文件中定义和在.cpp文件中实现槽函数。
在这里插入图片描述
在这里插入图片描述
关联完成,点击相应按钮获得相应输出。
在这里插入图片描述

相关函数查询

当我们在不知道某个函数怎么使用时,可以在帮助->索引中查找相关函数的用法。
在这里插入图片描述

  • 6
    点赞
  • 35
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,下面是一个使用Qt编写的简单登录界面的示例代码: ```cpp #include <QtWidgets/QApplication> #include <QtWidgets/QWidget> #include <QtWidgets/QLabel> #include <QtWidgets/QLineEdit> #include <QtWidgets/QPushButton> #include <QtWidgets/QMessageBox> int main(int argc, char *argv[]) { QApplication app(argc, argv); // 创建主窗口 QWidget window; window.setWindowTitle("登录"); // 创建用户名和密码的标签和文本框 QLabel *usernameLabel = new QLabel("用户名:", &window); QLineEdit *usernameLineEdit = new QLineEdit(&window); QLabel *passwordLabel = new QLabel("密码:", &window); QLineEdit *passwordLineEdit = new QLineEdit(&window); passwordLineEdit->setEchoMode(QLineEdit::Password); // 创建登录按钮 QPushButton *loginButton = new QPushButton("登录", &window); // 设置布局 QVBoxLayout *layout = new QVBoxLayout(&window); layout->addWidget(usernameLabel); layout->addWidget(usernameLineEdit); layout->addWidget(passwordLabel); layout->addWidget(passwordLineEdit); layout->addWidget(loginButton); // 连接登录按钮的点击事件 QObject::connect(loginButton, &QPushButton::clicked, [&]() { QString username = usernameLineEdit->text(); QString password = passwordLineEdit->text(); if (username == "admin" && password == "123456") { QMessageBox::information(&window, "登录成功", "欢迎,管理员!"); } else { QMessageBox::warning(&window, "登录失败", "用户名或密码错误!"); } }); // 显示窗口 window.setLayout(layout); window.show(); return app.exec(); } ``` 这个示例中创建了一个简单的登录界面,包括用户名、密码的标签和文本框,以及一个登录按钮。当点击登录按钮时,会检查用户名和密码是否正确,并在对话框中显示相应的结果。你可以根据需要进行修改和扩展。编译运行这段代码后,就可以看到登录界面了。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值