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

Linux MQTT智能家居(温度,湿度,环境监测,摄像头等界面布局设置)

文章目录

  • 前言
  • 一、温度湿度曲线布局
  • 二、环境监测界面布局
  • 三、摄像头界面布局
  • 总结


前言

本篇文章来完成另外三个界面的布局设置。

这里会使用到 feiyangqingyun的一些控件库。

一、温度湿度曲线布局

TempHumtiy.h:

#ifndef TEMPHUMTIY_H
#define TEMPHUMTIY_H#include <QWidget>
#include "wavechart.h"namespace Ui {
class TempHumtiy;
}class TempHumtiy : public QWidget
{Q_OBJECTWaveChart* TempWave;//温度曲线WaveChart* HumityWave;//湿度曲线public:explicit TempHumtiy(QWidget *parent = nullptr);~TempHumtiy();private:Ui::TempHumtiy *ui;
};#endif // TEMPHUMTIY_H

TempHumtiy.cpp:

#include "TempHumtiy.h"
#include "ui_TempHumtiy.h"
#include <QVBoxLayout>TempHumtiy::TempHumtiy(QWidget *parent) :QWidget(parent),ui(new Ui::TempHumtiy)
{ui->setupUi(this);QVBoxLayout* vlaout = new QVBoxLayout(this);//温度曲线TempWave = new WaveChart();TempWave->setTitle("温度曲线");//湿度曲线HumityWave = new WaveChart();HumityWave->setTitle("温度曲线");vlaout->addWidget(TempWave);vlaout->addWidget(HumityWave);
}TempHumtiy::~TempHumtiy()
{delete ui;
}

运行效果:
在这里插入图片描述

二、环境监测界面布局

Illumination.h:

#include "Illumination.h"
#include "ui_Illumination.h"
#include <QHBoxLayout>
#include <QLabel>
#include <QFont>
#include <QPalette>Illumination::Illumination(QWidget *parent) :QWidget(parent),ui(new Ui::Illumination)
{ui->setupUi(this);QFont font("Arial", 20);QPalette palette;palette.setColor(QPalette::WindowText, Qt::white);QLabel* label1 = new QLabel("烟雾浓度");label1->setFont(font);label1->setPalette(palette);label1->setAlignment(Qt::AlignCenter);QLabel* label2 = new QLabel("光照强度");label2->setFont(font);label2->setPalette(palette);label2->setAlignment(Qt::AlignCenter);QLabel* label3 = new QLabel("Co2浓度");label3->setFont(font);label3->setPalette(palette);label3->setAlignment(Qt::AlignCenter);QHBoxLayout* hlayout = new QHBoxLayout();QHBoxLayout* hlayout1 = new QHBoxLayout();QVBoxLayout* vlayout = new QVBoxLayout(this);hlayout1->addWidget(label1);hlayout1->addWidget(label2);hlayout1->addWidget(label3);/* 烟雾浓度 */Smoke = new ProgressPercent();Smoke->setValue(20);Smoke->setUsedColor(QColor(255, 127, 39));Smoke->setPercentStyle(ProgressPercent::PercentStyle_Arc_Wave);/* 光照强度 */IllCent = new ProgressPercent();IllCent->setValue(15);IllCent->setUsedColor(QColor(237, 201, 14));IllCent->setPercentStyle(ProgressPercent::PercentStyle_Arc_Wave);/* Co2 */Co2 = new ProgressPercent();Co2->setValue(25);Co2->setUsedColor(QColor(237, 28, 36));Co2->setPercentStyle(ProgressPercent::PercentStyle_Arc_Wave);hlayout->addWidget(Smoke);hlayout->addWidget(IllCent);hlayout->addWidget(Co2);vlayout->addStretch();vlayout->addLayout(hlayout);vlayout->addLayout(hlayout1);vlayout->addStretch();
}Illumination::~Illumination()
{delete ui;
}

Illumination.cpp:

