Qt_day4_Qt_UI设计

目录

Qt_UI设计

1. Designer 设计师(掌握)

2. Layout 布局(重点)

2.1 基本使用

2.2 高级用法

2.3 代码布局(了解)

3. Designer与C++的关系(熟悉)

4. 基本组件(掌握)

4.1 QWidget

4.2 QLabel 标签

4.3 QAbstractButton 按钮类

4.4 QLineEdit 单行文本输入框

4.5 QComboBox 组合框

4.6 一组与数字相关的组件


Qt_UI设计

1. Designer 设计师(掌握)

    Designer是Qt内置的一款界面设计程序,设计的界面文件为.ui格式。

    C++程序员通常不会单独启动Designer,如果要在项目中使用Designer程序,只需要在新建项目时,勾选“创建界面文件”选项。

这样的项目自带dialog.ui,双击dialog.ui可以直接使用Designer程序打开此文件。

2. Layout 布局(重点)

2.1 基本使用

    可以把布局看做是一个透明的盒子,内部放置各种组件对象,这些组件对象会按照布局预设的规则自动排序,并形成一个布局整体。

Qt中有四种布局:

    主要学习前两种,垂直/水平布局指的是布局中所有的子组件垂直/水平排成一排,常用属性如下:

    需要注意的是,最终的显示效果是多个因素综合决定的,并非一个因素完全决定。

2.2 高级用法

  • 伸展器

如果需要在布局中填充空白,可以使用伸展器组件。

  • 嵌套

布局和布局之间可以嵌套,内层布局相当于外层布局的一个组件。

  • 贴合

    选中窗口对象,点击,可以让最外层布局贴合窗口,以达到窗口大小自适应效果。

可以点击打破任何一个选中的布局,例如取消贴合效果,需要先选中窗口,然后点击此按钮。

2.3 代码布局(了解)

    也可以使用C++进行布局,仅做展示。

dialog.h

#ifndef DIALOG_H
#define DIALOG_H#include <QDialog>
#include <QVBoxLayout>
#include <QPushButton>class Dialog : public QDialog
{Q_OBJECTpublic:Dialog(QWidget *parent = 0);~Dialog();private:QVBoxLayout* layout;QPushButton* btn1;QPushButton* btn2;
};#endif // DIALOG_H

dialog.cpp

#include "dialog.h"Dialog::Dialog(QWidget *parent): QDialog(parent)
{resize(400,400);layout = new QVBoxLayout(this);btn1 = new QPushButton("A",this);btn2 = new QPushButton("B",this);// 把两个按钮加入到布局中layout->addWidget(btn1);layout->addWidget(btn2);
}Dialog::~Dialog()
{delete layout;delete btn1;delete btn2;
}

虽然代码布局复杂,但是性能好。

3. Designer与C++的关系(熟悉)

dialog.h

#ifndef DIALOG_H
#define DIALOG_H#include <QDialog>namespace Ui {
class Dialog;
}class Dialog : public QDialog
{Q_OBJECTpublic:explicit Dialog(QWidget *parent = 0);~Dialog();private:Ui::Dialog *ui; // ui指针:界面文件的对象化
};#endif // DIALOG_H

dialog.cpp
#include "dialog.h"
#include "ui_dialog.h"Dialog::Dialog(QWidget *parent) :QDialog(parent),ui(new Ui::Dialog) // 构造初始化列表
{// 按照ui文件设计内容在C++中创建对象并初始化ui->setupUi(this);// 可以通过ui指针+对象名称,在C++中找到ui中的对象ui->pushButtonA->setText("是不是?");
}Dialog::~Dialog()
{// 销毁ui,一并销毁ui文件中所有的对象delete ui;
}

    因为Designer造成的开销相对于常用的Windows而言微不足道,因此后续界面设计都使用Designer,创建的项目要求勾选“创建界面文件”。

4. 基本组件(掌握)

4.1 QWidget

    QWidget是所有组件的基类,因此其属性被所有组件继承,在Designer中这些属性显示为淡黄色,常用属性如下:

4.2 QLabel 标签

QLabel用于显示文字或图片,此组件仅用于显示,不能交互。

常用属性如下:

Qt项目中正规使用图片的方式需要先把图片资源导入到项目中,然后再使用图片资源,不可直接使用图片文件,操作步骤如下:

1. 准备好图片文件,要求格式:png(包含透明图层)、jpg(不包含透明图层)、webp(在部分Qt版本支持)等。明明合法(英文数字组合),分辨率和文件大小不要过高。

2. 把图片文档放置到工作目录中。

