gallery example started

examples/examples.pro

@@ -3,11 +3,11 @@ TEMPLATE = subdirs
 # c++
 SUBDIRS += \
     desktop \
+    gallery \
     layouts \
     listbox \
     messagebox \
     mycontrols \
-    sliders \
     thumbnails \
     tabview
 
@@ -28,5 +28,4 @@ SUBDIRS += \
     frames \
     gbenchmark \
     glabels \
-    messageboxQml \
-    tlabels
+    messageboxQml

examples/gallery/Page.cpp

@@ -0,0 +1,28 @@
+/******************************************************************************
+ * QSkinny - Copyright (C) 2016 Uwe Rathmann
+ * This file may be used under the terms of the 3-clause BSD License
+ *****************************************************************************/
+
+#include "Page.h"
+
+#include <QskRgbValue.h>
+#include <QskBoxShapeMetrics.h>
+
+Page::Page( Qt::Orientation orientation, QQuickItem* parent )
+    : QskLinearBox( orientation, parent )
+{
+    setBackgroundColor( Qt::gray );
+
+    setPanel( true );
+    setBoxShapeHint( QskBox::Panel, 8 );
+    setGradient( QskRgbValue::GhostWhite );
+
+    setMargins( 5 );
+    setPadding( 10 );
+    setSpacing( 10 );
+}
+
+void Page::setGradient( const QskGradient& gradient )
+{
+    setGradientHint( QskBox::Panel, gradient );
+}

examples/gallery/Page.h

@@ -0,0 +1,18 @@
+/******************************************************************************
+ * QSkinny - Copyright (C) 2016 Uwe Rathmann
+ * This file may be used under the terms of the 3-clause BSD License
+ *****************************************************************************/
+
+#ifndef PAGE_H
+#define PAGE_H
+
+#include <QskLinearBox.h>
+
+class Page : public QskLinearBox
+{
+  public:
+    Page( Qt::Orientation, QQuickItem* parent = nullptr );
+    void setGradient( const QskGradient& );
+};
+
+#endif

examples/gallery/gallery.pro

@@ -0,0 +1,32 @@
+CONFIG += qskexample
+
+HEADERS += \
+    label/LabelPage.h
+
+SOURCES += \
+    label/LabelPage.cpp \
+
+HEADERS += \
+    slider/CustomSlider.h \
+    slider/CustomSliderSkinlet.h \
+    slider/OtherSlider.h \
+    slider/SliderPage.h
+
+SOURCES += \
+    slider/CustomSlider.cpp \
+    slider/CustomSliderSkinlet.cpp \
+    slider/OtherSlider.cpp \
+    slider/SliderPage.cpp
+
+HEADERS += \
+    progressbar/ProgressBarPage.h
+
+SOURCES += \
+    progressbar/ProgressBarPage.cpp \
+
+HEADERS += \
+    Page.h
+
+SOURCES += \
+    Page.cpp \
+    main.cpp

examples/gallery/label/LabelPage.cpp

@@ -0,0 +1,76 @@
+/******************************************************************************
+ * QSkinny - Copyright (C) 2016 Uwe Rathmann
+ * This file may be used under the terms of the 3-clause BSD License
+ *****************************************************************************/
+
+#include "LabelPage.h"
+#include <QskTextLabel.h>
+#include <QskGraphicLabel.h>
+#include <QskSeparator.h>
+#include <QskRgbValue.h>
+
+namespace
+{
+    class TextBox : public QskLinearBox
+    {
+      public:
+        TextBox( QQuickItem* parent = nullptr )
+            : QskLinearBox( Qt::Vertical, 3, parent )
+        {
+            setMargins( 10 );
+            //setDefaultAlignment( Qt::AlignTop );
+            setExtraSpacingAt( Qt::BottomEdge );
+
+            const QStringList texts =
+                { "Default", "Tiny", "Small", "Medium", "Large", "Huge" };
+
+            for ( int i = 0; i < texts.size(); i++ )
+            {
+                auto label = new QskTextLabel( texts[ i ] + " Font", this );
+
+                //label->setPanel( true );
+                label->setFontRole( i );
+            }
+        }
+    };
+
+    class IconBox : public QskLinearBox
+    {
+      public:
+        IconBox( QQuickItem* parent = nullptr )
+            : QskLinearBox( Qt::Horizontal, 3, parent )
+        {
+            setMargins( 10 );
+            setSpacing( 20 );
+
+            const char* icons[] =
+            {
+                "rectangle/royalblue",
+                "triangleright/thistle",
+                "ellipse/khaki",
+                "ring/sandybrown",
+                "star/darkviolet",
+                "hexagon/darkslategray"
+            };
+
+            const auto prefix = QStringLiteral( "image://shapes/" );
+
+            for ( const auto icon : icons )
+            {
+                auto label = new QskGraphicLabel( prefix + icon, this );
+                label->setAlignment( Qt::AlignCenter );
+            }
+        }
+    };
+}
+
+LabelPage::LabelPage( QQuickItem* parent )
+    : Page( Qt::Vertical, parent )
+{
+    setGradient( QskRgbValue::AliceBlue );
+    setSpacing( 40 );
+
+    (void) new TextBox( this );
+    (void) new QskSeparator( this );
+    (void) new IconBox( this );
+}

examples/gallery/label/LabelPage.h

@@ -0,0 +1,17 @@
+/******************************************************************************
+ * QSkinny - Copyright (C) 2016 Uwe Rathmann
+ * This file may be used under the terms of the 3-clause BSD License
+ *****************************************************************************/
+
+#ifndef LABEL_PAGE_H
+#define LABEL_PAGE_H
+
+#include "Page.h"
+
+class LabelPage : public Page
+{
+  public:
+    LabelPage( QQuickItem* = nullptr );
+};
+
+#endif

