【Qt学习】05：自定义封装界面类

news2024/9/24 17:10:56

OVERVIEW

  • 自定义封装界面类
      • 1.QListWidget
      • 2.QTreeWidget
      • 3.QTableWidget
      • 4.StackedWidget
      • 5.Others
      • 6.自定义封装界面类-显示效果
        • （1）添加设计师界面类
        • （2）在ui中设计自定义界面
        • （3）在需要使用的界面中添加
        • （4）提升为自定义控件的类
        • （5）测试显示效果
      • 7.自义封装界面类-功能实现
        • （1）具体需要的功能分析
        • （2）功能1实现
          • sliderbar.cpp
        • （3）功能2实现
          • sliderbar.cpp
        • （4）对外预留接口
          • sliderbar.h
          • sliderbar.cpp

自定义封装界面类

1.QListWidget

//1.QListWidget
//方式1
QListWidgetItem *item1 = new QListWidgetItem("this is the first line.");
item1->setTextAlignment(Qt::AlignHCenter);
ui->listWidget->addItem(item1);
QListWidgetItem *item2 = new QListWidgetItem("this is the second line.");
item2->setTextAlignment(Qt::AlignHCenter);
ui->listWidget->addItem(item2);
QListWidgetItem *item3 = new QListWidgetItem("this is the third line.");
item3->setTextAlignment(Qt::AlignHCenter);
ui->listWidget->addItem(item3);
//方式2 list<string>
QStringList list;
for (int i = 0; i < 4; ++i) {
    QString str;
    str.sprintf("this is the %dth sentence.", i);
    list << str;
}
ui->listWidget->addItems(list);

2.QTreeWidget

//2.QTreeWidget
//header 设置表头
ui->treeWidget->setHeaderLabels(QStringList() << "英雄" << "英雄介绍");
//root 设置根节点
QTreeWidgetItem *titem1 = new QTreeWidgetItem(QStringList() << "力量");
QTreeWidgetItem *titem2 = new QTreeWidgetItem(QStringList() << "敏捷");
QTreeWidgetItem *titem3 = new QTreeWidgetItem(QStringList() << "智力");
ui->treeWidget->addTopLevelItem(titem1);
ui->treeWidget->addTopLevelItem(titem2);
ui->treeWidget->addTopLevelItem(titem3);
//leaf 设置叶子节点
QStringList tlist;
tlist << "刚被猪" << "前排坦克 能在吸收伤害的同时可观的范围输出";
QTreeWidgetItem *titem1_1 = new QTreeWidgetItem(tlist);
tlist.clear();
tlist << "船长" << "前排坦克 能肉能输出能控场的全能英雄";
QTreeWidgetItem *titem1_2 = new QTreeWidgetItem(tlist);
tlist.clear();

tlist << "月骑" << "中排物理输出 可以使用分裂利刃攻击多个目标";
QTreeWidgetItem *titem2_1 = new QTreeWidgetItem(tlist);
tlist.clear();
tlist << "小鱼人" << "前排战士 擅长偷取敌人属性来增强自身战斗力";
QTreeWidgetItem *titem2_2 = new QTreeWidgetItem(tlist);
tlist.clear();

tlist << "死灵法师" << "前排法师坦克 魔法抗性较高 拥有治疗技能";
QTreeWidgetItem *titem3_1 = new QTreeWidgetItem(tlist);
tlist.clear();
tlist << "巫医" << "后排辅助法师 可以使用奇特的巫术诅咒敌人与治疗队友";
QTreeWidgetItem *titem3_2 = new QTreeWidgetItem(tlist);
tlist.clear();

titem1->addChild(titem1_1);
titem1->addChild(titem1_2);
titem2->addChild(titem2_1);
titem2->addChild(titem2_2);
titem3->addChild(titem3_1);
titem3->addChild(titem3_2);

3.QTableWidget

//3.QTableWidget
int col = 3;
int row = 5;
//设置列的数目
ui->tableWidget->setColumnCount(col);
//设置水平表头
ui->tableWidget->setHorizontalHeaderLabels(QStringList() << "name" << "gentle" << "age");
//设置行的数目
ui->tableWidget->setRowCount(row);
//设置正文
//ui->tableWidget->setItem(0, 0, new QTableWidgetItem("tom"));
//ui->tableWidget->setItem(0, 1, new QTableWidgetItem("male"));
//ui->tableWidget->setItem(0, 2, new QTableWidgetItem("18"));
QStringList nameList, gentleList;
nameList << "tom" << "jack" << "lucy" << "lily" << "bob";
gentleList << "male" << "male" << "female" << "female" << "male";
for (int i = 0; i < row; ++i) {
    int idx = 0;
    ui->tableWidget->setItem(i, idx++, new QTableWidgetItem(nameList[i]));
    ui->tableWidget->setItem(i, idx++, new QTableWidgetItem(gentleList.at(i)));
    ui->tableWidget->setItem(i, idx++, new QTableWidgetItem(QString::number(i + 18)));
}

