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

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;
}

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

如若内容造成侵权/违法违规/事实不符，请联系我们进行投诉反馈qq邮箱809451989@qq.com，一经查实，立即删除！

相关文章

Docker搭建个人网盘、私有仓库

Docker搭建个人网盘、私有仓库

1、使用mysql:5.6和 owncloud 镜像&#xff0c;构建一个个人网盘 [rootlocalhost ~]# docker pull mysql:5.6 [rootlocalhost ~]# docker pull owncloud [rootlocalhost ~]# docker run -itd --name mysql --env MYSQL_ROOT_PASSWORD123456 mysql:5.6 [rootlocalhost ~]#…
阅读更多...
Python语言实现React框架

Python语言实现React框架

迷途小书童的 Note 读完需要 6分钟 速读仅需 2 分钟 1 reactpy 介绍 reactpy 是一个用 Python 语言实现的 ReactJS 框架。它可以让我们使用 Python 的方式来编写 React 的组件&#xff0c;构建用户界面。 reactpy 的目标是想要将 React 的优秀特性带入 Python 领域&#xff0c;…
阅读更多...
(动态规划) 剑指 Offer 48. 最长不含重复字符的子字符串 ——【Leetcode每日一题】

(动态规划) 剑指 Offer 48. 最长不含重复字符的子字符串 ——【Leetcode每日一题】

❓剑指 Offer 48. 最长不含重复字符的子字符串 难度&#xff1a;中等 请从字符串中找出一个最长的不包含重复字符的子字符串&#xff0c;计算该最长子字符串的长度。 示例 1: 输入: “abcabcbb” 输出: 3 解释: 因为无重复字符的最长子串是 “abc”&#xff0c;所以其长度为…
阅读更多...
macbookpro如何清理系统数据 macbookpro怎么删除软件

macbookpro如何清理系统数据 macbookpro怎么删除软件

Macbook Pro是苹果公司的一款高性能笔记本电脑&#xff0c;它拥有强大的硬件和流畅的操作系统。然而&#xff0c;随着时间的推移&#xff0c;你可能会发现你的Macbook Pro变得越来越慢&#xff0c;储存空间也越来越紧张。这时候&#xff0c;你需要对你的Macbook Pro进行一些清理…
阅读更多...
Linux驱动之platform设备驱动

Linux驱动之platform设备驱动

目录 前言 一、Linux驱动的分离与分层 二、开发环境 三、驱动程序编写 3.2 platform 驱动模块程序 3.3 测试app程序 四、运行测试 4.1 编译 4.2 运行测试 前言 前面几章编写的设备驱动都非常的简单&#xff0c;都是对 IO进行最简单的读写操作。像 I2C、SPI、 LCD 等这…
阅读更多...
Ansible 创建使用角色

Ansible 创建使用角色

使用 Ansible Galaxy 和要求文件 /ansible/roles/requirements.yml 。从以下 URL 下载角色并安装到 /ansible/roles &#xff1a; http://materials/haproxy.tar 此角色的名称应当为 balancer http://materials/phpinfo.tar 此角色的名称应当为 phpinfo #创建 vim /ansible/r…
阅读更多...
leetcode3. 无重复字符的最长子串（滑动窗口 - java)

leetcode3. 无重复字符的最长子串（滑动窗口 - java)

滑动窗口 无重复字符的最长子串滑动窗口 上期经典 无重复字符的最长子串 难度 - 中等 3. 无重复字符的最长子串 给定一个字符串 s &#xff0c;请你找出其中不含有重复字符的 最长子串 的长度。 示例 1: 输入: s “abcabcbb” 输出: 3 解释: 因为无重复字符的最长子串是 “abc…
阅读更多...
MySQL详细安装与配置

MySQL详细安装与配置

免安装版的Mysql MySQL关是一种关系数据库管理系统&#xff0c;所使用的 SQL 语言是用于访问数据库的最常用的 标准化语言&#xff0c;其特点为体积小、速度快、总体拥有成本低&#xff0c;尤其是开放源码这一特点&#xff0c;在 Web 应用方面 MySQL 是最好的 RDBMS(Relation…
阅读更多...
postman访问ruoyi后台接口

postman访问ruoyi后台接口

打开若依页面&#xff0c;登录进去&#xff0c;F12打开控制台&#xff0c;选一个后台服务&#xff0c;把下图两个节点&#xff0c;补到postman请求header里面即可
阅读更多...
Day46|leetcode 139.单词拆分

Day46|leetcode 139.单词拆分

leetcode 139.单词拆分 题目链接&#xff1a;139. 单词拆分 - 力扣&#xff08;LeetCode&#xff09; 视频链接&#xff1a;动态规划之完全背包&#xff0c;你的背包如何装满&#xff1f;| LeetCode&#xff1a;139.单词拆分_哔哩哔哩_bilibili 题目概述 给你一个字符串 s 和一…
阅读更多...
关于ios Universal Links apple-app-site-association文件 Not Found的问题