examples/gallery/main.cpp

@@ -0,0 +1,55 @@
+/******************************************************************************
+ * QSkinny - Copyright (C) 2016 Uwe Rathmann
+ * This file may be used under the terms of the 3-clause BSD License
+ *****************************************************************************/
+
+#include "label/LabelPage.h"
+#include "progressbar/ProgressBarPage.h"
+#include "slider/SliderPage.h"
+
+#include <SkinnyFont.h>
+#include <SkinnyShortcut.h>
+#include <SkinnyShapeProvider.h>
+
+#include <QskFocusIndicator.h>
+#include <QskObjectCounter.h>
+#include <QskTabView.h>
+#include <QskWindow.h>
+
+#include <QGuiApplication>
+
+int main( int argc, char* argv[] )
+{
+#ifdef ITEM_STATISTICS
+    QskObjectCounter counter( true );
+#endif
+
+    Qsk::addGraphicProvider( "shapes", new SkinnyShapeProvider() );
+
+    QGuiApplication app( argc, argv );
+
+    SkinnyFont::init( &app );
+    SkinnyShortcut::enable( SkinnyShortcut::AllShortcuts );
+
+    auto tabView = new QskTabView();
+
+    tabView->setMargins( 10 );
+    tabView->setTabPosition( Qsk::Left );
+    tabView->setAutoFitTabs( true );
+
+    tabView->addTab( "Labels", new LabelPage() );
+    tabView->addTab( "Sliders", new SliderPage() );
+    tabView->addTab( "Progress\nBars", new ProgressBarPage() );
+
+    QSize size( 800, 600 );
+    size = size.expandedTo( tabView->sizeHint().toSize() );
+
+    QskWindow window;
+    window.addItem( tabView );
+    window.addItem( new QskFocusIndicator() );
+
+    window.resize( size );
+    window.show();
+
+    return app.exec();
+}

examples/gallery/progressbar/ProgressBarPage.cpp

@@ -0,0 +1,117 @@
+/******************************************************************************
+ * QSkinny - Copyright (C) 2016 Uwe Rathmann
+ * This file may be used under the terms of the 3-clause BSD License
+ *****************************************************************************/
+
+#include "ProgressBarPage.h"
+#include <QskProgressBar.h>
+#include <QskGraphicProvider.h>
+#include <QskGraphic.h>
+#include <QskGradient.h>
+#include <QskRgbPalette.h>
+#include <QskRgbValue.h>
+
+namespace
+{
+    class ProgressBar : public QskProgressBar
+    {   
+        public:
+            ProgressBar( QskLinearBox* box )
+                : QskProgressBar( box )
+            {   
+                setOrientation( ( box->orientation() == Qt::Horizontal )
+                    ? Qt::Vertical : Qt::Horizontal );
+                
+                setBoundaries( 0, 100 );
+            }
+            
+            void setTheme( QskRgbPalette::Theme theme )
+            {   
+                const auto pal = QskRgbPalette::palette( theme );
+                
+                QVector< QRgb > rgb;
+                rgb += pal.rgb( QskRgbPalette::W200 );
+                rgb += pal.rgb( QskRgbPalette::W400 );
+                rgb += pal.rgb( QskRgbPalette::W600 );
+                rgb += pal.rgb( QskRgbPalette::W900 );
+                
+                const auto stops = QskRgbPalette::colorStops( rgb, true );
+                
+                setBarGradient( QskGradient( orientation(), stops ) );
+            }
+    };
+}
+
+ProgressBarPage::ProgressBarPage( QQuickItem* parent )
+    : Page( Qt::Horizontal, parent )
+{
+    setGradient( QskRgbValue::AliceBlue );
+    setSpacing( 40 );
+
+    populate();
+}
+
+void ProgressBarPage::populate()
+{
+    auto hBox = new QskLinearBox( Qt::Horizontal, this );
+    hBox->setSizePolicy( Qt::Horizontal, QskSizePolicy::Fixed );
+    hBox->setSpacing( 20 );
+
+    {
+        auto bar = new ProgressBar( hBox );
+        bar->setValue( 35 );
+    }
+
+    {
+        auto bar = new ProgressBar( hBox );
+        bar->setTheme( QskRgbPalette::BlueGrey );
+        bar->setValue( 100 );
+    }
+
+    {
+        auto bar = new ProgressBar( hBox );
+        bar->setTheme( QskRgbPalette::Blue );
+        bar->setValue( 75 );
+    }
+
+    {
+        auto bar = new ProgressBar( hBox );
+        bar->setTheme( QskRgbPalette::Blue );
+        bar->setOrigin( 60 );
+        bar->setValue( 25 );
+    }
+
+    {
+        auto bar = new ProgressBar( hBox );
+        bar->setIndeterminate( true );
+    }
+
+    auto vBox = new QskLinearBox( Qt::Vertical, this );
+    vBox->setSpacing( 20 );
+    vBox->setExtraSpacingAt( Qt::BottomEdge );
+
+    {
+        auto bar = new ProgressBar( vBox );
+        bar->setTheme( QskRgbPalette::DeepOrange );
+        bar->setValue( 100 );
+    }
+
+    {
+        auto bar = new ProgressBar( vBox );
+        bar->setTheme( QskRgbPalette::Pink );
+        bar->setMaximum( 40 );
+        bar->setValue( 25 );
+    }
+
+    {
+        auto bar = new ProgressBar( vBox );
+        bar->setTheme( QskRgbPalette::Pink );
+        bar->setOrigin( 40 );
+        bar->setValue( 10 );
+    }
+
+    {
+        auto bar = new ProgressBar( vBox );
+        bar->setIndeterminate( true );
+    }
+}

