QmlDesigner.ItemLibrary: fixed scrolling

- view is not moving anymore when opening/closing sections

src/plugins/qmldesigner/components/itemlibrary/qml/ItemsView.qml

@@ -67,7 +67,7 @@ Rectangle {
 
     function expandAll() {
         expandAllEntries();
-        scrollbar.handleBar.y = 0;
+        scrollbar.moveHandle(0, true)
     }
 
     signal expandAllEntries()
@@ -134,8 +134,6 @@ Rectangle {
         interactive: false
         viewportHeight: col.height
 
-        onViewportHeightChanged: scrollbar.limitHandle()
-
         Column {
             id: col
 
@@ -151,7 +149,7 @@ Rectangle {
             style: itemsView.style
             scrollFlickable: itemsFlickable
 
-            onMoveScrollbarHandle: scrollbar.moveHandle(viewportPos)
+            onMoveScrollbarHandle: scrollbar.moveHandle(viewportPos, true)
 
             width: itemsView.cellWidth
             height: itemsView.cellHeight
@@ -169,7 +167,7 @@ Rectangle {
         anchors.leftMargin: -10
         anchors.right: parent.right
 
-        scrollFlickable: itemsFlickable
+        flickable: itemsFlickable
         style: itemsView.style
     }
 }

src/plugins/qmldesigner/components/itemlibrary/qml/ItemsViewStyle.qml

@@ -33,16 +33,16 @@ Item {
     property string backgroundColor: "#707070"
     property string raisedBackgroundColor: "#e0e0e0"
 
-    property string scrollbarBackgroundColor: "#505050"
+    property string scrollbarBorderColor: "#8F8F8F"
-    property string scrollbarHandleColor: "#303030"
+    property string scrollbarGradientStartColor: "#7E7E7E"
+    property string scrollbarGradientEndColor: "#C6C6C6"
+    property int scrollbarClickScrollAmount: 40
 
     property string itemNameTextColor: "#FFFFFF"
 
     property string sectionTitleTextColor: "#f0f0f0"
     property string sectionTitleBackgroundColor: "#909090"
 
-//    property string gridLineLighter: "#787878"
-//    property string gridLineDarker: "#656565"
     property string gridLineLighter: "#808080"
     property string gridLineDarker: "#606060"
 

src/plugins/qmldesigner/components/itemlibrary/qml/Scrollbar.qml

@@ -32,51 +32,37 @@ import Qt 4.6
 Item {
     id: bar
 
-    property var handleBar: handle
+    property var flickable
-
-    property var scrollFlickable
     property var style
 
-    property bool scrolling: (scrollFlickable.viewportHeight > scrollFlickable.height)
     property int scrollHeight: height - handle.height
 
-    Binding {
-        target: scrollFlickable
-        property: "viewportY"
-        value: Math.max(0, scrollFlickable.viewportHeight - scrollFlickable.height) *
-               handle.y / scrollHeight
-    }
-
     Rectangle {
         anchors.fill: parent;
         anchors.rightMargin: 1
         anchors.bottomMargin: 1
         color: "transparent"
         border.width: 1;
-        border.color: "#8F8F8F";
+        border.color: style.scrollbarBorderColor;
     }
 
-    function moveHandle(viewportPos) {
+    function moveHandle(viewportPos, updateFlickable) {
-        var pos;
+	handle.updateFlickable = updateFlickable
 
-        if (bar.scrollFlickable) {//.visibleArea.yPosition) {
+	if (flickable)
-            pos = bar.scrollHeight * viewportPos / (bar.scrollFlickable.viewportHeight - bar.scrollFlickable.height);
+	    handle.y = scrollHeight * Math.min(
-        } else
+		viewportPos / (flickable.viewportHeight - flickable.height),
-            pos = 0;
+                1);
+	else
+	    handle.y = 0;
 
-//        handleMoveAnimation.to = Math.min(bar.scrollHeight, pos)
+	handle.updateFlickable = true
-//        handleMoveAnimation.start();
-        handle.y = Math.min(bar.scrollHeight, pos)
     }
 
-    function limitHandle() {
+    function updateHandle() {
-        // the following "if" is needed to get around NaN when starting up
+	moveHandle(flickable.viewportY, false);
-        if (scrollFlickable)
-            handle.y = Math.min(handle.height * scrollFlickable.visibleArea.yPosition,
-                                scrollHeight);
-        else
-            handle.y = 0;
     }
+    
 /*
     NumberAnimation {
         id: handleResetAnimation
@@ -87,31 +73,29 @@ Item {
         duration: 500
     }
 */
+
+    onFlickableChanged: moveHandle(0, true)
+
     Connection {
-        sender: scrollFlickable
+        sender: flickable
         signal: "heightChanged"
-        script: {
+        script: moveHandle(0, true)
-            /* since binding loops prevent setting the handle properly,
-               let's animate it to 0 */
-            if (scrollFlickable.viewportY > (scrollFlickable.viewportHeight - scrollFlickable.height))
-//                handleResetAnimation.start()
-                handle.y = 0
-        }
     }
 
-    onScrollFlickableChanged: handle.y = 0
+    Connection {
-
+        sender: flickable
-/*
+        signal: "viewportHeightChanged"
-    Rectangle {
+        script: updateHandle()
-        anchors.fill: parent
-        anchors.leftMargin: 3
-        anchors.rightMargin: 3
-        anchors.topMargin: 2
-        anchors.bottomMargin: 2
-        radius: width / 2
-        color: style.scrollbarBackgroundColor
     }
-*/
+
+    Connection {
+        sender: flickable
+        signal: "positionYChanged"
+        script: updateHandle()
+    }
+
+    onHeightChanged: updateHandle()
+    
     MouseRegion {
         anchors.left: parent.left
         anchors.right: parent.right
@@ -120,7 +104,7 @@ Item {
         onClicked: {
 //            handleMoveAnimation.to = Math.max(0, handle.y - 40)
 //            handleMoveAnimation.start();
-            handle.y = Math.max(0, handle.y - 40)
+            handle.y = Math.max(0, handle.y - style.scrollbarClickScrollAmount)
         }
     }
 
@@ -131,7 +115,14 @@ Item {
         anchors.leftMargin: 1
         anchors.right: parent.right
 //        anchors.rightMargin: 1
-        height: Math.max(width, bar.height * Math.min(1, scrollFlickable.visibleArea.heightRatio))
+	height: Math.max(width, bar.height * Math.min(1, flickable.height / flickable.viewportHeight))
+
+	property bool updateFlickable: true
+	
+	onYChanged: {
+	    if (updateFlickable)
+		flickable.viewportY = Math.max(0, flickable.viewportHeight * y / bar.height)
+	}
 
         Rectangle {
             width: parent.height - 1
@@ -142,8 +133,8 @@ Item {
             transformOrigin: Item.BottomLeft
 
             gradient: Gradient {
-                GradientStop { position: 0.0; color: "#7E7E7E" }
+                GradientStop { position: 0.0; color: style.scrollbarGradientStartColor }
-                GradientStop { position: 1.0; color: "#C6C6C6" }
+                GradientStop { position: 1.0; color: style.scrollbarGradientEndColor }
             }
         }
 
@@ -164,7 +155,7 @@ Item {
         onClicked: {
 //            handleMoveAnimation.to = Math.min(scrollHeight, handle.y + 40)
 //            handleMoveAnimation.start();
-            handle.y = Math.min(scrollHeight, handle.y + 40)
+            handle.y = Math.min(scrollHeight, handle.y + style.scrollbarClickScrollAmount)
         }
     }
 /*
@@ -176,4 +167,3 @@ Item {
     }
 */
 }
-