using the section bits + QskPushButton::exclusive

examples/iotdashboard/MenuBar.cpp

@@ -5,45 +5,63 @@
 
 #include "MenuBar.h"
 
-#include <QTimer>
+#include <QskGraphicLabel.h>
-
+#include <QskPushButton.h>
-QSK_SUBCONTROL( MenuBarTopLabel, Icon )
-
-QSK_SUBCONTROL( MenuButton, Panel )
-QSK_SUBCONTROL( MenuButton, Text )
-QSK_SUBCONTROL( MenuButton, Icon )
 
 QSK_SUBCONTROL( MenuBar, Panel )
 
-MenuButton::MenuButton( const QString& name, QQuickItem* parent )
+namespace
+{
+    class Button final : public QskPushButton
+    {
+      public:
+        Button( const QString& name, QQuickItem* parent = nullptr )
             : QskPushButton( name, parent )
         {
+            initSizePolicy( QskSizePolicy::MinimumExpanding, QskSizePolicy::Fixed );
+
             setCheckable( true );
-    initSizePolicy( QskSizePolicy::Fixed, QskSizePolicy::Fixed );
+            setExclusive( true );
-
-    setSubcontrolProxy( QskPushButton::Panel, MenuButton::Panel );
-    setSubcontrolProxy( QskPushButton::Text, MenuButton::Text );
-    setSubcontrolProxy( QskPushButton::Icon, MenuButton::Icon );
-
             setIconSource( name );
         }
+    };
+
+    class Logo final : public QskGraphicLabel
+    {
+      public:
+        Logo( QQuickItem* parent = nullptr )
+            : QskGraphicLabel( "main-icon", parent )
+        {
+            setGraphicStrutSize( QSizeF( 40, -1 ) );
+            setFillMode( QskGraphicLabel::Pad );
+            setAlignment( Qt::AlignCenter );
+
+            initSizePolicy( QskSizePolicy::Ignored, QskSizePolicy::Fixed );
+        }
+    };
+}
 
 MenuBar::MenuBar( QQuickItem* parent )
     : QskLinearBox( Qt::Vertical, parent )
     , m_currentIndex( Cube::FrontPos )
 {
+    setSection( QskAspect::Header );
+
     setPanel( true );
     setSubcontrolProxy( QskBox::Panel, MenuBar::Panel );
 
     initSizePolicy( QskSizePolicy::Fixed, QskSizePolicy::Preferred );
     setSpacing( 0 );
 
-    auto graphicLabel = new MenuBarTopLabel( "main-icon", this );
+    populate();
-    graphicLabel->setMargins( marginHint( MenuBarTopLabel::Graphic ) );
+}
-    graphicLabel->setSizePolicy( QskSizePolicy::Fixed, QskSizePolicy::Fixed );
 