#include "Illumination.h"
#include "ui_Illumination.h"
#include <QHBoxLayout>
#include <QLabel>
#include <QFont>
#include <QPalette>Illumination::Illumination(QWidget *parent) :QWidget(parent),ui(new Ui::Illumination)
{ui->setupUi(this);QFont font("Arial", 20);QPalette palette;palette.setColor(QPalette::WindowText, Qt::white);QLabel* label1 = new QLabel("烟雾浓度");label1->setFont(font);label1->setPalette(palette);label1->setAlignment(Qt::AlignCenter);QLabel* label2 = new QLabel("光照强度");label2->setFont(font);label2->setPalette(palette);label2->setAlignment(Qt::AlignCenter);QLabel* label3 = new QLabel("Co2浓度");label3->setFont(font);label3->setPalette(palette);label3->setAlignment(Qt::AlignCenter);QHBoxLayout* hlayout = new QHBoxLayout();QHBoxLayout* hlayout1 = new QHBoxLayout();QVBoxLayout* vlayout = new QVBoxLayout(this);hlayout1->addWidget(label1);hlayout1->addWidget(label2);hlayout1->addWidget(label3);/* 烟雾浓度 */Smoke = new ProgressPercent();Smoke->setValue(20);Smoke->setUsedColor(QColor(255, 127, 39));Smoke->setPercentStyle(ProgressPercent::PercentStyle_Arc_Wave);/* 光照强度 */IllCent = new ProgressPercent();IllCent->setValue(15);IllCent->setUsedColor(QColor(237, 201, 14));IllCent->setPercentStyle(ProgressPercent::PercentStyle_Arc_Wave);/* Co2 */Co2 = new ProgressPercent();Co2->setValue(25);Co2->setUsedColor(QColor(237, 28, 36));Co2->setPercentStyle(ProgressPercent::PercentStyle_Arc_Wave);hlayout->addWidget(Smoke);hlayout->addWidget(IllCent);hlayout->addWidget(Co2);vlayout->addStretch();vlayout->addLayout(hlayout);vlayout->addLayout(hlayout1);vlayout->addStretch();
}Illumination::~Illumination()
{delete ui;
}

运行效果:
在这里插入图片描述

三、摄像头界面布局

将QWidget提升为QVideoWidget,这个界面用于显示摄像头的图形。
在这里插入图片描述
Camera.h:

#ifndef CAMERA_H
#define CAMERA_H#include <QWidget>
#include <QCamera>
#include <QVideoWidget>
#include <QMediaCaptureSession>
#include <QMediaDevices>namespace Ui {
class Camera;
}class Camera : public QWidget
{Q_OBJECT// 设置摄像机QCamera* camera;// 媒体会话QMediaCaptureSession* captureSession;public:explicit Camera(QWidget *parent = nullptr);~Camera();private:Ui::Camera *ui;
};#endif // CAMERA_H

Camera.cpp:

