[ButtonRow] selector fix

src/controls/ButtonRow.qml

@@ -39,21 +39,36 @@ Rectangle {
     height: 40
     property ListModel model: ListModel {}
     property bool enabled: true
+    property int currentIndex: -1
     signal selected(string sel)
+
     Image {
         anchors.fill: parent
         visible: !main.enabled
         source: "images/disabled-overlay.png"
         fillMode: Image.Tile
     }
+
+    Rectangle{
+        id: selecter
+        height: 50
+        y: -5
+        color: "#0091e5"
+        z:0
+        visible: false
+        anchors{
+            top: rowElement.top
+            topMargin: -5
+        }
+    }
+
     Row {
-        spacing: 0
+        id: rowElement
         Repeater {
             id: rectangles
             model: main.model
-            delegate:
-                Rectangle {
-                property bool active: false
+            delegate: Rectangle {
+                id: rowItem
                 height: 50
                 y: -5
                 width: text.width+(text.width/name.length*2)
@@ -64,15 +79,9 @@ Rectangle {
                     width: parent.width
                     height: parent.height
                     onClicked: {
-                            if (!parent.active) {
-                                text.font.bold = true
-                                parent.color = "#0091e5"
-                                parent.active = true
-                            } else {
-                                text.font.bold = false
-                                parent.color = "transparent"
-                                parent.active = false
-                            }
+                        main.currentIndex = index
+                        selecter.visible = true
+                        moveSelecter.start()
                         main.selected(name)
                     }
                 }
@@ -83,6 +92,14 @@ Rectangle {
                     Component.onCompleted: {
                         width = paintedWidth
                     }
+                    z:1
+                    font.bold: main.currentIndex == index
+                }
+
+                ParallelAnimation {
+                    id: moveSelecter
+                    NumberAnimation { target: selecter; property: "x"; from: selecter.x; to: rowItem.x; duration: 100}
+                    NumberAnimation { target: selecter; property: "width"; from: selecter.width; to: rowItem.width; duration: 100}
                 }
             }
         }