关于ios Universal Links apple-app-site-association文件 Not Found的问题

1. 背景说明 1.1 Universal Links 是什么 Support Universal Links 里面有说到 Universal Links 是什么、注意点、以及如何配置的。简单来说就是 当您支持通用链接时&#xff0c;iOS 用户可以点击指向您网站的链接&#xff0c;并无缝重定向到您安装的应用程序 大白话就是说&am…
阅读更多...
【算法训练-链表】反转链表、区间反转链表、K个一组反转链表

【算法训练-链表】反转链表、区间反转链表、K个一组反转链表

从今天开始进行高频算法的训练&#xff0c;一方面训练自己的逻辑思维&#xff0c;一方面保持自己的竞争力。训练过程有这么两个基准原则&#xff1a; 首先训练题的来源呢有三个&#xff0c;首选的是三个都出现过的高频题&#xff0c;以&#xff1a;牛客101为基准分类&#xff…
阅读更多...
MAYA粒子基础_场

MAYA粒子基础_场

重力场 牛顿场 径向场 均匀场和重力场的区别 空气场 推动物体 阻力场 推动物体 涡流场 湍流场 体积轴场
阅读更多...
研磨设计模式day12命令模式

研磨设计模式day12命令模式

目录 定义 几个参数 场景描述 代码示例 参数化设置 命令模式的优点 本质 何时选用 定义 几个参数 Command&#xff1a;定义命令的接口。 ConcreteCommand:命令接口的实现对象。但不是真正实现&#xff0c;是通过接收者的功能来完成命令要执行的操作 Receiver&#x…
阅读更多...
kafka-python 消费者消费不到消息

kafka-python 消费者消费不到消息

排除步骤1&#xff1a; 使用group_id”consumer_group_id_001“ 和 auto_offset_reset"earliest" from kafka import KafkaConsumerconsumer KafkaConsumer(bootstrap_servers["dev-kafka01.test.xxx.cloud:9092"],enable_auto_commitTrue, auto_commit…
阅读更多...
计算机安全学习笔记(I)：访问控制安全原理

计算机安全学习笔记(I)：访问控制安全原理

访问控制原理 从广义上来讲&#xff0c;所有的计算机安全都与访问控制有关。 RFC 4949: Internet Security Glossary, Version 2 (rfc-editor.org) RFC 4949 定义的计算机安全&#xff1a;用来实现和保证计算机系统的安全服务的措施&#xff0c;特别是保证访问控制服务的措施…
阅读更多...
十几款拿来就能用的炫酷表白代码

十几款拿来就能用的炫酷表白代码

「作者主页」&#xff1a;士别三日wyx 「作者简介」&#xff1a;CSDN top100、阿里云博客专家、华为云享专家、网络安全领域优质创作者 「推荐专栏」&#xff1a;小白零基础《Python入门到精通》 表白代码 1、坐我女朋友好吗&#xff0c;不同意就关机.vbs2、坐我女朋友好吗&…
阅读更多...
使用 Transformer 和 Amazon OpenSearch Service 构建基于列的语义搜索引擎

使用 Transformer 和 Amazon OpenSearch Service 构建基于列的语义搜索引擎

在数据湖中&#xff0c;对于数据清理和注释、架构匹配、数据发现和跨多个数据来源进行分析等许多操作&#xff0c;查找相似的列有着重要的应用。如果不能从多个不同的来源准确查找和分析数据&#xff0c;就会严重拉低效率&#xff0c;不论是数据科学家、医学研究人员、学者&…
阅读更多...
C# 实现 国密SM4/ECB/PKCS7Padding对称加密解密

C# 实现 国密SM4/ECB/PKCS7Padding对称加密解密

C# 实现 国密SM4/ECB/PKCS7Padding对称加密解密&#xff0c;为了演示方便本问使用的是Visual Studio 2022 来构建代码的 1、新建项目&#xff0c;之后选择 项目 鼠标右键选择 管理NuGet程序包管理&#xff0c;输入 BouncyCastle 回车 添加BouncyCastle程序包 2、代码如下&am…
阅读更多...
npm和yarn的区别？

npm和yarn的区别？

文章目录 前言npm和yarn的作用和特点npm和yarn的安装的机制npm安装机制yarn安装机制检测包解析包获取包链接包构建包 总结后言 前言 这一期给大家讲解npm和yarn的一些区别 npm和yarn的作用和特点 包管理&#xff1a;npm 和 yarn 可以用于安装、更新和删除 JavaScript 包。它们提…
阅读更多...
最新文章

Copyright @ 2022~2023