4.StackedWidget

//4.StackedWidget
    ui->stackedWidget->setCurrentIndex(0);
    connect(ui->btn_scrollbtns, &QPushButton::clicked, this, [=](){
        ui->stackedWidget->setCurrentIndex(2);
    });
    connect(ui->btn_brosers, &QPushButton::clicked, this, [=](){
        ui->stackedWidget->setCurrentIndex(1);
    });
    connect(ui->btn_groups, &QPushButton::clicked, this, [=](){
        ui->stackedWidget->setCurrentIndex(0);
    });
}

5.Others

//combo box
ui->comboBox->addItem("奔驰");
ui->comboBox->addItem("宝马");
ui->comboBox->addItem("保时捷");
connect(ui->btn_autoselect, &QPushButton::clicked, this, [=](){
    ui->comboBox->setCurrentIndex(2);
    //ui->comboBox->setCurrentText("保时捷");
});
//QLabel1
ui->label_img->setPixmap(QPixmap(":/res/img/backgroud.jpg"));
ui->label_img->setScaledContents(true);
//QLabel2
QMovie *gif = new QMovie(":/res/img/xiongmaoren.gif");
ui->label_img_2->setMovie(gif);
gif->start();

6.自定义封装界面类-显示效果

创建自定义封装界面类步骤一般如下，

（1）添加设计师界面类

添加新文件，Qt->设计师界面类，

在这里插入图片描述

根据需要选择界面模板即可，这里选择Widget作为界面模板进行创建，

在这里插入图片描述

根据语义为自定义的界面类确定类名，

在这里插入图片描述

选择好会后qtcreator会自动的添加 .h、 .cpp、.ui 文件，并可以在新建的 .ui 文件中设计自定义的控件，

（2）在ui中设计自定义界面

在ui界面中设计好自定义控件的界面，如下所示：

在这里插入图片描述

（3）在需要使用的界面中添加

在需要使用的界面中添加，自定义控件类的父类作为占位控件，详细操作如下：

首先观察到自定义的界面类属于QWidget类型，

在这里插入图片描述

开始向需要使用到自定义控件界面类的ui文件中，添加一个自定义控件的父类（这里添加的为Widget控件/QWidget类），如下图所示：

在这里插入图片描述

（4）提升为自定义控件的类

在ui界面中右键wedget控件，将其提升为自定义控件的类SliderBar，

在这里插入图片描述

在 “提升的窗口部件” 窗口中填写提升的类名称（此处为SliderBar），并勾选上全局包含后（这样再次需要选择提升时就可以快速选择），点击右下角的添加按钮，

在这里插入图片描述

成功添加到提升的类列表中，如下所示：

在这里插入图片描述

点击列表中的SliderBar后并点击提升按钮，发现原来为QWidget的占位用的控件，已经被提升为了自定义控件类（SliderBar），

在这里插入图片描述

在这里插入图片描述

（5）测试显示效果

直接运行程序显示Mainwindows，在占位控件处已经显示出了自定义控件之前设计的样式，如下图所示：

在这里插入图片描述

7.自义封装界面类-功能实现

经过前面ui界面的设计与类的提升，自定义控件的显示已经完成，但是在滑动slider控件时并没有对应的数值出现变化，

为了实现相应的控件逻辑功能，下面还需要编写 .h 与 .cpp 文件内容进行功能上的自定义实现，步骤如下所示：

（1）具体需要的功能分析

SliderBar控件类需要实现的功能，分为两条逻辑，

  1. 功能1：相应的，在修改左侧spinBox的数值时，右侧的slider按钮要能够自己根据数值滑动起来，
  2. 功能2：在滑动slider按钮时，左侧spinBox的数字要能够对应上具体的数值，

（2）功能1实现

在修改spinBox数值时控件会发出一些信号，只要捕获到这些信号就能够实现，修改spinBox数值的同时右侧的slider能够自己滑动，

在QT的帮组手册中可以查询到关于QSpinBox数值修改时，发出的一些信号相关的signal：