3. 在Qt Creator中,选中项目名称,鼠标右键,点击“添加新文件”。

    4. 在弹出的窗口中,按照下图所示进行操作。Qt Resource File表示资源管理文件,格式.qrc,用于管理导入到项目中的资源文件。

5. 在弹出的窗口中填写qrc资源管理文件的名称,例如res

6. 项目管理界面,直接点击完成。

7. 如果需要回到资源管理文件首页,如下图所示进行操作。

8. 第一次给资源管理文件导入资源之前,需要先添加前缀,可以把前缀理解为是一个虚拟的路径。

9. 点击添加文件,可以把对应图片文件添加到当前前缀下。

10. 如果在C++代码中使用此图片,需要复制资源路径。

11. 如果在Designer中使用,需要先重新构建一次项目,点击可以构建但不运行项目。随后可以在Designer中配置资源图片的使用。

    通过C++代码对图片进行缩放的效果比Designer好一些,但是仍然建议使用专门的P图软件提前处理好。

相关函数如下:

// QPixmap的构造函数
// 参数为文件名称,即“虚拟路径”
QPixmap::​QPixmap(const QString & fileName)

// 缩放拉伸图片
// 参数1:目标宽度
// 参数2:目标高度
// 参数3:拉伸模式,三个枚举值
// 参数4:转换模式,两个枚举值,分别表示速度优先和质量优先
// 返回值:转换后的图片对象
QPixmap QPixmap::​scaled(
int width, 
int height, 
Qt::AspectRatioMode aspectRatioMode = Qt::IgnoreAspectRatio, Qt::TransformationMode transformMode = Qt::FastTransformation) const

QLabel也支持gif动图显示,需要配合QMovie类型播放动图,相关函数如下:

// 构造函数
// 参数1:文件名称,即“虚拟路径”
// 参数3是parent,因此用堆内存
QMovie::​QMovie(const QString & fileName)
// 开始播放
void QMovie::​start()                [slot]

以上练习的源代码:

通过网盘分享的文件:Day2_24072_QLabel (2).zip

链接: https://pan.baidu.com/s/1G16UlAj03skrUNsMnJviQw 提取码: gjee

--来自百度网盘超级会员v7的分享

4.3 QAbstractButton 按钮类

QAbstractButton是按钮的抽象基类,包含四种常见的派生类:

需要注意的是,QRadioButton需要分组互斥,使用QGroupBox组件进行分组。

按钮类常用属性如下:

图标是一种特殊的图片,具有以下性质:

  • 分辨率1:1
  • 包含透明图层
  • 格式通常为png和ico

可以通过专门的图标下载网站进行学习交流:

iconfont-阿里巴巴矢量图标库iconfont-国内功能很强大且图标内容很丰富的矢量图标库,提供矢量图标下载、在线存储、格式转换等功能。阿里巴巴体验团队倾力打造,设计和前端开发的便捷工具icon-default.png?t=O83Ahttps://www.iconfont.cn/

按钮类常用信号如下:

     如果按钮比较多需要很多信号槽的连接,除了可以使用多对一的连接方式以外,还可以使用QButtonGroup对按钮进行分组,可以针对一个组设置信号槽。QButtonGroup不继承QWidget,直接继承QObject,因此没有任何显示效果,只是一种逻辑分组。

相关函数如下:

// 构造函数
QButtonGroup::​QButtonGroup(QObject * parent = 0)
// 向组中添加按钮并编号
// 参数1:按钮对象
// 参数2:按钮编号,建议非重复正数
void QButtonGroup::​addButton(QAbstractButton * button, int id = -1)

信号函数如下:

    信号函数分为四组,对应的触发效果就是之前QAbstractButton信号的四种效果,区别每组重载函数的参数不同。QAbstractButton*表示当前组中触发的组件地址,int表示当前组中触发的组件编号。

需要注意的是,QButtonGroup默认会让按钮互斥,因此需要更改exclusive : bool属性值为false。

通过网盘分享的文件:Day3_24072_QButton.zip

链接: https://pan.baidu.com/s/1iPBs-PsaZg5bLJvkiCOCqw 提取码: h8e6

--来自百度网盘超级会员v7的分享

4.4 QLineEdit 单行文本输入框

    QLineEdit可以让用户输入一个单行文本,常用属性如下:

信号函数如下:

通过网盘分享的文件:Day3_24072_QLineEdit.zip

链接: https://pan.baidu.com/s/1aGU3CMl6q1jjnFeujMzJLQ 提取码: a2a4

--来自百度网盘超级会员v7的分享

4.5 QComboBox 组合框

QComboBox可以点击出现一个下拉菜单,用户选择其中的一个选项(Item)。

常用属性如下:

信号函数如下:

通过网盘分享的文件:Day3_24072_QComboBox.zip

链接: https://pan.baidu.com/s/1T-hYrHTyXkCcd6FR6rtmZg 提取码: 5d7f

--来自百度网盘超级会员v7的分享

4.6 一组与数字相关的组件

以上组件共同的属性包括:

  • value : int

当前数值

  • maximum : int

最大值,以上组件中只有QProgressBar默认最大值为100,其他组件为99。

  • minimum : int

最小值,默认值为0。

以上组件共有的信号函数:

// 参数为新的value值
void valueChanged(int value)                 [signal]

一个属性值发生变化时发射的信号在属性文档中会出现在部分。

通过网盘分享的文件:Day3_24072_Value.zip

链接: https://pan.baidu.com/s/1I3n1cPLorXmCQsyIcVXnPA 提取码: vnkg

--来自百度网盘超级会员v7的分享

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/60570.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

数据结构的时间复杂度和空间复杂度

目录 时间复杂度 空间复杂度 时间复杂度 基本操作的执行次数&#xff0c;为时间复杂度。 我们使用大O的渐进表示法来表示时间复杂度。 怎么使用&#xff1f; 先看例子&#xff1a; 在这个例子中&#xff0c; 基本操作为变量 count 的 加加 操作&#xff0c;并且&#xff0c;执行…

【Chapter 3】Machine Learning Classification Case_Prediction of diabetes-XGBoost

文章目录 1、XGBoost Algorithm2、Comparison of algorithm implementation between Python code and Sentosa_DSML community edition(1) Data reading and statistical analysis(2)Data preprocessing(3)Model Training and Evaluation(4)Model visualization 3、summarize 1…

Rust Struct 属性初始化

结构体是用户定义的数据类型&#xff0c;其中包含定义特定实例的字段。结构有助于实现更容易理解的抽象概念。本文介绍几种初始化结构体对象的方法&#xff0c;包括常规方法、Default特征、第三方包实现以及构建器模式。 Struct声明与初始化 struct Employee {id: i32,name: …

AI大模型微调:Qwen2大模型微调入门实战(完整代码)

简介&#xff1a; 该教程介绍了如何使用Qwen2&#xff0c;一个由阿里云通义实验室研发的开源大语言模型&#xff0c;进行指令微调以实现文本分类。微调是通过在&#xff08;指令&#xff0c;输出&#xff09;数据集上训练来改善LLMs理解人类指令的能力。教程中&#xff0c;使用…

基于Python+Django+Vue3+MySQL实现的前后端分类的商场车辆管理系统

项目名称&#xff1a;基于PythonDjangoVue3MySQL实现的前后端分离商场车辆管理系统 技术栈 开发工具&#xff1a;PyCharm、Visual Studio Code (VSCode)运行环境&#xff1a;Python 3.10、MySQL 8.0、Node.js 18技术框架&#xff1a;Django 5、Vue 3.4、Ant-Design-Vue 4.12 …

C++初阶:类和对象(上)

1. 类的定义 1.1 类的定义格式 class为定义类的关键字&#xff0c;Stack为类的名字&#xff0c;{ } 中为类的主体&#xff0c;注意类定义结束后的分号不能省略。类体中的内容为类的成员&#xff1a;类中的变量称为类的属性或成员变量&#xff1b;类中的函数称为类的方法或成员…

ctfshow DSBCTF web部分wp

ctfshow 单身杯 web部分wp web 签到好玩的PHP 源码&#xff1a; <?php error_reporting(0); highlight_file(__FILE__);class ctfshow {private $d ;private $s ;private $b ;private $ctf ;public function __destruct() {$this->d (string)$this->d;$this…

【分布式】万字图文解析——深入七大分布式事务解决方案

分布式事务 分布式事务是指跨多个独立服务或系统的事务管理&#xff0c;以确保这些服务中的数据变更要么全部成功&#xff0c;要么全部回滚&#xff0c;从而保证数据的一致性。在微服务架构和分布式系统中&#xff0c;由于业务逻辑往往会跨多个服务&#xff0c;传统的单体事务…

边缘计算在智能物流中的应用

&#x1f493; 博客主页&#xff1a;瑕疵的CSDN主页 &#x1f4dd; Gitee主页&#xff1a;瑕疵的gitee主页 ⏩ 文章专栏&#xff1a;《热点资讯》 边缘计算在智能物流中的应用 边缘计算在智能物流中的应用 边缘计算在智能物流中的应用 引言 边缘计算概述 定义与原理 发展历程 …

Spring Boot框架:电商开发的新趋势