#include "Camera.h"
#include "ui_Camera.h"Camera::Camera(QWidget *parent) :QWidget(parent),ui(new Ui::Camera)
{ui->setupUi(this);// 默认的视频输入设备QCameraDevice defaultVideoInput = QMediaDevices::defaultVideoInput();// 设置摄像机camera = new QCamera(QMediaDevices::defaultVideoInput());// 媒体会话captureSession = new QMediaCaptureSession();captureSession->setCamera(camera);captureSession->setVideoOutput(ui->widget);camera->start();}Camera::~Camera()
{delete ui;
}

运行效果:
在这里插入图片描述

总结

本篇文章就讲解到这里。

相关文章:

Linux MQTT智能家居(温度,湿度,环境监测,摄像头等界面布局设置)

文章目录 前言一、温度湿度曲线布局二、环境监测界面布局三、摄像头界面布局总结 前言 本篇文章来完成另外三个界面的布局设置。 这里会使用到 feiyangqingyun的一些控件库。 一、温度湿度曲线布局 TempHumtiy.h: #ifndef TEMPHUMTIY_H #define TEMPHUMTIY_H#include <…...

权衡与选择:如何巧妙管理项目需求的优先级

在项目管理领域&#xff0c;处理和管理需求可能是最具挑战性的环节之一。每一个项目都充满了各种需求&#xff0c;从业务需求到技术需求&#xff0c;从用户需求到系统需求。而如何有效地为这些需求排列优先级&#xff0c;不仅会影响项目的进度和资源分配&#xff0c;还会直接关…...

UGUI组件EventTrigger用法

一.Unity编辑器中EventTrigger组件用法 1.添加事件类型 2.绑定gameObject指定组件的方法 3.方法执行逻辑 public class NewBehaviourScript : MonoBehaviour {public void PointerDown(){Debug.Log("Trigger PointerDown");} } 4.按下鼠标&#xff0c;绑定方法成功…...

Visual Studio 2019 详细安装教程(图文版)

前言 Visual Studio 2019 安装包的下载教程、安装教程 教程 博主博客链接&#xff1a;https://blog.csdn.net/m0_74014525 关注博主&#xff0c;后期持续更新系列文章 ********文章附有百度网盘安装包链接********* 系列文章 第一篇&#xff1a;Visual Studio 2019 详细安装教…...

idea添加作者信息

idea添加作者信息 自定义作者信息idea添加作者信息自定义作者信息 自定义作者信息 idea添加作者信息 在idea中&#xff0c;经常会有这些波浪纹提示&#xff0c;放在上面之后会提示添加作者信息,点击添加作者信息后&#xff0c;但是不是自己想要的 这里提取的话好像没什么办法…...

后端开发6.权限控制模块

概述 权限控制采用springsecurity 数据库设计 用户表 DROP TABLE IF EXISTS `admin`; CREATE TABLE `admin` (`aid` int(32) NOT NULL AUTO_INCREMENT,`email` varchar(50) DEFAULT NULL,`username` varchar(50) DEFAULT NULL,`password` varchar(255) DEFAULT NULL,`phone…...

Golang原生实现JA3指纹修改,并支持Proxy代理

起因 抓取某个HTTPS网站的时候 开启charles代理能够抓取成功,关闭被风控 通过检测,怀疑可能是tls的时候有区别 尝试 golang的http中,Transport.TLSClientConfig是可以自定义设置的 但起初通过随意设置并不能绕过风控 困难 使用golang的http客户端,修改DialTLSContext函数的…...

一个案例:Vue2组件化开发组件从入门到入土

1. 环境搭建 1.1. 创建项目 npm install -g vue/clivue create vue_study_todolist1.2. 清空项目代码 清楚HelloWorld.Vue代码中的内容。 1.3. 启动空项目 1.4 项目目标 项目组件实现以下效果 2. 组件拆分代码 Vue是一个基于组件的框架&#xff0c;允许您将界面拆分成小的…...

智慧工地源码 智慧工地云平台源码 智慧工地APP源码

智慧工地的核心是数字化&#xff0c;它通过传感器、监控设备、智能终端等技术手段&#xff0c;实现对工地各个环节的实时数据采集和传输&#xff0c;如环境温度、湿度、噪音等数据信息&#xff0c;将数据汇集到云端进行处理和分析&#xff0c;生成各种报表、图表和预警信息&…...

考研408 | 【计算机网络】 网络层

导图 网络层&#xff1a; 路由器功能&#xff1a;转发&路由选择 数据平面 数据平面执行的主要功能是根据转发表进行转发&#xff0c;这是路由器的本地动作。 控制平面 1.传统方法/每路由器法&#xff1a; 2.SDN方法&#xff08;Software-Defined Networking) 控制平面中的…...

postgresql|数据库|角色(用户)管理工作---授权和去权以及usage和select两种权限的区别

前言&#xff1a; postgresql做为一个比较复杂的关系型的重型数据库&#xff0c;不管是安装部署&#xff0c;还是后期的运行维护&#xff0c;都还是有比较多的细节问题需要引起关注。 例如&#xff0c;用户权限的合理分配&#xff0c;那么&#xff0c;什么是权限的合理分配呢…...

【题解】旋转数组的最小数字、比较版本号

文章目录 旋转数组的最小数字比较版本号 旋转数组的最小数字 题目链接&#xff1a;旋转数组的最小数字 解题思路1&#xff1a;遍历求最小值 代码如下&#xff1a; int minNumberInRotateArray(vector<int> rotateArray) {int min rotateArray[0];for(auto const&…...

springboot系统内多级调用报错日志输出顺序

忘记,模糊,故专门验证下 比如方法1调用方法2 方法2又调用方法3 方法3报错 那么报错日志中哪个方法所在行先打印出来? 直接上测试代码 package pers.wwz.study.exception.controller;import lombok.extern.slf4j.Slf4j; import org.springframework.web.bind.annotation.Requ…...

django——配置 settings.py 及相关参数说明

3. 配置 settings.py 及相关参数说明 3.1 配置setting.py文件 设置setting.py文件 加入安装的库 apps.erp_test, rest_framework, django_filters, drf_spectacular,加入新增的APP users启动项目 # 运行项目先执行数据库相关操作&#xff0c;再启动 django 项目 python manag…...

OptaPlanner笔记1

1.1 什么是OptaPlanner 每个组织都面临规划问题&#xff1a;为产品或服务提供有限的受约束的资源&#xff08;员工、资产、时间和金钱&#xff09;。OptaPlanner用来优化这种规划&#xff0c;以实现用更少的资源来做更多的业务。 这被称为Constraint Satisfaction Programming…...

github 镜像站及下载加速网址

1、提供常用的镜像网址&#xff08;记住千万别登录账号&#xff09;&#xff1a; https://github.com.cnpmjs.org https://hub.fastgit.org https://hub.nuaa.cf/ https://hub.yzuu.cf/ https://hub.njuu.cf/上面的网址是一个克隆版的Github&#xff0c;上面的镜像网站内容跟G…...

大数据-玩转数据-Flink RedisSink

一、添加Redis Connector依赖 具体版本根据实际情况确定 <dependency><groupId>org.apache.flink</groupId><artifactId>flink-connector-redis_2.11</artifactId><version>1.1.5</version> </dependency>二、启动redis 参…...

c++病毒/恶搞代码大全( 上 )

注&#xff1a;以下代码应勿用于非法&#xff08;Dev-c5.11实测可用&#xff09; 1: 效果:无限生成cmd 解决方法&#xff1a;关闭程序即可 #include<bits/stdc.h> #include<windows.h> using namespace std; int main() {while(1)system("start cmd"…...

【数学建模】清风数模更新5 灰色关联分析

灰色关联分析综述 诸如经济系统、生态系统、社会系统等抽象系统都包含许多因素&#xff0c;系统整体的发展受各个因素共同影响。 为了更好地推动系统发展&#xff0c;我们需要清楚哪些因素是主要的&#xff0c;哪些是次要的&#xff0c;哪些是积极的&#xff0c;哪些是消极的…...

Windows下运行Tomcat服务时报GC Overhead Limit Exceeded

根本原因是在新建Tomcat作为Windows服务时&#xff0c;系统默认设置的堆内存太小了&#xff0c;我们打开/bin/service.bat文件&#xff0c;将如下图所示的默认值改大一些就好了 if "%JvmMs%" "" set JvmMs512 if "%JvmMx%" "" set J…...

DeepSeek 赋能智慧能源:微电网优化调度的智能革新路径

目录 一、智慧能源微电网优化调度概述1.1 智慧能源微电网概念1.2 优化调度的重要性1.3 目前面临的挑战 二、DeepSeek 技术探秘2.1 DeepSeek 技术原理2.2 DeepSeek 独特优势2.3 DeepSeek 在 AI 领域地位 三、DeepSeek 在微电网优化调度中的应用剖析3.1 数据处理与分析3.2 预测与…...

React Native在HarmonyOS 5.0阅读类应用开发中的实践

一、技术选型背景 随着HarmonyOS 5.0对Web兼容层的增强&#xff0c;React Native作为跨平台框架可通过重新编译ArkTS组件实现85%以上的代码复用率。阅读类应用具有UI复杂度低、数据流清晰的特点。 二、核心实现方案 1. 环境配置 &#xff08;1&#xff09;使用React Native…...

【决胜公务员考试】求职OMG——见面课测验1

2025最新版&#xff01;&#xff01;&#xff01;6.8截至答题&#xff0c;大家注意呀&#xff01; 博主码字不易点个关注吧,祝期末顺利~~ 1.单选题(2分) 下列说法错误的是:&#xff08; B &#xff09; A.选调生属于公务员系统 B.公务员属于事业编 C.选调生有基层锻炼的要求 D…...

Ascend NPU上适配Step-Audio模型

1 概述 1.1 简述 Step-Audio 是业界首个集语音理解与生成控制一体化的产品级开源实时语音对话系统&#xff0c;支持多语言对话&#xff08;如 中文&#xff0c;英文&#xff0c;日语&#xff09;&#xff0c;语音情感&#xff08;如 开心&#xff0c;悲伤&#xff09;&#x…...

以光量子为例,详解量子获取方式

光量子技术获取量子比特可在室温下进行。该方式有望通过与名为硅光子学&#xff08;silicon photonics&#xff09;的光波导&#xff08;optical waveguide&#xff09;芯片制造技术和光纤等光通信技术相结合来实现量子计算机。量子力学中&#xff0c;光既是波又是粒子。光子本…...

LeetCode - 199. 二叉树的右视图

题目 199. 二叉树的右视图 - 力扣&#xff08;LeetCode&#xff09; 思路 右视图是指从树的右侧看&#xff0c;对于每一层&#xff0c;只能看到该层最右边的节点。实现思路是&#xff1a; 使用深度优先搜索(DFS)按照"根-右-左"的顺序遍历树记录每个节点的深度对于…...

动态 Web 开发技术入门篇

一、HTTP 协议核心 1.1 HTTP 基础 协议全称 &#xff1a;HyperText Transfer Protocol&#xff08;超文本传输协议&#xff09; 默认端口 &#xff1a;HTTP 使用 80 端口&#xff0c;HTTPS 使用 443 端口。 请求方法 &#xff1a; GET &#xff1a;用于获取资源&#xff0c;…...

2025年渗透测试面试题总结-腾讯[实习]科恩实验室-安全工程师(题目+回答)

安全领域各种资源&#xff0c;学习文档&#xff0c;以及工具分享、前沿信息分享、POC、EXP分享。不定期分享各种好玩的项目及好用的工具&#xff0c;欢迎关注。 目录 腾讯[实习]科恩实验室-安全工程师 一、网络与协议 1. TCP三次握手 2. SYN扫描原理 3. HTTPS证书机制 二…...

LOOI机器人的技术实现解析:从手势识别到边缘检测

LOOI机器人作为一款创新的AI硬件产品&#xff0c;通过将智能手机转变为具有情感交互能力的桌面机器人&#xff0c;展示了前沿AI技术与传统硬件设计的完美结合。作为AI与玩具领域的专家&#xff0c;我将全面解析LOOI的技术实现架构&#xff0c;特别是其手势识别、物体识别和环境…...

Ubuntu系统多网卡多相机IP设置方法

目录 1、硬件情况 2、如何设置网卡和相机IP 2.1 万兆网卡连接交换机&#xff0c;交换机再连相机 2.1.1 网卡设置 2.1.2 相机设置 2.3 万兆网卡直连相机 1、硬件情况 2个网卡n个相机 电脑系统信息&#xff0c;系统版本&#xff1a;Ubuntu22.04.5 LTS&#xff1b;内核版本…...