examples/gallery/progressbar/ProgressBarPage.h

@@ -0,0 +1,20 @@
+/******************************************************************************
+ * QSkinny - Copyright (C) 2016 Uwe Rathmann
+ * This file may be used under the terms of the 3-clause BSD License
+ *****************************************************************************/
+
+#ifndef PROGRESS_BAR_PAGE_H
+#define PROGRESS_BAR_PAGE_H
+
+#include "Page.h"
+
+class ProgressBarPage : public Page
+{
+  public:
+    ProgressBarPage( QQuickItem* = nullptr );
+
+  private:
+    void populate();
+};
+
+#endif

examples/gallery/slider/CustomSlider.cpp

@@ -3,8 +3,8 @@
  * This file may be used under the terms of the 3-clause BSD License
  *****************************************************************************/
 
-#include "Slider.h"
-#include "SliderSkinlet.h"
+#include "CustomSlider.h"
+#include "CustomSliderSkinlet.h"
 
 #include <QskAnimationHint.h>
 #include <QskAspect.h>
@@ -12,10 +12,10 @@
 #include <QskGradient.h>
 #include <QskRgbValue.h>
 
-QSK_SUBCONTROL( Slider, Scale )
-QSK_SUBCONTROL( Slider, Decoration )
+QSK_SUBCONTROL( CustomSlider, Scale )
+QSK_SUBCONTROL( CustomSlider, Decoration )
 
-Slider::Slider( QQuickItem* parentItem )
+CustomSlider::CustomSlider( QQuickItem* parentItem )
     : QskSlider( parentItem )
 {
     using namespace QskAspect;
@@ -44,7 +44,7 @@ Slider::Slider( QQuickItem* parentItem )
 
     // using an individual skinlet, not known by the skin
 
-    auto skinlet = new SliderSkinlet();
+    auto skinlet = new CustomSliderSkinlet();
     skinlet->setOwnedBySkinnable( true );
 
     setSkinlet( skinlet );
@@ -53,7 +53,7 @@ Slider::Slider( QQuickItem* parentItem )
         this, &QskControl::focusIndicatorRectChanged );
 }
 