在这里插入图片描述

可以发现，当SpinBox控件数值修改时会触发两个同名重载的信号函数，（这意味着在利用信号与槽机制实现对应的功能时，需要利用函数指针指向指定的函数）

//重载的两个信号函数
void valueChanged(const QString &text)
void valueChanged(int i)
sliderbar.cpp

修改 sliderbar.cpp 中的代码，实现当spinBox数值被修改时，slider可以自动移动的功能，根据QSlider控件的槽函数修改其value值：

#include "sliderbar.h"
#include "ui_sliderbar.h"

SliderBar::SliderBar(QWidget *parent):QWidget(parent), ui(new Ui::SliderBar) {
    ui->setupUi(this);
    //QSpinBox数值修改 QSlider自动滑动
    void(QSpinBox::*funcptr)(int) = &QSpinBox::valueChanged;
    connect(ui->spinBox, funcptr, ui->horizontalSlider, &QSlider::setValue);
}

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

（3）功能2实现

在滑动slider按钮时，slider控件会发出一些信号，只要捕获到这些信号就能够实现，在滑动slider的同时修改左侧spinBox中的数值，

在QT的帮组手册中可以查询到关于QSlider滑动时，发出的一些信号相关的signal：

在这里插入图片描述

可以发现，当Slider控件被滑动时会触发信号函数，

//信号函数
void valueChanged(int value)
sliderbar.cpp

同样修改 sliderbar.cpp 中的代码，实现当slider移动时spinBox数值可以自动修改的功能，根据QSpinBox控件的槽函数修改其value值：

#include "sliderbar.h"
#include "ui_sliderbar.h"

SliderBar::SliderBar(QWidget *parent):QWidget(parent), ui(new Ui::SliderBar) {
    ui->setupUi(this);
    //QSpinBox数值修改 QSlider自动滑动
    void(QSpinBox::*funcptr)(int) = &QSpinBox::valueChanged;
    connect(ui->spinBox, funcptr, ui->horizontalSlider, &QSlider::setValue);
    //QSlider滑动 QSpinBox数值跟着改变
    connect(ui->horizontalSlider, &QSlider::valueChanged, ui->spinBox, &QSpinBox::setValue);
}

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

到此自定义控件的全部功能就实现完毕了，

（4）对外预留接口

对外预留接口为可能需要提供的功能留下余地，setValue、getValue函数，

sliderbar.h
#ifndef SLIDERBAR_H
#define SLIDERBAR_H

#include <QWidget>

namespace Ui {
class SliderBar;
}

class SliderBar : public QWidget
    Q_OBJECT
public:
    explicit SliderBar(QWidget *parent = nullptr);
    ~SliderBar();
    void setValue(int value);
    int getValue();
private:
    Ui::SliderBar *ui;
};

#endif // SLIDERBAR_H
sliderbar.cpp
#include "sliderbar.h"
#include "ui_sliderbar.h"

SliderBar::SliderBar(QWidget *parent):QWidget(parent), ui(new Ui::SliderBar) {
    ui->setupUi(this);
    //QSpinBox数值修改 QSlider自动滑动
    void(QSpinBox::*funcptr)(int) = &QSpinBox::valueChanged;
    connect(ui->spinBox, funcptr, ui->horizontalSlider, &QSlider::setValue);
    //QSlider滑动 QSpinBox数值跟着改变
    connect(ui->horizontalSlider, &QSlider::valueChanged, ui->spinBox, &QSpinBox::setValue);
}

void SliderBar::setValue(int value) { ui->spinBox->setValue(value); }

int SliderBar::getValue() { return ui->spinBox->value(); }

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

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

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

ModaHub魔搭社区：经营大脑经营沙盘

ModaHub魔搭社区：经营大脑经营沙盘

目录 WinPlan经营大脑经营沙盘介绍 WinPlan经营大脑经营沙盘展示 WinPlan经营大脑经营沙盘设计器 WinPlan经营大脑经营沙盘介绍 经营沙盘是面向企业管理层，展示企业经营状况。可基于不同场景创建不同沙盘，用于分析不同的数据，包括销售数据、财务数据等。 企业经营决策系…
阅读更多...
吉客云与金蝶云星空对接集成分页查询出库单打通分布式调出单新增

吉客云与金蝶云星空对接集成分页查询出库单打通分布式调出单新增

