add shadow from outside

... because the class is not a QskControl

examples/iot-dashboard/Box.cpp

@@ -8,18 +8,18 @@
 #include <QskBoxShapeMetrics.h>
 #include <QskTextLabel.h>
 
-ShadowBox::ShadowBox( QskControl* control, QQuickItem* parent )
+ShadowBox::ShadowBox( QQuickItem* parent )
     : QskControl( parent )
-    , m_control( control )
+//    , m_control( control )
     , m_rectangle( new ShadowedRectangle( this ) )
 {
-    setAutoLayoutChildren( true );
+//    setAutoLayoutChildren( true );
 
     m_rectangle->shadow()->setColor( Qt::black );
     m_rectangle->shadow()->setSize( 15 );
     m_rectangle->setColor( Qt::white ); // ### opacity should only be for the shadow, not the background
-    m_rectangle->setOpacity( 0.1 );
+//    m_rectangle->setOpacity( 0.1 );
-    m_rectangle->setSize( m_control->preferredSize() );
+//    m_rectangle->setSize( m_control->preferredSize() );
     m_rectangle->corners()->setTopLeft( 6 );
     m_rectangle->corners()->setTopRight( 6 );
     m_rectangle->corners()->setBottomLeft( 6 );
@@ -28,10 +28,10 @@ ShadowBox::ShadowBox( QskControl* control, QQuickItem* parent )
 
 void ShadowBox::updateLayout()
 {
-    const auto s = m_rectangle->shadow()->size();
+//    const auto s = m_rectangle->shadow()->size();
-    qDebug() << m_control->geometry() << geometry();
+//    qDebug() << m_control->geometry() << geometry();
-    m_control->setPosition( {15, 0} ); // ### why?
+//    m_control->setPosition( {15, 0} ); // ### why?
-    m_control->setZ( 1 );
+//    m_control->setZ( 1 );
 }
 
 Box::Box( const QString& title, QQuickItem* parent )
@@ -46,24 +46,24 @@ Box::Box( const QString& title, QQuickItem* parent )
     setMarginsHint( Panel | QskAspect::Padding, 15 );
     setPanel( true );
     setBoxShapeHint( QskBox::Panel, 6 );
-    setBoxBorderMetricsHint( QskBox::Panel, 2 );
+//    setBoxBorderMetricsHint( QskBox::Panel, 2 );
     QskBoxBorderColors borderColors( "#dddddd" );
     borderColors.setAlpha( 100 );
     setBoxBorderColorsHint( QskBox::Panel, borderColors );
 
 
-    auto* r = new ShadowedRectangle( this );
+//    auto* r = new ShadowedRectangle( this );
-    r->shadow()->setColor( Qt::black );
+//    r->shadow()->setColor( Qt::black );
-    r->shadow()->setSize( 15 );
+//    r->shadow()->setSize( 15 );
-    r->setPosition( {0, 0} );
+//    r->setPosition( {0, 0} );
-    r->setOpacity( 0.1 );
+//    r->setOpacity( 0.1 );
-    r->setSize( {100, 50} );
+//    r->setSize( {100, 50} );
-    r->corners()->setTopLeft( 6 );
+//    r->corners()->setTopLeft( 6 );
-    r->corners()->setTopRight( 6 );
+//    r->corners()->setTopRight( 6 );
-    r->corners()->setBottomLeft( 6 );
+//    r->corners()->setBottomLeft( 6 );
-    r->corners()->setBottomRight( 6 );
+//    r->corners()->setBottomRight( 6 );
-//    r->setRadius( 5 );
+////    r->setRadius( 5 );
-    auto* t = new QskTextLabel( "bla", r );
+//    auto* t = new QskTextLabel( "bla", r );
 
 
     m_label->setFontRole( DaytimeSkin::TitleFont );

examples/iot-dashboard/Box.h

@@ -11,13 +11,13 @@ class ShadowBox : public QskControl
 {
         Q_OBJECT
     public:
-        ShadowBox( QskControl* control, QQuickItem* parent );
+        ShadowBox( QQuickItem* parent = nullptr );
 
     protected:
         void updateLayout() override;
 
     private:
-        QskControl* m_control;
+//        QskControl* m_control;
         ShadowedRectangle* m_rectangle;
 };
 

examples/iot-dashboard/IndoorTemperature.cpp

@@ -13,6 +13,7 @@
 IndoorTemperature::IndoorTemperature( QQuickItem* parent )
     : Box( "", parent )
 {
+//    setBackgroundColor( Qt::transparent );
     setMarginsHint( Panel | QskAspect::Padding, 10 );
 
     auto* layout = new QskLinearBox( Qt::Horizontal, this );

examples/iot-dashboard/MainContent.cpp

@@ -16,24 +16,73 @@
 #include <QskGridBox.h>
 #include <QskTextLabel.h>
 
+#include "src/shadowedrectangle.h"
+
+#include <QTimer>
+
+ShadowPositioner::ShadowPositioner( QQuickItem* parent ) : QskControl( parent )
+{
+    setAutoLayoutChildren( true );
+}
+
+void ShadowPositioner::setGridBox( QskGridBox* gridBox )
+{
+    m_gridBox = gridBox;
+    m_rectangles.reserve( m_gridBox->count() );
+
+    for( int i = 0; i < m_gridBox->count(); ++i )
+    {
+        auto* r = new ShadowedRectangle( this );
+        r->setZ( 5 );
+        r->shadow()->setColor( Qt::black );
+        r->shadow()->setSize( 15 );
+        r->setColor( Qt::white ); // ### opacity should only be for the shadow, not the background
+        r->setOpacity( 0.1 );
+        r->corners()->setTopLeft( 6 );
+        r->corners()->setTopRight( 6 );
+        r->corners()->setBottomLeft( 6 );
+        r->corners()->setBottomRight( 6 );
+        m_rectangles.append( r );
+    }
+}
+
+void ShadowPositioner::updateLayout()
+{
+    auto* mainContent = static_cast<QskLinearBox*>( parentItem() );
+
+    QTimer::singleShot( 0, this, [this, mainContent]()
+    {
+        for( int i = 0; i < m_rectangles.count(); ++i )
+        {
+            auto* item = m_gridBox->itemAtIndex( i );
+            m_rectangles[i]->setSize( item->size() );
+            m_rectangles[i]->setPosition( mainContent->itemAtIndex( 1 )->position() + item->position() );
+        }
+    } );
+}
+
 MainContent::MainContent( QQuickItem* parent ) : QskLinearBox( Qt::Vertical, parent )
 {
+    setAutoAddChildren( false );
     setSizePolicy( QskSizePolicy::Expanding, QskSizePolicy::Expanding );
     setDefaultAlignment( Qt::AlignTop );
     setSpacing( 30 );
     setBackgroundColor( "#FBFBFB" );
 
-    new TopBar( this );
+    auto* topBar = new TopBar( this );
+    addItem( topBar );
 
     auto* gridBox = new QskGridBox( this );
+    gridBox->setSpacing( 15 );
     gridBox->setMargins( {15, 0, 15, 20} );
     gridBox->setPanel( true );
     gridBox->setBoxShapeHint( QskBox::Panel, 6 );
     gridBox->setBoxBorderMetricsHint( QskBox::Panel, 2 );
+    addItem( gridBox );
 
     auto* usage = new Usage( gridBox );
-    auto* usageShadowBox = new ShadowBox( usage, this );
+
-    gridBox->addItem( usageShadowBox, 0, 0, 2, 1 );
+    gridBox->addItem( usage, 0, 0, 2, 1 );
 
     auto* indoorTemperature = new IndoorTemperature( gridBox );
     gridBox->addItem( indoorTemperature, 0, 1 );
@@ -49,4 +98,13 @@ MainContent::MainContent( QQuickItem* parent ) : QskLinearBox( Qt::Vertical, par
 
     auto* lightIntensity = new LightIntensity( gridBox );
     gridBox->addItem( lightIntensity, 2, 2 );
+
+    m_shadowPositioner = new ShadowPositioner( this );
+    m_shadowPositioner->setGridBox( gridBox );
+}
+
+void MainContent::geometryChanged( const QRectF& newGeometry, const QRectF& oldGeometry )
+{
+    QskLinearBox::geometryChanged( newGeometry, oldGeometry );
+    m_shadowPositioner->polish();
 }

examples/iot-dashboard/MainContent.h

@@ -3,6 +3,24 @@
 
 #include <QskLinearBox.h>
 
+class QskGridBox;
+class ShadowBox;
+class ShadowedRectangle;
+
+class ShadowPositioner : public QskControl
+{
+        Q_OBJECT
+    public:
+        ShadowPositioner( QQuickItem* parent );
+
+        void updateLayout() override;
+        void setGridBox( QskGridBox* gridBox );
+
+    private:
+        QskGridBox* m_gridBox;
+        QVector<ShadowedRectangle*> m_rectangles;
+};
+
 class MainContent : public QskLinearBox
 {
         Q_OBJECT
@@ -10,8 +28,12 @@ class MainContent : public QskLinearBox
     public:
         MainContent( QQuickItem* parent );
 
+    protected:
+        void geometryChanged( const QRectF&, const QRectF& ) override;
+
     private:
         QList< QskLinearBox* > m_columns;
+        ShadowPositioner* m_shadowPositioner;
 };
 
 #endif // MAINCONTENT_H

examples/iot-dashboard/Usage.cpp

@@ -6,6 +6,7 @@
 Usage::Usage( QQuickItem* parent )
     : Box( "Usage", parent )
 {
+    setBackgroundColor( Qt::transparent );
     auto* content = new QskLinearBox( Qt::Vertical, this );
 
     auto* today = new QskLinearBox( Qt::Horizontal, content );