-QSizeF Slider::contentsSizeHint(
+QSizeF CustomSlider::contentsSizeHint(
     Qt::SizeHint which, const QSizeF& constraint ) const
 {
     auto size = Inherited::contentsSizeHint( which, constraint );
@@ -64,7 +64,7 @@ QSizeF Slider::contentsSizeHint(
     return size;
 }
 
-QRectF Slider::focusIndicatorRect() const
+QRectF CustomSlider::focusIndicatorRect() const
 {
     return subControlRect( QskSlider::Handle );
 }

examples/gallery/slider/CustomSlider.h

@@ -3,19 +3,19 @@
  * This file may be used under the terms of the 3-clause BSD License
  *****************************************************************************/
 
-#ifndef SLIDER_H
-#define SLIDER_H
+#ifndef CUSTOM_SLIDER_H
+#define CUSTOM_SLIDER_H
 
 #include <QskSlider.h>
 
-class Slider : public QskSlider
+class CustomSlider : public QskSlider
 {
     using Inherited = QskSlider;
 
   public:
     QSK_SUBCONTROLS( Scale, Decoration )
 
-    Slider( QQuickItem* parent = nullptr );
+    CustomSlider( QQuickItem* parent = nullptr );
 
     QRectF focusIndicatorRect() const override;
 

examples/gallery/slider/CustomSliderSkinlet.cpp

@@ -3,8 +3,8 @@
  * This file may be used under the terms of the 3-clause BSD License
  *****************************************************************************/
 
-#include "SliderSkinlet.h"
-#include "Slider.h"
+#include "CustomSliderSkinlet.h"
+#include "CustomSlider.h"
 
 #include <QskAspect.h>
 #include <QskRgbValue.h>
@@ -26,101 +26,101 @@ static const qreal qskMargin = 20;
 static const qreal qskPeak = 10;
 
 static QFont qskLabelFont;
+
 #endif
 
-class TicksNode : public QSGGeometryNode
+namespace
 {
-  public:
-    TicksNode( const QColor& color )
-        : m_geometry( QSGGeometry::defaultAttributes_Point2D(), 0 )
+    class TicksNode : public QSGGeometryNode
     {
-        m_geometry.setDrawingMode( GL_LINES );
-        m_geometry.setVertexDataPattern( QSGGeometry::StaticPattern );
-
-        m_material.setColor( color );
-
-        setGeometry( &m_geometry );
-        setMaterial( &m_material );
-    }
-
-  private:
-    QSGFlatColorMaterial m_material;
-    QSGGeometry m_geometry;
-};
-
-class HandleNode : public QSGGeometryNode
-{
-  public:
-    HandleNode()
-        : m_geometry( QSGGeometry::defaultAttributes_Point2D(), 8 * 2 )
-    {
-        setGeometry( &m_geometry );
-        setMaterial( &m_material );
-    }
-
-    void update( const QRectF& rect, qreal peakPos, const QColor& color )
-    {
-        if ( color != m_color )
+      public:
+        TicksNode( const QColor& color )
+            : m_geometry( QSGGeometry::defaultAttributes_Point2D(), 0 )
         {
+            m_geometry.setDrawingMode( GL_LINES );
+            m_geometry.setVertexDataPattern( QSGGeometry::StaticPattern );
+
             m_material.setColor( color );
 
-            m_color = color;
-            markDirty( QSGNode::DirtyMaterial );
+            setGeometry( &m_geometry );
+            setMaterial( &m_material );
         }
 
-        if ( rect != m_rect || peakPos != m_peakPos )
-        {
-            auto p = reinterpret_cast< QSGGeometry::Point2D* >( m_geometry.vertexData() );
+      private:
+        QSGFlatColorMaterial m_material;
+        QSGGeometry m_geometry;
+    };
 
-            const qreal y0 = rect.y() + qskPeak;
-
-            setLine( p, peakPos, peakPos, rect.y() );
-            setLine( p + 2, peakPos - 5, peakPos + 5, y0 );
-
-            // corners manually "rounded" by 3 pixels
-
-            setLine( p + 4, rect.left() + 2, rect.right() - 2, y0 );
-            setLine( p + 6, rect.left() + 1, rect.right() - 1, y0 + 1 );
-            setLine( p + 8, rect.left(), rect.right(), y0 + 2 );
-            setLine( p + 10, rect.left(), rect.right(), rect.bottom() - 1 );
-            setLine( p + 12, rect.left() + 1, rect.right() - 1, rect.bottom() - 1 );
-            setLine( p + 14, rect.left() + 2, rect.right() - 2, rect.bottom() );
-
-            m_rect = rect;
-            m_peakPos = peakPos;
-            markDirty( QSGNode::DirtyGeometry );
-        }
-    }
-
-  private:
-    inline void setLine( QSGGeometry::Point2D* points, float x1, float x2, qreal y )
+    class HandleNode : public QSGGeometryNode
     {
-        points[ 0 ].x = x1;
-        points[ 0 ].y = y;
+      public:
+        HandleNode()
+            : m_geometry( QSGGeometry::defaultAttributes_Point2D(), 8 * 2 )
+        {
+            setGeometry( &m_geometry );
+            setMaterial( &m_material );
+        }
 
-        points[ 1 ].x = x2;
-        points[ 1 ].y = y;
-    }
+        void update( const QRectF& rect, qreal peakPos, const QColor& color )
+        {
+            if ( color != m_color )
+            {
+                m_material.setColor( color );
 
-    QRectF m_rect;
-    qreal m_peakPos;
-    QColor m_color;
+                m_color = color;
+                markDirty( QSGNode::DirtyMaterial );
+            }
 
-    QSGFlatColorMaterial m_material;
-    QSGGeometry m_geometry;
-};
+            if ( rect != m_rect || peakPos != m_peakPos )
+            {
+                auto p = reinterpret_cast< QSGGeometry::Point2D* >( m_geometry.vertexData() );
 
-SliderSkinlet::SliderSkinlet()
+                const qreal y0 = rect.y() + qskPeak;
+
+                setLine( p, peakPos, peakPos, rect.y() );
+                setLine( p + 2, peakPos - 5, peakPos + 5, y0 );
+
+                // corners manually "rounded" by 3 pixels
+
+                setLine( p + 4, rect.left() + 2, rect.right() - 2, y0 );
+                setLine( p + 6, rect.left() + 1, rect.right() - 1, y0 + 1 );
+                setLine( p + 8, rect.left(), rect.right(), y0 + 2 );
+                setLine( p + 10, rect.left(), rect.right(), rect.bottom() - 1 );
+                setLine( p + 12, rect.left() + 1, rect.right() - 1, rect.bottom() - 1 );
+                setLine( p + 14, rect.left() + 2, rect.right() - 2, rect.bottom() );
+
+                m_rect = rect;
+                m_peakPos = peakPos;
+                markDirty( QSGNode::DirtyGeometry );
+            }
+        }
+
+      private:
+        inline void setLine( QSGGeometry::Point2D* points, float x1, float x2, qreal y )
+        {
+            points[ 0 ].x = x1;
+            points[ 0 ].y = y;
+
+            points[ 1 ].x = x2;
+            points[ 1 ].y = y;
+        }
+
+        QRectF m_rect;
+        qreal m_peakPos;
+        QColor m_color;
+
+        QSGFlatColorMaterial m_material;
+        QSGGeometry m_geometry;
+    };
+}
+
+CustomSliderSkinlet::CustomSliderSkinlet()
 {
     qskLabelFont = QFont();
     setNodeRoles( { ScaleRole, FillRole, DecorationRole, HandleRole } );
 }
 
