当前位置: 首页 > article >正文

QT界面开发:图形化设计、资源文件添加


设计界面介绍 

此时我们创建项目时就可以选择添加UI选项了。 添加完之后,我们可以看到,文件中多出了一个存放界面文件的目录,下面有个.ui的界面文件。甚至pro的项目文件中也会添加一项内容。

 我们点击界面文件中的.ui文件,我们可以来到设计界面。设计界面的一套流程主要包括以下几个步骤:1.使用工具箱中的控件(如按钮、文本框、标签等)拖拽到主窗体上。2.通过属性编辑器调整控件的属性(如大小、字体、颜色等),3.使用布局管理器(如水平布局、垂直布局等来控制控件的排列与自适应行为)。4.连接信号与槽:右击控件,选择"转到槽..."来创建和编辑槽函数。 

在这里,我们可以拖拽一些控件来实现界面的布局等信息。感觉跟之前学C#时的感觉很像,来感觉了。通过界面化的拖拽组件、部件等可以极大的解放我们去记一些类,通过拖拽,它能自动生成代码。通过右下角的属性界面,我们可以直接设置组件的一系列属性。

 太方便了有没有,此时就可以发挥你的想象来进行设计了。

然后我们试着设计一个登录界面:

登录界面初创建:

在上面的菜单栏输入一些文字,然后拖拽一个groupBox当作一个子容器,然后再分别拖拽两个标签、两个LineEdit、两个PushButton。然后调整布局,修改文本属性。设置成如下界面。

 然后我们就可以对按钮Button以及动作Action的点击/引发信号进行槽回应处理。从而实现我们的具体功能了。

登录功能初实现:

第一步:将子容器内的退出按钮与菜单栏下的退出动作与窗体的close关联上。

右击鼠标转到槽,然后选择需要发送的信号,然后会自动跳转到新建的槽函数中:

然后我们添加一句this->close();就可以将退出功能实现了。经过测试,结果与预期一致。但是对于菜单栏下的动作,我们不能右击鼠标进行转到槽。那我们就可以用connect自己进行连接:(按钮我们也可以进行这样的操作)

    //退出按钮
    // connect(ui->btnExit,&QPushButton::clicked,this,&QWidget::close);
    //退出动作
    connect(ui->actionexit,&QAction::triggered,this,&QWidget::close);

 第二步:确认按钮的逻辑实现

void MainWindow::on_btnSure_clicked()
{
    //登录按钮
    bool isContinue=true;
    if(ui->txtUid->text().size()==0){
        ui->statusbar->showMessage("用户名为空");
        isContinue=false;
    }
    else if(ui->txtPwd->text().size()==0){
        ui->statusbar->showMessage("密码为空");
        isContinue=false;
    }

    if(isContinue){
        // 新建一个窗口,点击登录,关闭该窗口,打开另一个窗口
        frmNext=new QMainWindow();
        frmNext->show();
        this->hide();
    }
    else {
        QMessageBox* msg=new QMessageBox(this);
        msg->setWindowTitle("警告");
        msg->setText("请输入账号/密码");
        msg->show();
    }
}

对于登录按钮,我们需要对我们输入的信息进行逻辑判断,第一点就是判空,如果用户名为空,我们就在状态栏给出具体错误信息:例如:“用户名为空"、"密码为空”等,为了确保用户能够看到,我们也可以使用QMessageBox进行消息提示框进行提醒,消息提示框我们可以使用另外一种简单的方式:

QMessageBox::warning(this,"警告","请检查是否输入账号以及密码");

此外,Qt为我们提供了许多标准的对话框,消息提示框只是其中一个

对于我们的消息提示框,Qt也为我们设计好了一些常用的标准框:

包括: 报错(critical),提示(information),询问(question),警告(warning),以及自定义提示框的图标的一个standardIcon()。

 回到正文,我们的登录按钮的逻辑第一就是判空,第二就是判断用户账号是否存在,然后再判断密码是否正确。这块一般使用数据库或者是文件操作,留给大家自行选择,自己实现了。(不懂得,可以看一下我C#实现图书馆信息管理系统那篇文章,看一下具体的逻辑,再回来写C++的代码)。至此,我们的两大功能:登录和退出就已经实现了,然后就是注册账号和找回密码。

这块都是需要进行用户数据匹配的,还是比较建议使用数据库,没学过用普通的文件操作也能实现。如果都不会,那数组总该会了吧。

定义一个用户类型的结构体,包括用户名和密码。然后每注册一个就将该用户加入到数组中,这样注册功能就实现了。忘记密码就是根据结构体对象的用户名匹配用户密码。登陆时也可以使用这样的方法进行用户匹配。还有用户名是否唯一、用户名是否存在的问题都需要考虑在内,此处我们需要考虑很多,但都不难。用数组的缺点就是只能在本次运行时,获取本次注册的用户信息,如果程序结束,下次运行将无法找回数据。所以文件操作可以解决这个问题,数据库当然也能,随大家意愿。

资源文件添加

此时你会觉得,上面的界面有点丑,我想加点图片啊什么的。当然了,十分的ok。我们现在尝试为菜单栏的菜单项添加一个自己喜欢的图片作为图标。

我们将图片路径添入:

ui->menuFile->setIcon(QIcon("D:/L/Pictures/wx存储/WeChat Files/All Users/stark.jpg"));

但是,不是每个人存放的路径都是跟我一样的,那我们复制这段代码运行后就会出错。我们怎么解决呢?就是引入资源文件,将图片等资源放到项目内:

第一步:将图片/文件夹放到本项目目录下

①、复制需要添加的项目资源文件夹。

②、找到项目,放到目录下:

这样,资源文件就添加到我们的项目中了,以后将项目传给别人时,项目资源也会传给别人,我们就无需访问本机绝对路径了。你以为这样就完了?还没有:

③、右击项目,新建文件:

为资源文件夹起名 :

此时我们就会发现,项目下多出了一个资源目录:

 

但是,当你退出该页面后,想要再次进入该文件,你会发现,双击不管用了。那么我们就需要右击该文件,然后以编辑的形式打开:

我们即可再次进入。进入之后,我们能添加一些前缀,这些前缀就是分组的意思,比如有些项目中,资源分为:人物、风景、宠物等,那么我们应该加上合适的前缀去寻找对应的资源,这里我们不加任何前缀,只有一个单独的 / 了。

选中所有图片:

 最终效果:

 

我就添加了这四个,当然,我们一定要为图片起好名字, 不然就有的难受了。此时我们再进行图标的设置,现在我为下面的注册添加一个懒大王的图标:

ui->actionregister->setIcon(QIcon("://项目资源/懒大王.png"));

记得冒号:,第一个/为前缀名。后面为资源路径 。


ok了,今天的内容就到这里吧。我们下期再见。


http://www.kler.cn/news/366285.html

相关文章:

  • Android 13 SystemUI 隐藏下拉快捷面板部分模块(wifi,bt,nfc等)入口
  • 【TFR-Net】基于transformer的鲁棒多模态情感分析特征重构网络
  • 力扣题解(执行操作可获得的最大总奖励II)
  • 智创 AI 新视界 -- 探秘 AIGC 中的生成对抗网络(GAN)应用
  • uniapp基础笔记
  • 2024 信友队 noip 冲刺 9.1
  • python+Mosh网课笔记13 使用Python进行机器学习
  • 对Kotlin在Android开发中的应用看法
  • Django模板的使用
  • w~自动驾驶合集7
  • Photoshop中的混合模式公式详解
  • GitLab+Jenkins 实现 Webhook 自动化触发构建
  • 聚观早报 | 谷歌重组AI部门;荣耀Magic 7标准版外观细节
  • # 渗透测试#安全见闻9 二进制安全
  • es中自定义ik的分词词库(词库布置在nginx)
  • 浪潮云启操作系统(InLinux)bcache缓存实践:理解OpenStack环境下虚拟机卷、Ceph OSD、bcache设备之间的映射关系
  • 莱维飞行(Levy Flight)机制的介绍和MATLAB例程
  • QStyledItemDelegate用法(PyQt)
  • C++中的list介绍(常用函数)
  • Flume面试整理-如何处理Flume中的数据丢失
  • 2769. 找出最大的可达成数字
  • Linux操作命令(一)
  • GaussDB逻辑解码技术原理
  • OceanBase 首席科学家阳振坤:大模型时代的数据库思考
  • fpga开发环境总结
  • Spring声明式事务管理是通过注解或 XML 配置来实现