add tickmarks

examples/iotdashboard/LightDisplay.cpp

@@ -14,6 +14,7 @@
 QSK_SUBCONTROL( LightDisplay, Panel )
 QSK_SUBCONTROL( LightDisplay, Groove )
 QSK_SUBCONTROL( LightDisplay, ColdAndWarmArc )
+QSK_SUBCONTROL( LightDisplay, Tickmarks )
 QSK_SUBCONTROL( LightDisplay, ValueText )
 QSK_SUBCONTROL( LightDisplay, LeftLabel )
 QSK_SUBCONTROL( LightDisplay, RightLabel )
@@ -104,7 +105,6 @@ void LightDisplay::mouseMoveEvent( QMouseEvent* event )
 
     const QskArcMetrics metrics = arcMetricsHint( ColdAndWarmArc );
     const qreal angle = angleFromPoint( rect, mousePos );
-    qDebug() << "angle:" << angle;
     const qreal ratio = ( metrics.spanAngle() - angle * 16 ) / metrics.spanAngle();
     setValueAsRatio( ratio );
 }
@@ -149,7 +149,6 @@ bool LightDisplay::arcContainsPoint( const QRectF& rect, const QPointF& point )
     const bool pointOnArc = ( polarRadius + tolerance ) > radiusMin
             && ( polarRadius - tolerance ) < radiusMax;
 
-    qDebug() << angleWithinRange << angle << pointOnArc;
     bool ret = angleWithinRange && pointOnArc;
 
     return ret;

examples/iotdashboard/LightDisplay.h

@@ -14,8 +14,8 @@ class LightDisplay : public QskBoundedValueInput
     Q_OBJECT
 
   public:
-    QSK_SUBCONTROLS( Panel, Groove, ColdAndWarmArc, ValueText, LeftLabel,
+    QSK_SUBCONTROLS( Panel, Groove, ColdAndWarmArc, Tickmarks, ValueText,
-                     RightLabel, Knob ) // ### rename knob to handle?
+                     LeftLabel, RightLabel, Knob ) // ### rename knob to handle?
     QSK_STATES( Pressed )
 
     LightDisplay( QQuickItem* parent = nullptr );

examples/iotdashboard/LightDisplaySkinlet.cpp

@@ -17,8 +17,8 @@
 LightDisplaySkinlet::LightDisplaySkinlet( QskSkin* skin )
     : QskSkinlet( skin )
 {
-    setNodeRoles( { GrooveRole, PanelRole, ColdAndWarmArcRole, ValueTextRole,
+    setNodeRoles( { GrooveRole, PanelRole, ColdAndWarmArcRole, TickmarksRole,
-                    LeftLabelRole, RightLabelRole, KnobRole } );
+                    ValueTextRole, LeftLabelRole, RightLabelRole, KnobRole } );
 }
 
 LightDisplaySkinlet::~LightDisplaySkinlet()
@@ -37,11 +37,12 @@ QRectF LightDisplaySkinlet::subControlRect( const QskSkinnable* skinnable,
     {
         QSizeF textSize = textLabelsSize( display );
         QskArcMetrics arcMetrics = display->arcMetricsHint( LightDisplay::ColdAndWarmArc );
+        const qreal ticksWidth = display->metric( LightDisplay::Tickmarks );
 
-        const qreal x = textSize.width() + arcMetrics.width();
+        const qreal x = textSize.width() + arcMetrics.width() + ticksWidth;
-        const qreal w = contentsRect.width() - ( 2 * ( textSize.width() + arcMetrics.width() ) );
+        const qreal w = contentsRect.width() - ( 2 * ( textSize.width() + arcMetrics.width() + ticksWidth ) );
-        const qreal y = arcMetrics.width();
+        const qreal y = arcMetrics.width() + ticksWidth;
-        const qreal h = contentsRect.height() - 2 * arcMetrics.width();
+        const qreal h = contentsRect.height() - 2 * ( arcMetrics.width() + ticksWidth );
 
         const qreal diameter = qMin( w, h );
 
@@ -56,28 +57,34 @@ QRectF LightDisplaySkinlet::subControlRect( const QskSkinnable* skinnable,
         auto rect = panelRect.marginsAdded( { barWidth, barWidth, barWidth, barWidth } );
         return rect;
     }
+    else if( subControl == LightDisplay::Tickmarks )
+    {
+        const QRectF arcRect = subControlRect( skinnable, contentsRect,
+                                                 LightDisplay::ColdAndWarmArc );
+        auto tickWidth = display->metric( LightDisplay::Tickmarks );
+        auto rect = arcRect.marginsAdded( { tickWidth, tickWidth, tickWidth, tickWidth } );
+        return rect;
+    }
     else if( subControl == LightDisplay::LeftLabel )
     {
-        // ### rename to panelRect?
+        const QRectF ticksRect = subControlRect( skinnable, contentsRect, LightDisplay::Tickmarks );
-        const QRectF grooveRect = subControlRect( skinnable, contentsRect,
-                                                  LightDisplay::Groove );
         QSizeF size = textLabelsSize( display );
 
         rect.setWidth( size.width() );
 
-        rect.setY( grooveRect.y() + ( grooveRect.height() - size.height() ) / 2 );
+        rect.setY( ticksRect.y() + ( ticksRect.height() - size.height() ) / 2 );
         rect.setHeight( size.height() );
 
         return rect;
     }
     else if( subControl == LightDisplay::RightLabel )
     {
-        QRectF arcRect = subControlRect( skinnable, contentsRect, LightDisplay::ColdAndWarmArc );
+        QRectF ticksRect = subControlRect( skinnable, contentsRect, LightDisplay::Tickmarks );
         QSizeF size = textLabelsSize( display );
 
-        rect.setX( arcRect.x() + arcRect.width() );
+        rect.setX( ticksRect.x() + ticksRect.width() );
 
-        rect.setY( arcRect.y() + ( arcRect.height() - size.height() ) / 2 );
+        rect.setY( ticksRect.y() + ( ticksRect.height() - size.height() ) / 2 );
         rect.setHeight( size.height() );
 
         return rect;
@@ -142,6 +149,10 @@ QSGNode* LightDisplaySkinlet::updateSubNode(
         {
             return updateArcNode( skinnable, node, LightDisplay::ColdAndWarmArc );
         }
+        case TickmarksRole:
+        {
+            return nullptr;
+        }
         case ValueTextRole:
         {
             const QString valueText = QString::number( display->value(), 'f', 0 )

examples/iotdashboard/LightDisplaySkinlet.h

@@ -22,6 +22,7 @@ class LightDisplaySkinlet : public QskSkinlet
         GrooveRole,
         ColdAndWarmArcRole,
         WarmPartRole,
+        TickmarksRole,
         ValueTextRole,
         LeftLabelRole,
         RightLabelRole,

examples/iotdashboard/Skin.cpp

@@ -192,6 +192,8 @@ void Skin::initHints( const Palette& palette )
                                                 { 1.0, Qt::black } } );
     ed.setGradient( LightDisplay::ColdAndWarmArc, coldGradient );
 
+    ed.setMetric( LightDisplay::Tickmarks, 4.69 );
+
     ed.setFontRole( LightDisplay::ValueText, QskSkin::LargeFont );
     ed.setColor( LightDisplay::ValueText, "#929cb2" );