Add animation when an item is added to the list #2
No files matched your search
@@ -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
|
||||
@@ -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"
|
||||
|
||||
@@ -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 || {
|
||||
|
||||
+18
-1
@@ -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 {
|
||||
|
||||
@@ -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{
|
||||
|
||||
Reference in new issue
Block a user