5 系统实现 系统实现部分就是将系统分析&#xff0c;系统设计部分的内容通过编码进行功能实现&#xff0c;以一个实际应用系统的形式展示系统分析与系统设计的结果。前面提到的系统分析&#xff0c;系统设计最主要还是进行功能&#xff0c;系统操作逻辑的设计&#xff0c;也包括…

本地源配置 以及ssh 和 nfs

安装软件的三种方式 apt 仓库 在/etc/apt/sources.list文件下 在线源 离线包 修改离线包 挂载并更新 ssh远程管理 sshd的配置文件 服务器命令行的远程登录方式 远程复制 先在第一台主机上创建文件 使用scp命令复制 sftp ssh的密钥登录 创建rsa密钥 将密钥文件传给另一台主机…

JavaWeb:文件上传1

欢迎来到“雪碧聊技术”CSDN博客&#xff01; 在这里&#xff0c;您将踏入一个专注于Java开发技术的知识殿堂。无论您是Java编程的初学者&#xff0c;还是具有一定经验的开发者&#xff0c;相信我的博客都能为您提供宝贵的学习资源和实用技巧。作为您的技术向导&#xff0c;我将…

【MMIN】缺失模态想象网络用于不确定缺失模态的情绪识别

代码地址&#xff1a;https://github.com/AIM3RUC/MMIN abstract&#xff1a; 在以往的研究中&#xff0c;多模态融合已被证明可以提高情绪识别的性能。然而&#xff0c;在实际应用中&#xff0c;我们经常会遇到模态丢失的问题&#xff0c;而哪些模态会丢失是不确定的。这使得…

图像处理实验四(Adaptive Filter)

一、Adaptive Filter简介 自适应滤波器&#xff08;Adaptive Filter&#xff09;是一种能够根据输入信号的统计特性自动调整自身参数以达到最佳滤波效果的滤波器。它广泛应用于信号处理领域&#xff0c;如信道均衡、系统识别、声学回波抵消、生物医学、雷达、波束形成等模块。 …

深入理解AIGC背后的核心算法:GAN、Transformer与Diffusion Models

深入理解AIGC背后的核心算法&#xff1a;GAN、Transformer与Diffusion Models 前言 随着人工智能技术的发展&#xff0c;AIGC&#xff08;AI Generated Content&#xff0c;人工智能生成内容&#xff09;已经不再是科幻电影中的幻想&#xff0c;而成为了现实生活中的一种新兴力…

【STM32】基于SPI协议读写SD,详解!

文章目录 0 前言1 SD卡的种类和简介1.1 SD卡的种类1.2 SD卡的整体结构1.3 SD卡运行机制——指令和响应2 SD卡的通信总线2.1 SDIO2.2 SPI3 硬件连接4 代码实践【重点】4.1 HAL库移植4.2 标准库移植4.3 遇到的问题和解决方案5 扩展阅读0 前言 因为项目需要,使用stm32读写sd卡,这…

Three.js 纹理贴图

1. 纹理贴图 在Three.js中&#xff0c;纹理贴图是一种将二维图像贴到三维物体表面的技术&#xff0c;以增强物体的视觉表现。纹理贴图可以使物体表面更加真实、细腻&#xff0c;为场景增色不少。 在Three.js中&#xff0c;纹理贴图的加载主要通过THREE.TextureLoader类实现。…

ArcGIS Pro属性表乱码与字段名3个汉字解决方案大总结

01 背景 我们之前在使用ArcGIS出现导出Excel中文乱码及shp添加字段3个字被截断的情况&#xff0c;我们有以下应对策略&#xff1a; 推荐阅读&#xff1a;ArcGIS导出Excel中文乱码及shp添加字段3个字被截断&#xff1f; 那如果我们使用ArGIS Pro出现上述问题&#xff0c;该如何…

图论-代码随想录刷题记录[JAVA]

文章目录 前言Floyd 算法dijkstra&#xff08;朴素版&#xff09; 前言 新手小白记录第一次刷代码随想录 1.自用 抽取精简的解题思路 方便复盘 2.代码尽量多加注释 3.记录踩坑 4.边刷边记录&#xff0c;更有成就感&#xff01; 5.解题思路绝大部分来自代码随想录 Floyd 算法 【…

anzocapital 昂首资本:外汇机器人趋势判断秘籍

再盲目交易而不借助像 anzocapital 昂首资本所了解的外汇机器人趋势判断方法&#xff0c;投资者在外汇市场将面临亏损的风险&#xff0c;anzocapital 昂首资本深知交易策略的重要性&#xff0c;就像外汇机器人确定趋势方向的方法&#xff0c;对投资者有着非凡的意义。 在外汇交…