-SliderSkinlet::~SliderSkinlet()
-{
-}
-
-QRectF SliderSkinlet::subControlRect( const QskSkinnable* skinnable,
+QRectF CustomSliderSkinlet::subControlRect( const QskSkinnable* skinnable,
     const QRectF& contentsRect, QskAspect::Subcontrol subControl ) const
 {
     const auto slider = static_cast< const QskSlider* >( skinnable );
@@ -137,11 +137,11 @@ QRectF SliderSkinlet::subControlRect( const QskSkinnable* skinnable,
     {
         return handleRect( slider, contentsRect );
     }
-    else if ( subControl == Slider::Scale )
+    else if ( subControl == CustomSlider::Scale )
     {
         return scaleRect( contentsRect );
     }
-    else if ( subControl == Slider::Decoration )
+    else if ( subControl == CustomSlider::Decoration )
     {
         return decorationRect( slider, contentsRect );
     }
@@ -149,7 +149,7 @@ QRectF SliderSkinlet::subControlRect( const QskSkinnable* skinnable,
     return Inherited::subControlRect( skinnable, contentsRect, subControl );
 }
 
-QSGNode* SliderSkinlet::updateSubNode(
+QSGNode* CustomSliderSkinlet::updateSubNode(
     const QskSkinnable* skinnable, quint8 nodeRole, QSGNode* node ) const
 {
     const auto slider = static_cast< const QskSlider* >( skinnable );
@@ -173,7 +173,7 @@ QSGNode* SliderSkinlet::updateSubNode(
     }
 }
 
-QRectF SliderSkinlet::scaleRect( const QRectF& contentsRect ) const
+QRectF CustomSliderSkinlet::scaleRect( const QRectF& contentsRect ) const
 {
     auto r = contentsRect;
 
@@ -185,10 +185,10 @@ QRectF SliderSkinlet::scaleRect( const QRectF& contentsRect ) const
     return r;
 }
 
-QRectF SliderSkinlet::fillRect(
+QRectF CustomSliderSkinlet::fillRect(
     const QskSlider* slider, const QRectF& contentsRect ) const
 {
-    auto r = subControlRect( slider, contentsRect, Slider::Scale );
+    auto r = subControlRect( slider, contentsRect, CustomSlider::Scale );
 
     r.setTop( r.bottom() - qskMinorTick );
     r.setWidth( r.width() * slider->valueAsRatio() );
@@ -196,23 +196,23 @@ QRectF SliderSkinlet::fillRect(
     return r;
 }
 
-QRectF SliderSkinlet::decorationRect(
+QRectF CustomSliderSkinlet::decorationRect(
     const QskSlider* slider, const QRectF& contentsRect ) const
 {
     // decoration exceeds scale !!!!
 
-    auto r = subControlRect( slider, contentsRect, Slider::Scale );
+    auto r = subControlRect( slider, contentsRect, CustomSlider::Scale );
     r.setBottom( r.top() );
     r.setTop( r.bottom() - QFontMetricsF( qskLabelFont ).height() );
 
     return r;
 }
 
-QRectF SliderSkinlet::handleRect(
+QRectF CustomSliderSkinlet::handleRect(
     const QskSlider* slider, const QRectF& contentsRect ) const
 {
     const QRectF fillRect = subControlRect( slider, contentsRect, QskSlider::Fill );
-    const QRectF scaleRect = subControlRect( slider, contentsRect, Slider::Scale );
+    const QRectF scaleRect = subControlRect( slider, contentsRect, CustomSlider::Scale );
 
     QRectF handleRect( 0, scaleRect.bottom(), 80, 50 );
     handleRect.moveCenter( QPointF( fillRect.right(), handleRect.center().y() ) );
@@ -225,18 +225,18 @@ QRectF SliderSkinlet::handleRect(
     return handleRect;
 }
 
-QSGNode* SliderSkinlet::updateScaleNode(
+QSGNode* CustomSliderSkinlet::updateScaleNode(
     const QskSlider* slider, QSGNode* node ) const
 {
     const auto scaleRect = subControlRect(
-        slider, slider->contentsRect(), Slider::Scale );
+        slider, slider->contentsRect(), CustomSlider::Scale );
 
     if ( scaleRect.isEmpty() )
         return nullptr;
 
     auto ticksNode = static_cast< TicksNode* >( node );
     if ( ticksNode == nullptr )
-        ticksNode = new TicksNode( slider->color( Slider::Scale ) );
+        ticksNode = new TicksNode( slider->color( CustomSlider::Scale ) );
 
     const int tickCount = std::floor( slider->boundaryLength() / slider->stepSize() ) + 1;
 
@@ -268,11 +268,11 @@ QSGNode* SliderSkinlet::updateScaleNode(
     return ticksNode;
 }
 
-QSGNode* SliderSkinlet::updateDecorationNode(
+QSGNode* CustomSliderSkinlet::updateDecorationNode(
     const QskSlider* slider, QSGNode* node ) const
 {
     const QRectF decorationRect = subControlRect(
-        slider, slider->contentsRect(), Slider::Decoration );
+        slider, slider->contentsRect(), CustomSlider::Decoration );
 
     if ( decorationRect.isEmpty() )
         return nullptr;
@@ -320,7 +320,7 @@ QSGNode* SliderSkinlet::updateDecorationNode(
     return decorationNode;
 }
 
-QSGNode* SliderSkinlet::updateHandleNode(
+QSGNode* CustomSliderSkinlet::updateHandleNode(
     const QskSlider* slider, QSGNode* node ) const
 {
     const QRectF handleRect = subControlRect(

examples/gallery/slider/CustomSliderSkinlet.h

@@ -3,14 +3,14 @@
  * This file may be used under the terms of the 3-clause BSD License
  *****************************************************************************/
 
-#ifndef SLIDER_SKINLET_H
-#define SLIDER_SKINLET_H
+#ifndef CUSTOM_SLIDER_SKINLET_H
+#define CUSTOM_SLIDER_SKINLET_H
 
 #include <QskSliderSkinlet.h>
 
 class QSGTransformNode;
 
-class SliderSkinlet : public QskSliderSkinlet
+class CustomSliderSkinlet : public QskSliderSkinlet
 {
     using Inherited = QskSliderSkinlet;
 
@@ -22,8 +22,7 @@ class SliderSkinlet : public QskSliderSkinlet
         DecorationRole
     };
 
-    SliderSkinlet();
-    ~SliderSkinlet() override;
+    CustomSliderSkinlet();
 
     QRectF subControlRect( const QskSkinnable*,
         const QRectF&, QskAspect::Subcontrol ) const override;

examples/gallery/slider/OtherSlider.cpp

@@ -0,0 +1,86 @@
+/******************************************************************************
+ * QSkinny - Copyright (C) 2016 Uwe Rathmann
+ * This file may be used under the terms of the 3-clause BSD License
+ *****************************************************************************/
+
+#include "OtherSlider.h"
+
+#include <QskAspect.h>
+#include <QskRgbValue.h>
+#include <QskBoxShapeMetrics.h>
+#include <QskBoxBorderMetrics.h>
+#include <QskBoxBorderColors.h>
+
+#include <cmath>
+
+OtherSlider::OtherSlider( QQuickItem* parentItem )
+    : QskSlider( parentItem )
+{
+    using namespace QskAspect;
+    using namespace QskRgbValue;
+
+    const qreal h = 30;
+    const qreal w = 2.0 * h;
+    const qreal paddingW = 0.5 * w + 1;
+
+    // Panel
+
+    for ( auto placement : { Horizontal, Vertical } )
+    {
+        const Aspect aspect = Panel | placement;
+
+        setMetric( aspect | Size, h );
+        setBoxShapeHint( aspect, 4 );
+        setBoxBorderMetricsHint( aspect, 1 );
+        setBoxBorderColorsHint( aspect, Grey900 );
+        setGradientHint( aspect, Grey400 );
+
+        if ( placement == Horizontal )
+            setMarginsHint( aspect | Padding, QMarginsF( paddingW, 0, paddingW, 0 ) );
+        else
+            setMarginsHint( aspect | Padding, QMarginsF( 0, paddingW, 0, paddingW ) );
+    }
+
+    // Groove
+
+    for ( auto placement : { Horizontal, Vertical } )
+    {
+        const Aspect aspect = Groove | placement;
+
+        setMetric( aspect | Size, 4 );
+        setBoxBorderMetricsHint( aspect, 0 );
+        setBoxShapeHint( aspect, 1 );
+
+        setGradientHint( aspect, Qt::black );
+    }
+
+    // no Fill
+    for ( auto placement : { Horizontal, Vertical } )
+    {
+        const Aspect aspect = Fill | placement;
+        setMetric( aspect | Size, 0 );
+    }
+
+    // Handle
+
+    for ( auto placement : { Horizontal, Vertical } )
+    {
+        const Aspect aspect = Handle | placement;
+
+        setBoxBorderMetricsHint( aspect, 1 );
+        setBoxShapeHint( aspect, 4 );
+
+        const qreal m = 0.5 * std::ceil( 0.5 * ( w - h ) ) + 1;
+
+        if ( placement == Horizontal )
+            setMarginsHint( aspect | Margin, QMarginsF( -m, 0, -m, 0 ) );
+        else
+            setMarginsHint( aspect | Margin, QMarginsF( 0, -m, 0, -m ) );
+
+        for ( auto state : { NoState, Pressed } )
+        {
+            setBoxBorderColorsHint( aspect | state, Grey600 );
+            setGradientHint( aspect | state, Blue400 );
+        }
+    }
+}

examples/gallery/slider/OtherSlider.h

@@ -0,0 +1,19 @@
+/******************************************************************************
+ * QSkinny - Copyright (C) 2016 Uwe Rathmann
+ * This file may be used under the terms of the 3-clause BSD License
+ *****************************************************************************/
+
+#ifndef OTHER_SLIDER_H
+#define OTHER_SLIDER_H
+
+#include <QskSlider.h>
+
+class OtherSlider : public QskSlider
+{
+  public:
+    // Slider overriding many hints from the skin.
+
+    OtherSlider( QQuickItem* = nullptr );
+};
+
+#endif

examples/gallery/slider/SliderPage.cpp

@@ -0,0 +1,89 @@
+/******************************************************************************
+ * QSkinny - Copyright (C) 2016 Uwe Rathmann
+ * This file may be used under the terms of the 3-clause BSD License
+ *****************************************************************************/
+
+#include "SliderPage.h"
+#include "CustomSlider.h"
+#include "OtherSlider.h"
+
+#include <QskRgbValue.h>
+
+SliderPage::SliderPage( QQuickItem* parentItem )
+    : Page( Qt::Vertical, parentItem )
+{
+    setGradient( QskRgbValue::PeachPuff );
+
+    setMargins( 10 );
+    setSpacing( 20 );
+
+    populate();
+
+    const auto sliders = findChildren< QskSlider* >();
+
+    for ( auto slider : sliders )
+    {
+        slider->setLayoutAlignmentHint( Qt::AlignCenter );
+
+        slider->setValue( slider->minimum() +
+            0.5 * ( slider->maximum() - slider->minimum() ) );
+#if 0
+        connect( slider, &QskSlider::valueChanged,
+            []( qreal value ) { qDebug() << value; } );
+#endif
+    }
+}
+
+void SliderPage::populate()
+{
+    {
+        auto slider = new QskSlider( this );
+
+        slider->setMinimum( 0 );
+        slider->setMaximum( 1000 );
+        slider->setPageSize( 10 );
+        slider->setStepSize( 10 );
+        slider->setSnap( true );
+    }
+
+    {
+        auto slider = new OtherSlider( this );
+
+        slider->setMinimum( 0 );
+        slider->setMaximum( 10 );
+        slider->setStepSize( 1 );
+    }
+
+
+    auto hBox = new QskLinearBox( Qt::Horizontal, this );
+
+    {
+        auto slider = new QskSlider( Qt::Vertical, hBox );
+        
+        slider->setMinimum( 0 ); 
+        slider->setMaximum( 1000 );
+        slider->setPageSize( 10 );
+        slider->setStepSize( 10 );
+        slider->setSnap( true );
+    }
+
+    {
+        auto slider = new OtherSlider( hBox );
+        slider->setOrientation( Qt::Vertical );
+        
+        slider->setMinimum( 0 );
+        slider->setMaximum( 10 );
+        slider->setStepSize( 1 );
+    }
+
+    {
+        auto slider = new CustomSlider( this );
+
+        slider->setMargins( QMarginsF( 0, 15, 0, 15 ) );
+        slider->setSnap( true );
+        slider->setMinimum( 0 );
+        slider->setMaximum( 2000 );
+        slider->setStepSize( 10 );
+        slider->setPageSize( 10 );
+    }
+}

examples/gallery/slider/SliderPage.h

@@ -0,0 +1,20 @@
+/******************************************************************************
+ * QSkinny - Copyright (C) 2016 Uwe Rathmann
+ * This file may be used under the terms of the 3-clause BSD License
+ *****************************************************************************/
+
+#ifndef SLIDER_PAGE_H
+#define SLIDER_PAGE_H
+
+#include "Page.h"
+
+class SliderPage : public Page
+{
+  public:
+    SliderPage( QQuickItem* = nullptr );
+
+  private:
+    void populate();
+};
+
+#endif

examples/sliders/main.cpp

@@ -1,223 +0,0 @@
-/******************************************************************************
- * QSkinny - Copyright (C) 2016 Uwe Rathmann
- * This file may be used under the terms of the 3-clause BSD License
- *****************************************************************************/
-
-#include "Slider.h"
-
-#include <SkinnyFont.h>
-#include <SkinnyShortcut.h>
-
-#include <QskAspect.h>
-#include <QskBoxBorderColors.h>
-#include <QskBoxBorderMetrics.h>
-#include <QskBoxShapeMetrics.h>
-#include <QskFocusIndicator.h>
-#include <QskLinearBox.h>
-#include <QskObjectCounter.h>
-#include <QskPushButton.h>
-#include <QskRgbValue.h>
-#include <QskSeparator.h>
-#include <QskSlider.h>
-#include <QskWindow.h>
-
-#include <QGuiApplication>
-#include <QtMath>
-
-class OtherSlider : public QskSlider
-{
-  public:
-    // Slider overriding many hints from the skin.
-
-    OtherSlider( QQuickItem* parentItem = nullptr )
-        : QskSlider( parentItem )
-    {
-        using namespace QskAspect;
-        using namespace QskRgbValue;
-
-        const qreal h = 30;
-        const qreal w = 2.0 * h;
-        const qreal paddingW = 0.5 * w + 1;
-
-        // Panel
-
-        for ( auto placement : { Horizontal, Vertical } )
-        {
-            const Aspect aspect = Panel | placement;
-
-            setMetric( aspect | Size, h );
-            setBoxShapeHint( aspect, 4 );
-            setBoxBorderMetricsHint( aspect, 1 );
-            setBoxBorderColorsHint( aspect, Grey900 );
-            setGradientHint( aspect, Grey400 );
-
-            if ( placement == Horizontal )
-                setMarginsHint( aspect | Padding, QMarginsF( paddingW, 0, paddingW, 0 ) );
-            else
-                setMarginsHint( aspect | Padding, QMarginsF( 0, paddingW, 0, paddingW ) );
-        }
-
-        // Groove
-
-        for ( auto placement : { Horizontal, Vertical } )
-        {
-            const Aspect aspect = Groove | placement;
-
-            setMetric( aspect | Size, 4 );
-            setBoxBorderMetricsHint( aspect, 0 );
-            setBoxShapeHint( aspect, 1 );
-
-            setGradientHint( aspect, Qt::black );
-        }
-
-        // no Fill
-        for ( auto placement : { Horizontal, Vertical } )
-        {
-            const Aspect aspect = Fill | placement;
-            setMetric( aspect | Size, 0 );
-        }
-
-        // Handle
-
-        for ( auto placement : { Horizontal, Vertical } )
-        {
-            const Aspect aspect = Handle | placement;
-
-            setBoxBorderMetricsHint( aspect, 1 );
-            setBoxShapeHint( aspect, 4 );
-
-            const qreal m = 0.5 * qCeil( 0.5 * ( w - h ) ) + 1;
-
-            if ( placement == Horizontal )
-                setMarginsHint( aspect | Margin, QMarginsF( -m, 0, -m, 0 ) );
-            else
-                setMarginsHint( aspect | Margin, QMarginsF( 0, -m, 0, -m ) );
-
-            for ( auto state : { NoState, Pressed } )
-            {
-                setBoxBorderColorsHint( aspect | state, Grey600 );
-                setGradientHint( aspect | state, Blue400 );
-            }
-        }
-    }
-};
-
-class SliderBox : public QskLinearBox
-{
-  public:
-    SliderBox( QQuickItem* parentItem = nullptr )
-        : QskLinearBox( Qt::Vertical, parentItem )
-    {
-        auto slider = new QskSlider( this );
-        slider->setMinimum( 0 );
-        slider->setMaximum( 1000 );
-        slider->setPageSize( 10 );
-        slider->setStepSize( 10 );
-        slider->setSnap( true );
-
-        ( void ) new QskSeparator( Qt::Horizontal, this );
-
-        auto otherSlider = new OtherSlider( this );
-
-        otherSlider->setMinimum( 0 );
-        otherSlider->setMaximum( 10 );
-        otherSlider->setStepSize( 1 );
-
-        auto customSlider = new Slider( this );
-        customSlider->setMargins( QMarginsF( 0, 15, 0, 15 ) );
-        customSlider->setSnap( true );
-        customSlider->setMinimum( 0 );
-        customSlider->setMaximum( 2000 );
-        customSlider->setStepSize( 10 );
-        customSlider->setPageSize( 10 );
-
-        for ( int i = 0; i < count(); i++ )
-        {
-            if ( auto slider = qobject_cast< QskSlider* >( itemAtIndex( i ) ) )
-            {
-                slider->setObjectName( "Slider " + QString::number( i + 1 ) );
-                slider->setValue( slider->minimum() +
-                    0.5 * ( slider->maximum() - slider->minimum() ) );
-#if 0
-                connect( slider, &QskSlider::valueChanged,
-                    []( qreal value ) { qDebug() << value; } );
-#endif
-                slider->setLayoutAlignmentHint( Qt::AlignCenter );
-            }
-        }
-    }
-
-    void flip()
-    {
-        setOrientation( inverted( orientation() ) );
-
-        for ( int i = 0; i < count(); i++ )
-        {
-            if ( auto slider = qobject_cast< QskSlider* >( itemAtIndex( i ) ) )
-            {
-                const Qt::Orientation orientation = inverted( slider->orientation() );
-
-                slider->setOrientation( orientation );
-
-                if ( i >= count() - 1 )
-                {
-                    // we didn't implement the vertical mode of the heavily
-                    // customized slider yet.
-
-                    slider->setVisible( orientation == Qt::Horizontal );
-                }
-            }
-            else if ( auto separator = qobject_cast< QskSeparator* >( itemAtIndex( i ) ) )
-            {
-                separator->setOrientation( inverted( separator->orientation() ) );
-            }
-        }
-    }
-
-  private:
-    Qt::Orientation inverted( Qt::Orientation orientation ) const
-    {
-        return ( orientation == Qt::Horizontal ) ? Qt::Vertical : Qt::Horizontal;
-    }
-};
-
-int main( int argc, char* argv[] )
-{
-#ifdef ITEM_STATISTICS
-    QskObjectCounter counter( true );
-#endif
-
-    QGuiApplication app( argc, argv );
-
-    SkinnyFont::init( &app );
-    SkinnyShortcut::enable( SkinnyShortcut::AllShortcuts );
-
-    auto buttonFlip = new QskPushButton( "Flip" );
-    buttonFlip->setSizePolicy( Qt::Horizontal, QskSizePolicy::Fixed );
-    buttonFlip->setFocus( true );
-
-    auto sliderBox = new SliderBox();
-    sliderBox->setBackgroundColor( QskRgbValue::PeachPuff );
-
-    QObject::connect( buttonFlip, &QskPushButton::clicked,
-        sliderBox, &SliderBox::flip );
-
-    auto mainBox = new QskLinearBox( Qt::Vertical );
-    mainBox->setDefaultAlignment( Qt::AlignLeft );
-    mainBox->setMargins( 10 );
-    mainBox->setSpacing( 10 );
-    mainBox->addItem( buttonFlip );
-    mainBox->addItem( sliderBox );
-    mainBox->setStretchFactor( sliderBox, 10 );
-
-    auto focusIndicator = new QskFocusIndicator();
-    focusIndicator->setObjectName( "FocusIndicator" );
-
-    QskWindow window;
-    window.addItem( mainBox );
-    window.addItem( focusIndicator );
-    window.resize( 800, qMax( 480, int( mainBox->sizeHint().height() + 0.5 ) ) );
-    window.show();
-
-    return app.exec();
-}

examples/sliders/sliders.pro

@@ -1,10 +0,0 @@
-CONFIG += qskexample
-
-SOURCES += \
-    Slider.cpp \
-    SliderSkinlet.cpp \
-    main.cpp
-
-HEADERS += \
-    Slider.h \
-    SliderSkinlet.h

examples/tlabels/main.cpp

@@ -1,59 +0,0 @@
-/******************************************************************************
- * QSkinny - Copyright (C) 2016 Uwe Rathmann
- * This file may be used under the terms of the 3-clause BSD License
- *****************************************************************************/
-
-#include <SkinnyFont.h>
-#include <SkinnyShortcut.h>
-
-#include <QskLinearBox.h>
-#include <QskObjectCounter.h>
-#include <QskTextLabel.h>
-#include <QskWindow.h>
-
-#include <QGuiApplication>
-
-class TextBox : public QskLinearBox
-{
-  public:
-    TextBox( QQuickItem* parent = nullptr )
-        : QskLinearBox( Qt::Vertical, 3, parent )
-    {
-        setMargins( 10 );
-        setDefaultAlignment( Qt::AlignTop );
-        setExtraSpacingAt( Qt::BottomEdge );
-
-        const QStringList texts =
-            { "Default", "Tiny", "Small", "Medium", "Large", "Huge" };
-
-        for ( int i = 0; i < texts.size(); i++ )
-        {
-            auto label = new QskTextLabel( texts[ i ] + " Font", this );
-            label->setPanel( true );
-            label->setFontRole( i );
-        }
-    }
-};
-
-int main( int argc, char* argv[] )
-{
-#ifdef ITEM_STATISTICS
-    QskObjectCounter counter( true );
-#endif
-
-    QGuiApplication app( argc, argv );
-
-    SkinnyFont::init( &app );
-    SkinnyShortcut::enable( SkinnyShortcut::AllShortcuts );
-
-    auto box = new TextBox();
-
-    QskWindow window;
-    window.setColor( Qt::lightGray );
-    window.addItem( box );
-    window.resize( box->sizeHint().toSize() );
-
-    window.show();
-
-    return app.exec();
-}

examples/tlabels/tlabels.pro

@@ -1,4 +0,0 @@
-CONFIG += qskexample
-
-SOURCES += \
-    main.cpp