Add back button for closing the app

jpnurmi · Oct 17, 2023 · 17139ef · 17139ef
1 parent b9078bf
commit 17139ef
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 8 deletions.
diff --git a/src/main.rs b/src/main.rs
@@ -48,5 +48,10 @@ fn main() {
         },
     );
 
+    window.on_close({
+        let handle = window.as_weak();
+        move || handle.unwrap().window().hide().unwrap()
+    });
+
     window.run().unwrap();
 }
diff --git a/ui/components.slint b/ui/components.slint
@@ -18,18 +18,21 @@ export component SmhiLogo inherits Image {
 export component ToolBar {
     in property<string> title <=> label.text;
     in property<bool> refreshing;
-    callback refresh <=> touch-area.clicked;
+    callback back <=> back-button.clicked;
+    callback refresh <=> refresh-button.clicked;
 
     Rectangle {
         background: StyleMetrics.window-background.mix(StyleMetrics.default-text-color, 0.95);
         HorizontalLayout {
-            padding: 16px;
-            label := Text {
-                font-size: 32px;
-                vertical-alignment: center;
-                horizontal-stretch: 1;
+            padding: 8px;
+            alignment: space-between;
+            back-button := TouchArea {
+                Text {
+                    text: "<";
+                    font-size: 48px;
+                }
             }
-            touch-area := TouchArea {
+            refresh-button := TouchArea {
                 HorizontalLayout {
                     opacity: 0.5;
                     spacing: 4px;
@@ -41,6 +44,11 @@ export component ToolBar {
                 }
             }
         }
+        label := Text {
+            font-size: 32px;
+            horizontal-alignment: center;
+            width: parent.width - 2 * Math.max(back-button.width, refresh-button.width);
+        }
         if root.refreshing: ProgressIndicator {
             y: parent.height - self.height;
             width: 100%;

diff --git a/ui/main.slint b/ui/main.slint
@@ -6,6 +6,7 @@ export { DayTime, GeoIP, Smhi }
 export component MainWindow {
     property<bool> empty: Smhi.forecasts.length == 0;
     property<bool> refreshing: GeoIP.refreshing || DayTime.refreshing || Smhi.refreshing;
+    callback close <=> toolbar.back;
 
     width: 1024px;
     height: 600px;
@@ -18,7 +19,7 @@ export component MainWindow {
     if root.empty && root.refreshing: WaitIndicator {}
 
     VerticalLayout {
-        ToolBar {
+        toolbar := ToolBar {
             title: GeoIP.city != "" && GeoIP.country != "" ? "\{GeoIP.city}, \{GeoIP.country}" :
                    GeoIP.city != "" ? GeoIP.city :
                    GeoIP.country;