Add custom scroll handle

ui/timeline.slint

@@ -97,9 +97,50 @@ component TimelineBlock inherits VerticalLayout {
     }
 }
 
-export component Timeline inherits ScrollView {
+export component ScrollHandle {
+    out property<float> maximum: 1;
+    out property<float> minimum: 0;
+    in-out property<float> value;
+    callback dragged(float);
+
+    width: handle.width * 0.66;
+    horizontal-stretch: 0;
+    vertical-stretch: 1;
+    height: 100%;
+
+    handle := Rectangle {
+        x: 0;
+        width: 64px;
+        height: self.width;
+        border-width: 3px;
+        border-radius: self.height / 2;
+        background: touch.pressed ? Palette.accent-background : Palette.alternate-background;
+        border-color: Palette.accent-foreground;
+        y: (root.height - handle.height) * (root.value - root.minimum)/(root.maximum - root.minimum);
+
+        touch := TouchArea {
+            moved => {
+                if (self.enabled && self.pressed) {
+                    root.value = max(root.minimum, min(root.maximum,
+                        root.value + (self.mouse-y - self.pressed-y) * (root.maximum - root.minimum) / root.height));
+                    dragged(root.value)
+                }
+            }
+        }
+    }
+}
+
+export component Timeline {
+    scroll-view := ScrollView {
         mouse-drag-pan-enabled: true;
         viewport-height: rect.height;
+        vertical-scrollbar-policy: always-off;
+        horizontal-scrollbar-policy: always-off;
+
+        scrolled => {
+            // sync ScrollHandle with ScrollView
+            scroll-handle.value = (-scroll-view.viewport-y) / scroll-view.viewport-height;
+        }
 
         changed viewport-y => {
             Global.timeline-scrolled(-self.viewport-y);
@@ -121,3 +162,13 @@ export component Timeline inherits ScrollView {
             }
         }
     }
+
+    scroll-handle := ScrollHandle {
+        x: parent.x + parent.width - self.width;
+        height: root.height;
+        dragged(value) => {
+            // sync ScrollView with ScrollHandle
+            scroll-view.viewport-y = -(value * scroll-view.viewport-height);
+        }
+    }
+}