Qt登录窗口-ui结合qss

最新推荐文章于 2024-09-15 10:03:12 发布

richrich2

最新推荐文章于 2024-09-15 10:03:12 发布

阅读量822

点赞数

分类专栏： Qt代码实战文章标签： qt css gui 界面设计

本文链接：https://blog.csdn.net/mrfanhaibin/article/details/115203797

版权

本文介绍了如何使用Qt创建一个美观的登录窗口，通过QSS实现界面风格的定制。首先，新建LoginWidget窗口，包含背景图片、软件标题、用户名和密码输入框以及登录和关闭按钮。接着，详细讲述了加载样式表的步骤，并提供了login.qss的代码示例，最终展示了运行后的软件界面效果。

摘要由CSDN通过智能技术生成

Qt桌面开发往往第一步是制作一个登录窗口，好看的登录窗口设计往往能使用户耳目一新，对软件好感度增加。本文将详细讲述如何使用qss制作一个漂亮的登录窗口。

1. 新建一个LoginWidget窗口类，对该窗口类进行以下两步操作：

a.使用UI设计师布局如下界面
在这里插入图片描述

使用一个QLabel做为背景，方便加载背景图片，命名为label_background;
使用一个QLabel做为软件名称，命名为label_title;
使用两个QLineEdit分别做为用户名和密码的输入窗口；
使用两个按钮，分别代表登录和关闭。

b.完成加载样式表的代码

//加载样式表文件
    QDir dir;
    dir.setPath("./data/qss");
    QFile file(dir.absoluteFilePath("login.qss"));
    file.open(QFile::ReadOnly);
    if (file.isOpen())
    {
        QString mainqss = file.readAll();
        setStyleSheet(mainqss);
    }

2. 完成login.qss的编写,代码如下：

/*设置登录窗口的大小*/
QWidget#LoginWidget{
	width: 640px;
	height: 440px;
}
/*设置背景图

最低0.47元/天解锁文章