![cover](https://img-blog.csdnimg.cn/95493a9ff04d423b9fce69cf9a6ba9bc.png)
Linux MQTT智能家居(温度,湿度,环境监测,摄像头等界面布局设置)
本篇文章来完成另外三个界面的布局设置。这里会使用到 feiyangqingyun的一些控件库。本篇文章就讲解到这里。
·
前言
本篇文章来完成另外三个界面的布局设置。
这里会使用到 feiyangqingyun的一些控件库。
一、温度湿度曲线布局
TempHumtiy.h:
#ifndef TEMPHUMTIY_H
#define TEMPHUMTIY_H
#include <QWidget>
#include "wavechart.h"
namespace Ui {
class TempHumtiy;
}
class TempHumtiy : public QWidget
{
Q_OBJECT
WaveChart* 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;
}
运行效果:
总结
本篇文章就讲解到这里。
更多推荐
所有评论(0)