-    // ### unify the information with the one from MainItem
+void MenuBar::populate()
-    const QVector< QPair< Cube::Position, QString > > entries =
+{
+    auto logo = new Logo();
+    auto logoutButton = new Button( "Logout");
+
+    const QPair< Cube::Position, QString > entries[] =
     {
         { Cube::FrontPos, "Dashboard" },
         { Cube::RightPos, "Rooms" },
@@ -55,35 +73,30 @@ MenuBar::MenuBar( QQuickItem* parent )
 
     for( const auto& entry : entries )
     {
-        auto* button = new MenuButton( entry.second, this );
+        auto button = new Button( entry.second );
-        m_buttons[ entry.first ] = button;
 
-        connect( button, &QskPushButton::pressed, this, [ this, entry ]()
+        const int id = entry.first;
-        {
+        m_buttons[ id ] = button;
-            for( auto* button : qAsConst( m_buttons ) )
+
-            {
+        connect( button, &QskPushButton::pressed,
-                // the right button will be set to checked after this
+            this, [ this, id ]() { Q_EMIT pageChangeRequested( id ); } );
-                button->setChecked( false );
     }
 
-            Q_EMIT pageChangeRequested( entry.first );
+    addSpacer( 35 );
-        } );
+    addItem( logo );
-    }
+    addSpacer( 60 );
 
-    addSpacer( 0, 1 ); // fill the space at the bottom
+    for ( auto button : m_buttons )
+        addItem( button );
 
-    new MenuButton( "Logout", this );
+    addStretch( 1 ); // fill the space at the bottom
+    addItem( logoutButton );
 }
 
 void MenuBar::setActivePage( const int index )
 {
-    m_buttons[ m_currentIndex ]->setChecked( false );
     m_currentIndex = index;
-
-    QTimer::singleShot( 0, this, [this]()
-    {
     m_buttons[ m_currentIndex ]->setChecked( true );
-    } );
 }
 
 #include "moc_MenuBar.cpp"

examples/iotdashboard/MenuBar.h

@@ -5,36 +5,10 @@
 
 #pragma once
 
-#include <QskGraphicLabel.h>
 #include <QskLinearBox.h>
-#include <QskPushButton.h>
-#include <QskTextLabel.h>
-
 #include "MainItem.h"
 
-class MenuBarTopLabel final : public QskGraphicLabel
+class QskPushButton;
-{
-    Q_OBJECT
-
-  public:
-    QSK_SUBCONTROLS( Icon )
-
-    MenuBarTopLabel( const QString& icon, QQuickItem* parent = nullptr )
-        : QskGraphicLabel( icon, parent )
-    {
-        setSubcontrolProxy( QskGraphicLabel::Graphic, Graphic );
-    }
-};
-
-class MenuButton final : public QskPushButton
-{
-    Q_OBJECT
-
-  public:
-    QSK_SUBCONTROLS( Panel, Text, Icon )
-
-    MenuButton( const QString& name, QQuickItem* parent );
-};
 
 class MenuBar final : public QskLinearBox
 {
@@ -52,6 +26,8 @@ class MenuBar final : public QskLinearBox
     void setActivePage( const int index );
 
   private:
-    MenuButton* m_buttons[ Cube::NumPositions ];
+    void populate();
+
+    QskPushButton* m_buttons[ Cube::NumPositions ];
     uint m_currentIndex;
 };

examples/iotdashboard/Skin.cpp

@@ -38,6 +38,7 @@
 #include <QskSkinHintTableEditor.h>
 #include <QskStateCombination.h>
 #include <QskTextLabel.h>
+#include <QskGraphicLabel.h>
 
 #include <QFontDatabase>
 
@@ -91,26 +92,30 @@ void Skin::initHints( const Palette& palette )
     ed.setPadding( MainContentGridBox::Panel, { 19, 0, 27, 24 } );
 
     // menu bar:
-    ed.setMargin( MenuBarTopLabel::Graphic, { 50, 5, 50, 65 } );
 
-    ed.setPadding( MenuBar::Panel, {0, 35, 0, 12} );
+    {
+        using Q = QskPushButton;
+        using A = QskAspect;
+
+        ed.setStrutSize( Q::Panel | A::Header, -1, 40 );
+        ed.setPadding( Q::Panel | A::Padding, 10 );
 
-    ed.setStrutSize( MenuButton::Panel | QskAspect::Size, {140, 40} );
         QColor color( Qt::white );
         color.setAlphaF( 0.09 );
-    ed.setGradient( MenuButton::Panel | QskControl::Hovered, color );
+        ed.setGradient( Q::Panel | A::Header | Q::Hovered, color );
+
         color.setAlphaF( 0.14 );
-    ed.setGradient( MenuButton::Panel | MenuButton::Checked, color );
+        ed.setGradient( Q::Panel | A::Header | Q::Checked, color );
-    ed.setSpacing( MenuButton::Panel, 10 );
+        ed.setSpacing( Q::Panel | A::Header, 10 );
 
-    ed.setColor( MenuButton::Text, Qt::white );
+        ed.setColor( Q::Text | A::Header, Qt::white );
-    ed.setFontRole( MenuButton::Text, QskSkin::SmallFont );
+        ed.setFontRole( Q::Text | A::Header, QskSkin::SmallFont );
-    ed.setAlignment( MenuButton::Text, Qt::AlignLeft | Qt::AlignVCenter );
+        ed.setAlignment( Q::Text | A::Header, Qt::AlignLeft | Qt::AlignVCenter );
-
-    ed.setPadding( MenuButton::Icon, { 30, 0, 0, 0 } );
-    ed.setStrutSize( MenuButton::Icon, { 14, -1 } );
-    ed.setAlignment( MenuButton::Icon, Qt::AlignCenter );
 
+        ed.setPadding( Q::Icon | A::Header, { 30, 0, 0, 0 } );
+        ed.setStrutSize( Q::Icon | A::Header, { 14, -1 } );
+        ed.setAlignment( Q::Icon | A::Header, Qt::AlignCenter );
+    }
 
     // top bar:
     ed.setPadding( TopBar::Panel, { 25, 35, 25, 0 } );