| 1 | // Copyright © SixtyFPS GmbH <info@slint.dev> |
| 2 | // SPDX-License-Identifier: MIT |
| 3 | |
| 4 | import { SpinBox, Button, CheckBox, Slider, LineEdit, ScrollView, ListView, |
| 5 | HorizontalBox, VerticalBox, GridBox, StandardButton, Palette } from "std-widgets.slint" ; |
| 6 | |
| 7 | @rust-attr(derive(serde::Serialize, serde::Deserialize)) |
| 8 | export struct TodoItem { |
| 9 | title: string, |
| 10 | checked: bool, |
| 11 | } |
| 12 | |
| 13 | export component MainWindow inherits Window { |
| 14 | in property <[TodoItem]> todo-model: [ |
| 15 | { title: "Implement the .slint file" , checked: true }, |
| 16 | { title: "Do the Rust part" , checked: false }, |
| 17 | { title: "Make the C++ code" , checked: false }, |
| 18 | { title: "Write some JavaScript code" , checked: false }, |
| 19 | { title: "Test the application" , checked: false }, |
| 20 | { title: "Ship to customer" , checked: false }, |
| 21 | { title: "???" , checked: false }, |
| 22 | { title: "Profit" , checked: false }, |
| 23 | ]; |
| 24 | |
| 25 | in property <bool> show-header: false; |
| 26 | in-out property <bool> is-sort-by-name: false; |
| 27 | in-out property <bool> hide-done-items: false; |
| 28 | |
| 29 | callback todo-added(string); |
| 30 | callback remove-done(); |
| 31 | callback popup_confirmed; |
| 32 | callback show_confirm_popup; |
| 33 | callback apply_sorting_and_filtering(); |
| 34 | |
| 35 | show_confirm_popup => { confirm_popup.show(); } |
| 36 | |
| 37 | preferred-width: 400px; |
| 38 | preferred-height: 600px; |
| 39 | |
| 40 | confirm_popup := PopupWindow { |
| 41 | x: 40px; |
| 42 | y: 100px; |
| 43 | width: min(confirm_popup_layout.preferred-width, root.width - 80px); |
| 44 | |
| 45 | Rectangle { |
| 46 | background: Palette.background; |
| 47 | border-color: Palette.border; |
| 48 | border-width: 1px; |
| 49 | } |
| 50 | |
| 51 | confirm_popup_layout := Dialog { |
| 52 | height:100%; width: 100%; |
| 53 | |
| 54 | confirm_popup_text := Text { |
| 55 | text: "Some items are not done, are you sure you wish to quit?" ; |
| 56 | wrap: word-wrap; |
| 57 | } |
| 58 | |
| 59 | StandardButton { kind: yes; clicked => { root.popup_confirmed(); } } |
| 60 | StandardButton { kind: no; } |
| 61 | } |
| 62 | } |
| 63 | |
| 64 | VerticalBox { |
| 65 | HorizontalBox { |
| 66 | padding: 0px; |
| 67 | text-edit := LineEdit { |
| 68 | accepted(text) => { |
| 69 | root.todo-added(self.text); |
| 70 | self.text = "" ; |
| 71 | } |
| 72 | |
| 73 | placeholder-text: "What needs to be done?" ; |
| 74 | } |
| 75 | |
| 76 | btn := Button { |
| 77 | clicked => { |
| 78 | root.todo-added(text-edit.text); |
| 79 | text-edit.text = "" ; |
| 80 | } |
| 81 | |
| 82 | text: "Add New Entry" ; |
| 83 | enabled: text-edit.text != "" ; |
| 84 | } |
| 85 | } |
| 86 | |
| 87 | if (root.show-header) : HorizontalBox { |
| 88 | padding: 0px; |
| 89 | alignment: start; |
| 90 | |
| 91 | CheckBox { |
| 92 | toggled => { |
| 93 | root.apply_sorting_and_filtering(); |
| 94 | } |
| 95 | |
| 96 | text: "Sort by name" ; |
| 97 | checked <=> root.is-sort-by-name; |
| 98 | } |
| 99 | |
| 100 | CheckBox { |
| 101 | toggled => { |
| 102 | root.apply_sorting_and_filtering(); |
| 103 | } |
| 104 | |
| 105 | text: "Hide done items" ; |
| 106 | checked <=> root.hide-done-items; |
| 107 | } |
| 108 | } |
| 109 | |
| 110 | list-view := ListView { |
| 111 | for todo in root.todo-model: HorizontalLayout { |
| 112 | CheckBox { |
| 113 | toggled => { |
| 114 | todo.checked = self.checked; |
| 115 | } |
| 116 | |
| 117 | text: todo.title; |
| 118 | checked: todo.checked; |
| 119 | } |
| 120 | } |
| 121 | } |
| 122 | HorizontalBox { |
| 123 | padding: 0px; |
| 124 | alignment: end; |
| 125 | |
| 126 | Button { |
| 127 | clicked => { root.remove-done(); } |
| 128 | |
| 129 | text: "Remove Done Items" ; |
| 130 | } |
| 131 | } |
| 132 | } |
| 133 | } |
| 134 | |