More updating to zbus 4.0.1

2026-02-06 00:15:04 +01:00 · 2024-02-22 23:49:35 +13:00
parent a44145f487
commit 8e4b7d53f4
50 changed files with 3151 additions and 2932 deletions
--- a/rog-control-center/ui/widgets/sidebar.slint
+++ b/rog-control-center/ui/widgets/sidebar.slint
@@ -0,0 +1,125 @@
+// Copyright © SixtyFPS GmbH <info@slint.dev>
+// SPDX-License-Identifier: MIT
+
+import { StyleMetrics } from "std-widgets.slint";
+
+component SideBarItem inherits Rectangle {
+    in property <bool> selected;
+    in property <bool> has-focus;
+    in-out property <string> text<=> label.text;
+    callback clicked<=>touch.clicked;
+    min-height: l.preferred-height;
+    states [
+        pressed when touch.pressed: {
+        state.opacity: 0.8;
+        }
+        hover when touch.has-hover: {
+            state.opacity: 0.6;
+        }
+        selected when root.selected: {
+            state.opacity: 1;
+        }
+        focused when root.has-focus: {
+            state.opacity: 0.8;
+        }
+    ]
+
+    state := Rectangle {
+        opacity: 0;
+        background: StyleMetrics.window-background;
+        animate opacity{ duration: 150ms;
+        }
+
+    }
+
+    l := HorizontalLayout {
+        y: (parent.height - self.height) / 2;
+        padding: StyleMetrics.layout-padding;
+        spacing: 0px;
+        label := Text {
+            color: StyleMetrics.default-text-color;
+            vertical-alignment: center;
+        }
+    }
+
+    touch := TouchArea {
+        width: 100%;
+        height: 100%;
+    }
+}
+
+export component SideBar inherits Rectangle {
+    in property <[string]> model: [];
+    in property <string> title<=> label.text;
+    out property <int> current-item: 0;
+    out property <int> current-focused: fs.has-focus ? fs.focused-tab : -1;
+    // The currently focused tab
+
+    width: 180px;
+    forward-focus: fs;
+    accessible-role: tab;
+    accessible-delegate-focus: root.current-focused >= 0 ? root.current-focused : root.current-item;
+    Rectangle {
+        background: StyleMetrics.window-background.darker(0.2);
+        fs := FocusScope {
+            key-pressed(event) => {
+                if (event.text == "\n") {
+                    root.current-item = root.current-focused;
+                     return accept;
+                }
+                if (event.text == Key.UpArrow) {
+                    self.focused-tab = Math.max(self.focused-tab - 1,  0);
+                     return accept;
+                }
+                if (event.text == Key.DownArrow) {
+                    self.focused-tab = Math.min(self.focused-tab + 1, root.model.length - 1);
+                     return accept;
+                }
+                return reject;
+            }
+            key-released(event) => {
+                if (event.text == " ") {
+                    root.current-item = root.current-focused;
+                     return accept;
+                }
+                return reject;
+            }
+            property <int> focused-tab: 0;
+            x: 0;
+            width: 0;
+            // Do not react on clicks
+        }
+    }
+
+    VerticalLayout {
+        padding-top: StyleMetrics.layout-padding;
+        padding-bottom: StyleMetrics.layout-padding;
+        spacing: StyleMetrics.layout-spacing;
+        alignment: start;
+        label := Text {
+            font-size: 16px;
+            horizontal-alignment: center;
+        }
+
+        navigation := VerticalLayout {
+            alignment: start;
+            vertical-stretch: 0;
+            for item [index] in root.model: SideBarItem {
+                clicked => {
+                    root.current-item = index;
+                }
+                has-focus: index == root.current-focused;
+                text: item;
+                selected: index == root.current-item;
+            }
+        }
+
+        VerticalLayout {
+            bottom := VerticalLayout {
+                padding-left: StyleMetrics.layout-padding;
+                padding-right: StyleMetrics.layout-padding;
+                @children
+            }
+        }
+    }
+}