Index: sources/gui/qml/components/RangeSlider.qml
===================================================================
diff -u -r7c0ce7b22e164bbe37eb47fb56e74cc29a8f4c38 -rccb91da4becded9a7ad409b758bba96784d9feba
--- sources/gui/qml/components/RangeSlider.qml	(.../RangeSlider.qml)	(revision 7c0ce7b22e164bbe37eb47fb56e74cc29a8f4c38)
+++ sources/gui/qml/components/RangeSlider.qml	(.../RangeSlider.qml)	(revision ccb91da4becded9a7ad409b758bba96784d9feba)
@@ -36,10 +36,15 @@
 
     property alias  lowerText   : _rangeRect.minText
     property alias  upperText   : _rangeRect.maxText
+    property alias  lowerTextHorizontalCenter: _rangeRect.minTextHorizontalCenter
+    property alias  upperTextHorizontalCenter: _rangeRect.maxTextHorizontalCenter
 
     property alias  minValue    : _rangeRect.lowerBound             ///< value of the minimum slider handler
     property alias  maxValue    : _rangeRect.upperBound             ///< value of the maximum slider handler
 
+    property bool   maxVerticalEdgeVisible: true
+    property bool   minVerticalEdgeVisible: true
+
     property int    gapValue    : 0                                 ///< the gap between minValue and maxValue so the minValue shall always be gap value less than maxValue and vise versa.
     property real   minValueLowerBound    : _root.minimum           ///< min value can't be lower  than this value
     property real   minValueUpperBound    : _root.maximum           ///< min value can't be higher than this value
@@ -60,7 +65,18 @@
 
     property bool   minAdjusted : false                             ///< first time user adjustment happens
     property bool   maxAdjusted : false                             ///< first time user adjustment happens
+    property bool   hasAdjusted : false                             ///< if set to true then component is grayed out until both min and max are adjusted
 
+    onHasAdjustedChanged: {
+        setAdjusted()
+    }
+    onMinAdjustedChanged: {
+        setAdjusted()
+    }
+    onMaxAdjustedChanged: {
+        setAdjusted()
+    }
+
     /// root attributes
     clip            :  false
 
@@ -109,6 +125,27 @@
         font.bold        : false
     }
 
+    ///
+    /// \brief   grays out the rangebar and handler if not adjusted and hasAdjusted set to true
+    ///
+    function setAdjusted() {
+        function check() {
+            _rangeRect   .color = minAdjusted && maxAdjusted ? Colors.createTreatmentActive : Colors.createTreatmentInactive
+            _handlerLeft .color = minAdjusted ? Colors.createTreatmentActive: Colors.createTreatmentInactive
+            _handlerRight.color = maxAdjusted ? Colors.createTreatmentActive: Colors.createTreatmentInactive
+        }
+        function active() {
+            _rangeRect   .color = Colors.createTreatmentActive
+            _handlerLeft .color = Colors.createTreatmentActive
+            _handlerRight.color = Colors.createTreatmentActive
+        }
+        if ( ! hasAdjusted ) {
+            active()
+        }
+        else {
+            check()
+        }
+    }
 
     ///
     /// \brief   calculate the value by position x
@@ -261,8 +298,8 @@
     }
 
     /// Left most maximum range vertical edge
-    Rectangle { id : minVerticalEdge
-        visible             : true
+    Rectangle { id : _minVerticalEdge
+        visible             : _root.minVerticalEdgeVisible
         color               : bgColor
         anchors.right       : _root.left
         anchors.top         : _root.top
@@ -272,8 +309,8 @@
     }
 
     /// Right most minimum range vertical edge
-    Rectangle { id : maxVerticalEdge
-        visible             : true
+    Rectangle { id : _maxVerticalEdge
+        visible             : _root.maxVerticalEdgeVisible
         color               : bgColor
         anchors.left        : _root.right
         anchors.top         : _root.top