diff --git a/examples/iot-dashboard/DaytimeSkin.cpp b/examples/iot-dashboard/DaytimeSkin.cpp index 0de60f5e..ab77d3f6 100644 --- a/examples/iot-dashboard/DaytimeSkin.cpp +++ b/examples/iot-dashboard/DaytimeSkin.cpp @@ -12,9 +12,10 @@ namespace { - static inline QFont qskFont( qreal pointSize ) + static inline QFont qskFont( qreal pointSize, bool semiBold = false ) { - QFont font("Proxima Nova"); // the other one is Proxima Nova Lt + QString family = semiBold ? "Proxima Nova Lt" : "Proxima Nova"; + QFont font(family); font.setPointSizeF( pointSize /*/ qskDpiScaled( 1.0 )*/ ); return font; } @@ -36,8 +37,9 @@ void DaytimeSkin::initHints() setFont( QskSkin::DefaultFont, qskFont( 12 ) ); setFont( QskSkin::TinyFont, qskFont( 12 ) ); setFont( QskSkin::SmallFont, qskFont( 10 ) ); + setFont( QskSkin::MediumFont, qskFont( 13 ) ); setFont( QskSkin::LargeFont, qskFont( 14 ) ); - setFont( QskSkin::HugeFont, qskFont( 36 ) ); + setFont( QskSkin::HugeFont, qskFont( 36, true ) ); QColor color(Qt::white); color.setAlphaF(0.09); diff --git a/examples/iot-dashboard/MainContent.cpp b/examples/iot-dashboard/MainContent.cpp index a7bc3a4a..4d882ec9 100644 --- a/examples/iot-dashboard/MainContent.cpp +++ b/examples/iot-dashboard/MainContent.cpp @@ -2,32 +2,36 @@ #include "Card.h" #include "PieChart.h" +#include "TopBar.h" #include MainContent::MainContent( QQuickItem *parent ) : QskLinearBox( Qt::Horizontal, parent ) { setSizePolicy( QskSizePolicy::Expanding, QskSizePolicy::Expanding ); + setDefaultAlignment(Qt::AlignTop); - for( int a = 0; a < 4; ++a ) - { - auto* column = new QskLinearBox( Qt::Vertical, this ); - m_columns.append( column ); - } + auto* topBar = new TopBar(this); - auto* pieChart = new PieChart; - QVector< float > angles = { 60, 90, 150, 60 }; - pieChart->setAngles( angles ); - addCard( "Sample usage", pieChart, 0 ); +// for( int a = 0; a < 4; ++a ) +// { +// auto* column = new QskLinearBox( Qt::Vertical, this ); +// m_columns.append( column ); +// } - auto* barGraph = new QskTextLabel( "here bar graph" ); - addCard( "Power consumption", barGraph, 0 ); +// auto* pieChart = new PieChart; +// QVector< float > angles = { 60, 90, 150, 60 }; +// pieChart->setAngles( angles ); +// addCard( "Sample usage", pieChart, 0 ); - auto* statistics = new QskTextLabel( "here detailed statistics" ); - addCard( "Detailed statistics", statistics, 1 ); +// auto* barGraph = new QskTextLabel( "here bar graph" ); +// addCard( "Power consumption", barGraph, 0 ); - auto* users = new QskTextLabel( "here users" ); - addCard( "Users", users, 1 ); +// auto* statistics = new QskTextLabel( "here detailed statistics" ); +// addCard( "Detailed statistics", statistics, 1 ); + +// auto* users = new QskTextLabel( "here users" ); +// addCard( "Users", users, 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 new file mode 100644 index 00000000..c63783b4 --- /dev/null +++ b/examples/iot-dashboard/TopBar.cpp @@ -0,0 +1,45 @@ +#include "TopBar.h" + +#include +#include + +#include + +TopBarItem::TopBarItem( const QString& name, QQuickItem* parent ) : QskLinearBox( Qt::Vertical, parent ), + m_name( name ) +{ + setAutoLayoutChildren( true ); + setAutoAddChildren( true ); + setFixedSize( {140, 40} ); + setMargins({0, 0, 0, 0}); + setPadding({30, 0, 30, 0}); + setSpacing(6); + + auto* textLabel = new QskTextLabel( name, this ); + textLabel->setFontRole(QskSkin::SmallFont); // ### style +} + +TopBar::TopBar(QQuickItem *parent) : QskLinearBox(Qt::Horizontal, parent) +{ + setAutoLayoutChildren(true); + setAutoAddChildren(true); + setSizePolicy(QskSizePolicy::Preferred, QskSizePolicy::Fixed); + + QStringList itemStrings = { "Living Room", "Bedroom", "Bathroom", "Kitchen" }; + + for( const auto itemString : itemStrings ) + { + auto* item = new TopBarItem( itemString, this ); + m_entries.append(item); + } + + auto* timeControl = new QskLinearBox(Qt::Vertical, this); + auto* timeTitle = new QskTextLabel("Current time", timeControl); // ### make bold or so + timeTitle->setFontRole(QskSkin::TinyFont); + + auto now = QTime::currentTime(); + auto timeString = now.toString(); + auto* timeDisplay = new QskTextLabel(timeString, timeControl); + timeDisplay->setFontRole(QskSkin::HugeFont); + timeDisplay->setTextColor("#6776FF"); +} diff --git a/examples/iot-dashboard/TopBar.h b/examples/iot-dashboard/TopBar.h new file mode 100644 index 00000000..048c371a --- /dev/null +++ b/examples/iot-dashboard/TopBar.h @@ -0,0 +1,25 @@ +#pragma once + +#include + +class TopBarItem : public QskLinearBox +{ + Q_OBJECT + +public: + TopBarItem( const QString& name, QQuickItem* parent ); + +private: + QString m_name; +}; + +class TopBar : public QskLinearBox +{ + Q_OBJECT + +public: + TopBar(QQuickItem* parent); + +private: + QList< TopBarItem* > m_entries; +}; diff --git a/examples/iot-dashboard/iot-dashboard.pro b/examples/iot-dashboard/iot-dashboard.pro index 1e243006..af30c8e4 100644 --- a/examples/iot-dashboard/iot-dashboard.pro +++ b/examples/iot-dashboard/iot-dashboard.pro @@ -7,6 +7,7 @@ SOURCES += \ MenuBar.cpp \ PieChart.cpp \ PieChartSkinlet.cpp \ + TopBar.cpp \ main.cpp \ MainWindow.cpp @@ -17,7 +18,8 @@ HEADERS += \ MainWindow.h \ MenuBar.h \ PieChart.h \ - PieChartSkinlet.h + PieChartSkinlet.h \ + TopBar.h RESOURCES += \ images.qrc \