吉客云与金蝶云星空对接集成分页查询出库单打通分布式调出单新增 接通系统&#xff1a;吉客云 “吉客云”是一站式企业数字化解决方案系统&#xff0c;可实现业务、财务、办公、人事等一体化管理。相对于传统多套软件系统的集成方案&#xff0c;“吉客云”具有业务流程更流畅&a…
阅读更多...
《Python基础教程》专栏总结篇

《Python基础教程》专栏总结篇

大家好&#xff0c;我是爱编程的喵喵。双985硕士毕业&#xff0c;现担任全栈工程师一职&#xff0c;热衷于将数据思维应用到工作与生活中。从事机器学习以及相关的前后端开发工作。曾在阿里云、科大讯飞、CCF等比赛获得多次Top名次。现为CSDN博客专家、人工智能领域优质创作者。…
阅读更多...
ctfshow web入门 php特性 web108-web112

ctfshow web入门 php特性 web108-web112

1.web108 strrev() 反转字符串 <?php echo strrev("Hello world!"); // 输出 "!dlrow olleH" ?> ereg 存在空字符截断(只会匹配%00前面的字符)&#xff0c;这个函数匹配到为true&#xff0c;没有匹配到为false,877为0x36d的十进制数值 payload: …
阅读更多...
【微服务】06-安全问题

【微服务】06-安全问题

文章目录 1.反跨站请求伪造1.1 攻击过程1.2 攻击核心1.3 如何防御1.4 使用AntiforgeryToken机制来防御用到的类 2. 防开发重定向共计2.1 攻击过程2.2 攻击核心2.3 防范措施 3.防跨站脚本3.1 攻击过程3.2 防范措施 4.跨域请求4.1 同源与跨域4.2 CORS过程4.2 CORS是什么4.3 CORS请…
阅读更多...
解决问题的步骤

解决问题的步骤

得到曲铠的课程学习。 个人感觉前面几节如明确和理解问题&#xff0c;拆分问题&#xff0c;挺好的。 后面就是水分很大&#xff0c;感觉有点烂尾了。 拆分和定期问题&#xff0c;这个指导意义还是很大的。 本质上思路还是有很多学习的地方&#xff0c;更加明确了&#xff0…
阅读更多...
nodejs+vue+elementui健身房教练预约管理系统nt5mp

nodejs+vue+elementui健身房教练预约管理系统nt5mp

运用新技术&#xff0c;构建了以vue.js为基础的私人健身和教练预约管理信息化管理体系。根据需求分析结果进行了系统的设计&#xff0c;并将其划分为管理员&#xff0c;教练和用户三种角色&#xff1a;主要功能包括首页&#xff0c;个人中心&#xff0c;用户管理&#xff0c;教…
阅读更多...
Tomcat和Servlet基础知识的讲解（JavaEE初阶系列16）

Tomcat和Servlet基础知识的讲解（JavaEE初阶系列16）

目录 前言&#xff1a; 1.Tomcat 1.1Tomcat是什么 1.2下载安装 2.Servlet 2.1什么是Servlet 2.2使用Servlet来编写一个“hello world” 1.2.1创建项目&#xff08;Maven&#xff09; 1.2.2引入依赖&#xff08;Servlet&#xff09; 1.2.3创建目录&#xff08;webapp&a…
阅读更多...
java-线程之间共享数据

java-线程之间共享数据

1. 如何在两个线程之间共享数据 Java 里面进行多线程通信的主要方式就是共享内存的方式&#xff0c;共享内存主要的关注点有两个&#xff1a;可见性和有序性原子性。Java 内存模型&#xff08;JMM&#xff09;解决了可见性和有序性的问题&#xff0c;而锁解决了原子性的问题&a…
阅读更多...
人脸识别平台批量导入绑定设备的一种方法

人脸识别平台批量导入绑定设备的一种方法

因为原先平台绑定设备是通过一个界面进行人工选择绑定或一个人一个人绑定设备。如下&#xff1a; 但有时候需要在几千个里选择出几百个&#xff0c;那这种方式就不大现实了&#xff0c;需要另外一种方法。 目前相到可以通过导入批量数据进行绑定的方式。 一、前端 主要是显示…
阅读更多...
性能测试报告-用于项目的性能验证、性能调优、发现性能缺陷等应用场景

性能测试报告-用于项目的性能验证、性能调优、发现性能缺陷等应用场景

性能测试报告 性能测试报告是一种重要的报告类型&#xff0c;旨在评估软件系统的性能、稳定性和安全性。在这篇文章中&#xff0c;我们将详细介绍性能测试报告的应用场景、测试方法和性能指标&#xff0c;以及如何撰写一份有效的性能测试报告。 一、概述 性能测试报告的目的是…
阅读更多...
贪吃蛇是怎么实现的，循环数组的魔力

