Index: sources/gui/qml/components/StepIndicator.qml
===================================================================
diff -u -rfa1b7c7d5ca98b991168bacc0bab1e9614ed39b6 -r6112c3191d418571246b5b6da11502b2e723ef2e
--- sources/gui/qml/components/StepIndicator.qml	(.../StepIndicator.qml)	(revision fa1b7c7d5ca98b991168bacc0bab1e9614ed39b6)
+++ sources/gui/qml/components/StepIndicator.qml	(.../StepIndicator.qml)	(revision 6112c3191d418571246b5b6da11502b2e723ef2e)
@@ -43,23 +43,26 @@
     QtObject { id: _private
         property string stepNamesFirst: ""
         property var    stepNamesRest : []
+        function setupModel(names) {
+            if ( names.length > 1 ) {
+                for (let i = 0; i < names.length; i++) {
+                    if (i === 0)
+                        stepNamesFirst = names[i]
+                    else
+                        stepNamesRest[i-1] = names[i]
+                }
+            }
+            else {
+                if (names.length) stepNamesFirst = names[0]
+                else              stepNamesFirst = ""
+                stepNamesRest = []
+            }
+            console.debug(_root.stepNames, stepNamesFirst, stepNamesRest)
+        }
     }
 
     onStepNamesChanged: {
-        console.debug(_root.stepNames)
-        if ( _root.stepNames.length > 1 ) {
-            // javascript shift() on array will return the first element
-            // and will update the original array by removing the first element
-            // that's why on the stepNamesRest assignment the origianl has been assigned.
-            let mStepNames = _root.stepNames
-            _private.stepNamesFirst = mStepNames.shift()
-            _private.stepNamesRest  = mStepNames
-        }
-        else {
-            if (_root.stepNames.length) _private.stepNamesFirst = _root.stepNames[0]
-            else                        _private.stepNamesFirst = ""
-            _private.stepNamesRest = []
-        }
+        _private.setupModel(_root.stepNames)
     }
 
     Grid { id: _gridSteps
Index: sources/gui/qml/pages/pretreatment/sample/PreTreatmentWaterSample.qml
===================================================================
diff -u -rfa1b7c7d5ca98b991168bacc0bab1e9614ed39b6 -r6112c3191d418571246b5b6da11502b2e723ef2e
--- sources/gui/qml/pages/pretreatment/sample/PreTreatmentWaterSample.qml	(.../PreTreatmentWaterSample.qml)	(revision fa1b7c7d5ca98b991168bacc0bab1e9614ed39b6)
+++ sources/gui/qml/pages/pretreatment/sample/PreTreatmentWaterSample.qml	(.../PreTreatmentWaterSample.qml)	(revision 6112c3191d418571246b5b6da11502b2e723ef2e)
@@ -48,6 +48,8 @@
         readonly property int innerRadius   :  5
         readonly property int imageMargin   : ( _component.frameGap - _component.chevronWidth ) / 2
 
+        property var stepNames: ["A", "B", "C"]
+
         signal leftClicked ()
         signal rightClicked()
 
@@ -62,6 +64,14 @@
             topMargin       : _component.outerVMargin
             bottomMargin    : _component.outerVMargin
         }
+        Text { id: _message
+            color: Colors.textMain
+            text: _component.stepNames[_swipeview.currentIndex]
+            anchors.top: _component.top
+            anchors.bottom: _innerFrame.top
+            anchors.horizontalCenter: _component.horizontalCenter
+            font.pixelSize: Fonts.fontPixelSection
+        }
 
         Rectangle { id: _innerFrame
             clip: true
@@ -72,29 +82,35 @@
             radius          : _component.innerRadius
             onWidthChanged  : console.debug(" ----- ", width, height)
             onHeightChanged : console.debug(" ----- ", width, height)
-            SwipeView { id: view
-                clip: true
-                currentIndex: 0
+            Rectangle { id: _containerSwipeView
                 anchors.fill: parent
-                Repeater {
-                    model: indicator.stepNames
-                    Loader {
-                        active: SwipeView.isCurrentItem || SwipeView.isNextItem || SwipeView.isPreviousItem
-                        sourceComponent: Image {
-                            source: "qrc:/images/iLogoDiality"
-                            Component.onCompleted: console.log("created:", index)
-                            Component.onDestruction: console.log("destroyed:", index)
+                anchors.margins: 2
+                SwipeView { id: _swipeview
+                    clip: true
+                    currentIndex: 0
+                    anchors.fill: parent
+                    Repeater {
+                        model: _component.stepNames
+                        Loader {
+                            anchors.margins: 2
+                            active: SwipeView.isCurrentItem || SwipeView.isNextItem || SwipeView.isPreviousItem
+                            sourceComponent: Item {
+                                Image {
+                                    anchors.fill: parent
+                                    source: "qrc:/images/iLogoDiality"
+                                }
+                            }
                         }
                     }
                 }
             }
         }
 
-        StepIndicator { id: indicator
+        StepIndicator { id: _indicator
             currentComplete : true
             hideLabels      : true
-            stepNames       : ["A", "B", "C"]
-            currentStepIndex: view.currentIndex
+            stepNames       : _component.stepNames
+            currentStepIndex: _swipeview.currentIndex
             anchors.top     : _innerFrame.bottom
             anchors.bottom  : _component.bottom
             anchors.horizontalCenter: _component.horizontalCenter
@@ -126,8 +142,8 @@
             anchors.bottom  : _component.bottom
             onClicked       : {
                 console.debug("leftClicked")
-                if (view.currentIndex > 0)
-                    view.currentIndex--
+                if (_swipeview.currentIndex > 0)
+                    _swipeview.currentIndex--
                 _component.leftClicked
             }
         }
@@ -138,8 +154,8 @@
             anchors.bottom  : _component.bottom
             onClicked       :  {
                 console.debug("rightClicked")
-                if (view.currentIndex < view.count-1)
-                    view.currentIndex++
+                if (_swipeview.currentIndex < _swipeview.count-1)
+                    _swipeview.currentIndex++
                 _component.rightClicked
             }
         }