cargo update

Cargo.toml

@@ -5,3 +5,12 @@ members = [
   "srv",
   "gui",
 ]
+
+# Enable max optimizations for dependencies, but not for our code:
+# Very helpful when developing in Slint.
+[profile.dev.package."*"]
+opt-level = 3
+
+# Enable only a small amount of optimization in debug mode
+[profile.dev]
+opt-level = 1

gui/Cargo.toml

@@ -49,7 +49,6 @@ features = [
   "backend-android-activity-06",
 ]
 
-
 [target.'cfg(target_os = "linux")'.dependencies]
 tokio = { version = "1.48.0", default-features = false, features = ["fs", "rt-multi-thread"] }
 xdg = "3.0.0"

gui/src/lib.rs

@@ -93,6 +93,7 @@ fn update_slint_list(new_list: Vec<Item>, list: &VecModel<ui::SItem>) {
             name: item.name.to_shared_string(),
             checked: item.data.checked,
             amount: item.data.amount as i32,
+            just_added: false,
         })
         .for_each(|item| list.push(item));
 }
@@ -196,6 +197,7 @@ pub fn run() -> Result<(), anyhow::Error> {
             checked: false,
             name: item.clone(),
             amount: 1,
+            just_added: true,
         });
         let conf = conf.clone();
         io.spawn(async move || {

gui/ui/app.slint

@@ -113,6 +113,23 @@ component PlusMinus inherits HorizontalLayout {
 
 component GoodListItemAdd inherits Rectangle {
     in-out property <SItem> item;
+    // Animate when this item appears.
+    transform-scale: item.just-added ? 90% : 100%;
+    opacity: item.just-added ? 0 : 100%;
+    init => {
+        self.transform-scale = 100%;
+        self.opacity = 100%;
+        item.just-added = false;
+    }
+    animate transform-scale {
+        duration: 500ms;
+        easing: ease-out-bounce;
+    }
+    animate opacity {
+        duration: 300ms;
+        easing: ease-out;
+    }
+
     background: Palette.alternate-background;
     border-radius: 8pt;
     border-width: 10pt;
@@ -169,7 +186,7 @@ component GoodsListAdd {
 
         for item in items: VerticalLayout {
             GoodListItemAdd {
-                item: item;
+                item <=> item;
             }
 
             Rectangle {
@@ -186,19 +203,21 @@ component GoodButtons inherits ScrollView {
 
     property <int> count-x: floor(root.width / (button-min-width + button-spacing));
     property <int> count-y: ceil(State.favorites.length / count-x);
-    property <length> button-width: ((self.width + button-spacing) / count-x) - button-spacing;
+    property <length> button-width: ((root.width + button-spacing) / count-x) - button-spacing;
 
     content-height: (count-y * (button-height + button-spacing));
     mouse-drag-pan-enabled: true;
+    vertical-scrollbar-policy: always-off;
 
-    for item[idx] in State.favorites: Button {
-        x: floor(mod(idx, count-x)) * (root.button-width + root.button-spacing);
-        y: floor(idx / count-x) * (root.button-height + root.button-spacing);
-        width: root.button-width;
-        height: root.button-height;
-        text: item.name;
-        clicked => {
-            State.add-to-list(item.name);
+    FlexboxLayout {
+        spacing: button-spacing;
+        for item in State.favorites: Button {
+            width: root.button-width;
+            height: root.button-height;
+            text: item.name;
+            clicked => {
+                State.add-to-list(item.name);
+            }
         }
     }
 }

gui/ui/state.slint

@@ -2,6 +2,10 @@ export struct SItem {
     name: string,
     checked: bool,
     amount: int,
+
+    /// Whether the item was just added by the user.
+    /// Determines whether the add-animation plays.
+    just_added: bool,
 }
 
 export struct SButtonItem{