贪吃蛇是怎么实现的，循环数组的魔力

贪吃蛇是怎么实现的&#xff0c;比如有5个结点的蛇&#xff0c;1,2,3,4,5&#xff0c;1是头&#xff0c;5是尾&#xff0c;结点的坐标用(x,y)表示&#xff0c;蛇要移动x,y怎么变化&#xff1f;没有转向的时候好理解&#xff0c;如果是在水平方向直着走,所有结点的横坐标x1&…
阅读更多...
stm32之9.中断优先级配置

stm32之9.中断优先级配置

主函数main.c #include <stm32f4xx.h> #include "led.h" #include "key.h"#define PAin(n) (*(volatile uint32_t *)(0x42000000 (GPIOA_BASE0x10-0x40000000)*32 (n)*4)) #define PEin(n) (*(volatile uint32_t *)(0x42000000 (GP…
阅读更多...
Spring Cloud Alibaba-Sentinel-Sentinel入门

Spring Cloud Alibaba-Sentinel-Sentinel入门

1 什么是Sentinel Sentinel (分布式系统的流量防卫兵) 是阿里开源的一套用于服务容错的综合性解决方案。它以流量为切入点, 从流量控制、熔断降级、系统负载保护等多个维度来保护服务的稳定性。Sentinel 具有以下特征: 丰富的应用场景&#xff1a;Sentinel 承接了阿里…
阅读更多...
开始MySQL之路——MySQL约束概述详解

开始MySQL之路——MySQL约束概述详解

MySQL约束 create table [if not exists] 表名(字段名1 类型[(宽度)] [约束条件] [comment 字段说明],字段名2 类型[(宽度)] [约束条件] [comment 字段说明],字段名3 类型[(宽度)] [约束条件] [comment 字段说明] )[表的一些设置]; 概念 约束英文&#xff1a;constraint 约束实…
阅读更多...
【详解】文本检测OCR模型的评价指标

【详解】文本检测OCR模型的评价指标

关于文本检测OCR模型的评价指标 前言&#xff1a;网上关于评价标准乱七八糟的&#xff0c;有关于单词的&#xff0c;有关于段落的&#xff0c;似乎没见过谁解释一下常见论文中常用的评价指标具体是怎么计算的&#xff0c;比如DBNet&#xff0c;比如RCNN&#xff0c;这似乎好像…
阅读更多...
6种限流实现，附代码！[通俗易懂]

6种限流实现，附代码！[通俗易懂]

作者 | 磊哥 来源 | Java中文社群&#xff08;ID&#xff1a;javacn666&#xff09; 转载请联系授权&#xff08;微信ID&#xff1a;GG_Stone 限流是一种控制访问速率的策略&#xff0c;用于限制系统、服务或API接口的请求频率或数量。它的目的是为了保护系统免受过多请求的影响…
阅读更多...
人体行走电压测试仪的特点

人体行走电压测试仪的特点

人体行走电压测试仪是一种用于测量人体行走时身体所受到的电压的设备。当人体行走时&#xff0c;我们身体与地面之间会形成电位差&#xff0c;这个电位差通常是很小的&#xff0c;但可能会对人体产生影响。通过使用行走电压测试仪&#xff0c;可以精确地测量这种电位差的大小。…
阅读更多...
Leetcode-每日一题【剑指 Offer 36. 二叉搜索树与双向链表】

Leetcode-每日一题【剑指 Offer 36. 二叉搜索树与双向链表】

题目 输入一棵二叉搜索树&#xff0c;将该二叉搜索树转换成一个排序的循环双向链表。要求不能创建任何新的节点&#xff0c;只能调整树中节点指针的指向。 为了让您更好地理解问题&#xff0c;以下面的二叉搜索树为例&#xff1a; 我们希望将这个二叉搜索树转化为双向循环链表…
阅读更多...
(mybatis与spring集合

(mybatis与spring集合

mybatis与spring集合 一、Spring集成MyBatis1.1. pom依赖1.2. 配置文件1.3. Spring整合MyBatis1.3.1. 配置自动扫描JavaBean1.3.2. 配置数据源1.3.3. 配置session工厂1.3.4. 配置mapper扫描接口1.3.5. 配置事务管理器1.3.6. 配置AOP自动代理1.4. 测试 二、Spring集成PageHelper…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023