diff --git a/examples/iot-dashboard/Card.cpp b/examples/iot-dashboard/Card.cpp new file mode 100644 index 00000000..98f2970c --- /dev/null +++ b/examples/iot-dashboard/Card.cpp @@ -0,0 +1,12 @@ +#include "Card.h" + +#include + +Card::Card(const QString &title, QskControl *content, QQuickItem *parent ) : QskLinearBox( Qt::Vertical, parent ), + m_title( title ) +{ + m_label = new QskTextLabel( m_title, this ); + m_content = content; + m_content->setParentItem( this ); + m_content->setParent( this ); +} diff --git a/examples/iot-dashboard/Card.h b/examples/iot-dashboard/Card.h new file mode 100644 index 00000000..e8df8d6a --- /dev/null +++ b/examples/iot-dashboard/Card.h @@ -0,0 +1,19 @@ +#ifndef CARD_H +#define CARD_H + +#include + +class QskTextLabel; + +class Card : public QskLinearBox +{ +public: + Card( const QString& title, QskControl* content, QQuickItem* parent ); + +private: + QString m_title; + QskTextLabel* m_label; + QskControl* m_content; +}; + +#endif // CARD_H diff --git a/examples/iot-dashboard/MainContent.cpp b/examples/iot-dashboard/MainContent.cpp new file mode 100644 index 00000000..0edc1d7a --- /dev/null +++ b/examples/iot-dashboard/MainContent.cpp @@ -0,0 +1,33 @@ +#include "MainContent.h" + +#include "Card.h" + +#include + +MainContent::MainContent( QQuickItem *parent ) : QskLinearBox( Qt::Horizontal, parent ) +{ + setSizePolicy( QskSizePolicy::Expanding, QskSizePolicy::Expanding ); + + for( int a = 0; a < 4; ++a ) + { + auto* column = new QskLinearBox( Qt::Vertical, this ); + m_columns.append( column ); + } + + auto* pieChart = new QskTextLabel( "here pie chart" ); + 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 ); +} + +void MainContent::addCard( const QString &title, QskControl *content, int column ) +{ + new Card( title, content, m_columns.at( column ) ); +} diff --git a/examples/iot-dashboard/MainContent.h b/examples/iot-dashboard/MainContent.h new file mode 100644 index 00000000..a7120879 --- /dev/null +++ b/examples/iot-dashboard/MainContent.h @@ -0,0 +1,19 @@ +#ifndef MAINCONTENT_H +#define MAINCONTENT_H + +#include + +class MainContent : public QskLinearBox +{ + Q_OBJECT + +public: + MainContent( QQuickItem* parent ); + +private: + void addCard( const QString& title, QskControl* content, int column = -1 ); + + QList< QskLinearBox* > m_columns; +}; + +#endif // MAINCONTENT_H diff --git a/examples/iot-dashboard/MainWindow.cpp b/examples/iot-dashboard/MainWindow.cpp index 0479aae1..c764f392 100644 --- a/examples/iot-dashboard/MainWindow.cpp +++ b/examples/iot-dashboard/MainWindow.cpp @@ -1,4 +1,6 @@ #include "MainWindow.h" + +#include "MainContent.h" #include "MenuBar.h" #include @@ -9,17 +11,6 @@ MainWindow::MainWindow() : QskWindow() setTitle( "IOT dashboard" ); m_mainLayout = new QskLinearBox( Qt::Horizontal, contentItem() ); - - addMenuBar(); - addMainContent(); -} - -void MainWindow::addMenuBar() -{ - auto* menuBar = new MenuBar( m_mainLayout ); -} - -void MainWindow::addMainContent() -{ - + m_menuBar = new MenuBar( m_mainLayout ); + m_mainContent = new MainContent( m_mainLayout ); } diff --git a/examples/iot-dashboard/MainWindow.h b/examples/iot-dashboard/MainWindow.h index 36a5b63a..9743e4ee 100644 --- a/examples/iot-dashboard/MainWindow.h +++ b/examples/iot-dashboard/MainWindow.h @@ -3,6 +3,8 @@ #include +class MainContent; +class MenuBar; class QskLinearBox; class MainWindow : public QskWindow @@ -13,10 +15,9 @@ public: MainWindow(); private: - void addMenuBar(); - void addMainContent(); - QskLinearBox* m_mainLayout; + MenuBar* m_menuBar; + MainContent* m_mainContent; }; #endif // MAINWINDOW_H diff --git a/examples/iot-dashboard/MenuBar.cpp b/examples/iot-dashboard/MenuBar.cpp index 51497e04..0126d6ef 100644 --- a/examples/iot-dashboard/MenuBar.cpp +++ b/examples/iot-dashboard/MenuBar.cpp @@ -1,20 +1,44 @@ #include "MenuBar.h" +#include +#include +#include #include -MenuBar::MenuBar( QQuickItem *parent ) : QskLinearBox( Qt::Vertical, parent ) +#include + +MenuItem::MenuItem( const QString& name, QQuickItem* parent ) : QskLinearBox( Qt::Horizontal, parent ), + m_name( name ) { - setSizePolicy( QskSizePolicy::Minimum, QskSizePolicy::Expanding ); setAutoLayoutChildren( true ); setAutoAddChildren( true ); + QString fileName = ":/images/" + name.toLower() + ".png"; + QImage image( fileName ); + auto graphic = QskGraphic::fromImage( image ); + auto* graphicLabel = new QskGraphicLabel( graphic, this ); + graphicLabel->setFixedSize( 32, 32 ); + + auto* textLabel = new QskTextLabel( name, this ); + textLabel->setTextColor( Qt::white ); // ### style +} + +MenuBar::MenuBar( QQuickItem *parent ) : QskLinearBox( Qt::Vertical, parent ) +{ + setSizePolicy( QskSizePolicy::Minimum, QskSizePolicy::Preferred ); + setAutoLayoutChildren( true ); + setAutoAddChildren( true ); + setMargins( 35 ); // ### style + setSpacing( 30 ); // ### style + setBackgroundColor( { 0, 35, 102 } ); // ### style - m_entries = { "Home", "Details", "Statistics", "Usage" }; + m_entries = { "Home", "Details", "Statistics", "Settings" }; for( const auto entry : m_entries ) { - auto* label = new QskTextLabel( entry, this ); - label->setTextColor( Qt::white ); // ### style + auto* menuItem = new MenuItem( entry, this ); } + + addSpacer( 0, 1 ); // fill the space at the bottom } diff --git a/examples/iot-dashboard/MenuBar.h b/examples/iot-dashboard/MenuBar.h index 9f0e1fd9..1f5e5a21 100644 --- a/examples/iot-dashboard/MenuBar.h +++ b/examples/iot-dashboard/MenuBar.h @@ -3,6 +3,17 @@ #include +class MenuItem : public QskLinearBox +{ + Q_OBJECT + +public: + MenuItem( const QString& name, QQuickItem* parent ); + +private: + QString m_name; +}; + class MenuBar : public QskLinearBox { Q_OBJECT diff --git a/examples/iot-dashboard/images.qrc b/examples/iot-dashboard/images.qrc new file mode 100644 index 00000000..a12a5750 --- /dev/null +++ b/examples/iot-dashboard/images.qrc @@ -0,0 +1,8 @@ + + + images/statistics.png + images/settings.png + images/home.png + images/details.png + + diff --git a/examples/iot-dashboard/images/calendar.png b/examples/iot-dashboard/images/calendar.png deleted file mode 100644 index e543eaee..00000000 Binary files a/examples/iot-dashboard/images/calendar.png and /dev/null differ diff --git a/examples/iot-dashboard/images/details.png b/examples/iot-dashboard/images/details.png new file mode 100644 index 00000000..77bc34a1 Binary files /dev/null and b/examples/iot-dashboard/images/details.png differ diff --git a/examples/iot-dashboard/images/gear.png b/examples/iot-dashboard/images/gear.png deleted file mode 100644 index 7ee84d08..00000000 Binary files a/examples/iot-dashboard/images/gear.png and /dev/null differ diff --git a/examples/iot-dashboard/images/home.png b/examples/iot-dashboard/images/home.png index 3ff42c35..82f22fb8 100644 Binary files a/examples/iot-dashboard/images/home.png and b/examples/iot-dashboard/images/home.png differ diff --git a/examples/iot-dashboard/images/network.png b/examples/iot-dashboard/images/network.png deleted file mode 100644 index 5ea3a5d6..00000000 Binary files a/examples/iot-dashboard/images/network.png and /dev/null differ diff --git a/examples/iot-dashboard/images/settings.png b/examples/iot-dashboard/images/settings.png new file mode 100644 index 00000000..b184a885 Binary files /dev/null and b/examples/iot-dashboard/images/settings.png differ diff --git a/examples/iot-dashboard/images/statistics.png b/examples/iot-dashboard/images/statistics.png new file mode 100644 index 00000000..95669429 Binary files /dev/null and b/examples/iot-dashboard/images/statistics.png differ diff --git a/examples/iot-dashboard/iot-dashboard.pro b/examples/iot-dashboard/iot-dashboard.pro index ac3eca95..473a98a7 100644 --- a/examples/iot-dashboard/iot-dashboard.pro +++ b/examples/iot-dashboard/iot-dashboard.pro @@ -1,11 +1,17 @@ CONFIG += qskexample SOURCES += \ + Card.cpp \ + MainContent.cpp \ MenuBar.cpp \ main.cpp \ MainWindow.cpp HEADERS += \ + Card.h \ + MainContent.h \ MainWindow.h \ MenuBar.h +RESOURCES += \ + images.qrc diff --git a/examples/iot-dashboard/main.cpp b/examples/iot-dashboard/main.cpp index f44215d1..3d0f63d1 100644 --- a/examples/iot-dashboard/main.cpp +++ b/examples/iot-dashboard/main.cpp @@ -1,3 +1,5 @@ +#include "MainWindow.h" + #include #include @@ -8,8 +10,6 @@ #include -#include "MainWindow.h" - int main( int argc, char* argv[] ) { QGuiApplication app( argc, argv );