diff --git a/examples/todo/cpp/app.cpp b/examples/todo/cpp/app.cpp index a39611e600b..2171f24af7b 100644 --- a/examples/todo/cpp/app.cpp +++ b/examples/todo/cpp/app.cpp @@ -35,6 +35,8 @@ AppState create_ui() } }); + demo->on_remove([todo_model](int index) { todo_model->erase(index); }); + demo->on_popup_confirmed( [demo = slint::ComponentWeakHandle(demo)] { (*demo.lock())->window().hide(); }); diff --git a/examples/todo/rust/lib.rs b/examples/todo/rust/lib.rs index 9491692eb72..5ea061830e7 100644 --- a/examples/todo/rust/lib.rs +++ b/examples/todo/rust/lib.rs @@ -41,6 +41,12 @@ fn init() -> State { let todo_model = todo_model.clone(); move |text| todo_model.push(TodoItem { checked: false, title: text }) }); + main_window.on_remove({ + let todo_model = todo_model.clone(); + move |index| { + todo_model.remove(index as usize); + } + }); main_window.on_remove_done({ let todo_model = todo_model.clone(); move || { diff --git a/examples/todo/ui/todo.slint b/examples/todo/ui/todo.slint index 479f5e10085..7821f631ed1 100644 --- a/examples/todo/ui/todo.slint +++ b/examples/todo/ui/todo.slint @@ -2,7 +2,7 @@ // SPDX-License-Identifier: MIT import { SpinBox, Button, CheckBox, Slider, LineEdit, ScrollView, ListView, - HorizontalBox, VerticalBox, GridBox, StandardButton, Palette } from "std-widgets.slint"; + HorizontalBox, VerticalBox, GridBox, StandardButton, Palette, StyleMetrics } from "std-widgets.slint"; @rust-attr(derive(serde::Serialize, serde::Deserialize)) export struct TodoItem { @@ -28,6 +28,7 @@ export component MainWindow inherits Window { callback todo-added(string); callback remove-done(); + callback remove(index: int); callback popup_confirmed; callback show_confirm_popup; callback apply_sorting_and_filtering(); @@ -108,14 +109,31 @@ export component MainWindow inherits Window { } list-view := ListView { - for todo in root.todo-model: HorizontalLayout { - CheckBox { - toggled => { - todo.checked = self.checked; + for todo[index] in root.todo-model: cm := ContextMenu { + MenuItem { + title: @tr("Remove"); + activated => { root.remove(index); } + } + MenuItem { + title: todo.checked ? @tr("Mark as not done") : @tr("Mark as done"); + activated => { + todo.checked = !todo.checked; + } + } + HorizontalLayout { + padding: StyleMetrics.layout-spacing / 2; + spacing: StyleMetrics.layout-spacing; + CheckBox { + toggled => { + todo.checked = self.checked; + } + checked: todo.checked; + horizontal-stretch: 0; + } + Text { + horizontal-stretch: 1; + text: todo.title; } - - text: todo.title; - checked: todo.checked; } } }