From 2d754ab0b028e5b3c8ee2285b07959e93757e24a Mon Sep 17 00:00:00 2001 From: Peter Hartmann Date: Wed, 12 Aug 2020 17:11:00 +0200 Subject: [PATCH] implement usage --- examples/iot-dashboard/DaytimeSkin.cpp | 2 ++ examples/iot-dashboard/DaytimeSkin.h | 4 +++ examples/iot-dashboard/MainContent.cpp | 36 +++++++++++----------- examples/iot-dashboard/TopBar.cpp | 3 +- examples/iot-dashboard/Usage.cpp | 38 ++++++++++++++++++++++++ examples/iot-dashboard/Usage.h | 12 ++++++++ examples/iot-dashboard/iot-dashboard.pro | 4 ++- 7 files changed, 78 insertions(+), 21 deletions(-) create mode 100644 examples/iot-dashboard/Usage.cpp create mode 100644 examples/iot-dashboard/Usage.h diff --git a/examples/iot-dashboard/DaytimeSkin.cpp b/examples/iot-dashboard/DaytimeSkin.cpp index dad0feca..b59acb33 100644 --- a/examples/iot-dashboard/DaytimeSkin.cpp +++ b/examples/iot-dashboard/DaytimeSkin.cpp @@ -45,6 +45,8 @@ void DaytimeSkin::initHints() setFont( QskSkin::LargeFont, qskFont( 20 ) ); setFont( QskSkin::HugeFont, qskFont( 27, true ) ); + setFont( DaytimeSkin::TitleFont, qskFont(10, true)); + QColor color(Qt::white); color.setAlphaF(0.09); setGradient( MenuItem::Panel | QskControl::Hovered, color ); diff --git a/examples/iot-dashboard/DaytimeSkin.h b/examples/iot-dashboard/DaytimeSkin.h index daa50d10..f6bf96c8 100644 --- a/examples/iot-dashboard/DaytimeSkin.h +++ b/examples/iot-dashboard/DaytimeSkin.h @@ -8,6 +8,10 @@ class DaytimeSkin : public QskSkin public: DaytimeSkin( QObject* parent = nullptr ); + enum SkinFontRole { + TitleFont = QskSkin::HugeFont + 1, + }; + private: void initHints(); diff --git a/examples/iot-dashboard/MainContent.cpp b/examples/iot-dashboard/MainContent.cpp index 4d882ec9..6935c70a 100644 --- a/examples/iot-dashboard/MainContent.cpp +++ b/examples/iot-dashboard/MainContent.cpp @@ -3,35 +3,33 @@ #include "Card.h" #include "PieChart.h" #include "TopBar.h" +#include "Usage.h" +#include +#include +#include +#include #include -MainContent::MainContent( QQuickItem *parent ) : QskLinearBox( Qt::Horizontal, parent ) +MainContent::MainContent( QQuickItem *parent ) : QskLinearBox( Qt::Vertical, parent ) { setSizePolicy( QskSizePolicy::Expanding, QskSizePolicy::Expanding ); setDefaultAlignment(Qt::AlignTop); + setSpacing(30); auto* topBar = new TopBar(this); -// for( int a = 0; a < 4; ++a ) -// { -// auto* column = new QskLinearBox( Qt::Vertical, this ); -// m_columns.append( column ); -// } + auto* gridBox = new QskGridBox(this); + gridBox->setMargins({15, 0, 15, 0}); + gridBox->setPanel(true); + gridBox->setBoxShapeHint(QskBox::Panel, QskBoxShapeMetrics(6) ); + gridBox->setBoxBorderMetricsHint( QskBox::Panel, QskBoxBorderMetrics(2) ); + QskBoxBorderColors borderColors("#dddddd"); + borderColors.setAlpha(100); + gridBox->setBoxBorderColorsHint( QskBox::Panel, borderColors); -// auto* pieChart = new PieChart; -// QVector< float > angles = { 60, 90, 150, 60 }; -// pieChart->setAngles( angles ); -// addCard( "Sample usage", pieChart, 0 ); - -// auto* barGraph = new QskTextLabel( "here bar graph" ); -// addCard( "Power consumption", barGraph, 0 ); - -// auto* statistics = new QskTextLabel( "here detailed statistics" ); -// addCard( "Detailed statistics", statistics, 1 ); - -// auto* users = new QskTextLabel( "here users" ); -// addCard( "Users", users, 1 ); + auto* usage = new Usage(gridBox); + gridBox->addItem(usage, 0, 0, 2, 1); } void MainContent::addCard( const QString &title, QskControl *content, int column ) diff --git a/examples/iot-dashboard/TopBar.cpp b/examples/iot-dashboard/TopBar.cpp index 6da24a4a..2c5db4ea 100644 --- a/examples/iot-dashboard/TopBar.cpp +++ b/examples/iot-dashboard/TopBar.cpp @@ -11,6 +11,7 @@ TopBarItem::TopBarItem(const QString& name, const QColor &textColor, const QGrad { setAutoLayoutChildren( true ); setAutoAddChildren( true ); + setSpacing(15); auto* textLabel = new QskTextLabel( name, this ); textLabel->setFontRole(QskSkin::SmallFont); // ### style @@ -34,7 +35,7 @@ TopBar::TopBar(QQuickItem *parent) : QskLinearBox(Qt::Horizontal, parent) setAutoLayoutChildren(true); setAutoAddChildren(true); setSizePolicy(QskSizePolicy::Preferred, QskSizePolicy::Fixed); - setMargins({25, 30, 25, 0}); + setMargins({25, 35, 25, 0}); QStringList itemStrings = { "Living Room", "Bedroom", "Bathroom", "Kitchen" }; QColor textColors[] = {"#ff3122", "#6776ff", "#f99055", "#6776ff"}; diff --git a/examples/iot-dashboard/Usage.cpp b/examples/iot-dashboard/Usage.cpp new file mode 100644 index 00000000..c4617ea9 --- /dev/null +++ b/examples/iot-dashboard/Usage.cpp @@ -0,0 +1,38 @@ +#include "Usage.h" +#include "DaytimeSkin.h" + +#include + +Usage::Usage(QQuickItem *parent) + : QskLinearBox(Qt::Vertical, parent) +{ + setMargins(17); + auto* title = new QskTextLabel("Usage", this); + title->setFontRole(DaytimeSkin::TitleFont); + + auto* content = new QskLinearBox(Qt::Vertical, this); + + auto* today = new QskLinearBox(Qt::Horizontal, content); + auto* todayText = new QskTextLabel("Usage today", today); + todayText->setFontRole(QskSkin::SmallFont); + auto* todaySpacer = new QskTextLabel("_____", today); + todaySpacer->setTextColor("#dddddd"); + auto* todayValue = new QskTextLabel("0,5 kwH", today); + todayValue->setFontRole(QskSkin::SmallFont); + + auto* month = new QskLinearBox(Qt::Horizontal, content); + auto* monthText = new QskTextLabel("Usage this month", month); + monthText->setFontRole(QskSkin::SmallFont); + auto* monthSpacer = new QskTextLabel("_____", month); + monthSpacer->setTextColor("#dddddd"); + auto* monthValue = new QskTextLabel("66 kwH", month); + monthValue->setFontRole(QskSkin::SmallFont); + + auto* total = new QskLinearBox(Qt::Horizontal, content); + auto* totalText = new QskTextLabel("Total working hours", total); + totalText->setFontRole(QskSkin::SmallFont); + auto* totalSpacer = new QskTextLabel("_____", total); + totalSpacer->setTextColor("#dddddd"); + auto* totalValue = new QskTextLabel("125 hrs", total); + totalValue->setFontRole(QskSkin::SmallFont); +} diff --git a/examples/iot-dashboard/Usage.h b/examples/iot-dashboard/Usage.h new file mode 100644 index 00000000..0f6a2a0d --- /dev/null +++ b/examples/iot-dashboard/Usage.h @@ -0,0 +1,12 @@ +#ifndef USAGE_H +#define USAGE_H + +#include + +class Usage : public QskLinearBox +{ +public: + Usage( QQuickItem* parent); +}; + +#endif // USAGE_H diff --git a/examples/iot-dashboard/iot-dashboard.pro b/examples/iot-dashboard/iot-dashboard.pro index c94e6c92..b4c040c2 100644 --- a/examples/iot-dashboard/iot-dashboard.pro +++ b/examples/iot-dashboard/iot-dashboard.pro @@ -10,6 +10,7 @@ SOURCES += \ PieChartPainted.cpp \ PieChartSkinlet.cpp \ TopBar.cpp \ + Usage.cpp \ main.cpp \ MainWindow.cpp @@ -23,7 +24,8 @@ HEADERS += \ PieChart.h \ PieChartPainted.h \ PieChartSkinlet.h \ - TopBar.h + TopBar.h \ + Usage.h RESOURCES += \ images.qrc \