1// Copyright © SixtyFPS GmbH <info@slint.dev>
2// SPDX-License-Identifier: MIT
3
4import { DemoPalette, Page, PushButton } from "./common.slint";
5import { CopyPage } from "./copy_page.slint";
6import { ScanPage } from "./scan_page.slint";
7import { PrinterQueueView } from "./printer_queue.slint";
8
9component ActionButton inherits Rectangle {
10 in property <image> icon <=> img.source;
11 in property <string> text <=> label.text;
12
13 callback clicked;
14
15 VerticalLayout {
16 spacing: 4px;
17
18 Rectangle {
19 border-radius: 12px;
20 border-width: 3px;
21 border-color: DemoPalette.control-outline-color;
22 background: DemoPalette.printer-action-background-color;
23
24 img := Image {
25 x: (parent.width / 2) - (self.width / 2);
26 y: (parent.height / 2) - (self.height / 2);
27 width: self.source.width * 1px / 2;
28 height: self.source.height * 1px / 2;
29 colorize: DemoPalette.text-foreground-color;
30 }
31 }
32
33 label := Text {
34 font-size: DemoPalette.base-font-size * 1.2;
35 font-weight: 800;
36 horizontal-alignment: center;
37 color: DemoPalette.text-foreground-color;
38 }
39 }
40
41 TouchArea { clicked => { root.clicked() } }
42}
43
44export component HomePage inherits Page {
45 in-out property <length> header-row-height: 40px / 2;
46 in-out property <length> button-spacing: 8px;
47 in-out property <length> button-width: 127px / 2;
48 in-out property <length> button-height: root.button-width + 20px;
49 in-out property <int> current-subpage: 0;
50
51 header: "Printer";
52
53 for action[idx] in [
54 { name: "Copy", icon: @image-url("images/copy.svg") },
55 { name: "Scan", icon: @image-url("images/scan.svg") },
56
57 ]: ActionButton {
58 clicked => { root.current-subpage = idx + 1; }
59 x: mod(idx, 1) * (root.button-width + root.button-spacing) + root.button-spacing;
60 y: floor(idx / 1) * (root.button-height + root.button-spacing)
61 + root.header-row-height
62 + /* top-padding of printer queue */ 18px; // align with the first item of the printer queue
63 width: root.button-width;
64 height: root.button-height;
65 icon: action.icon;
66 text: action.name;
67 }
68
69 queue-view := PrinterQueueView {
70 x: root.button-width + root.button-spacing * 2;
71 width: parent.width - self.x;
72 }
73
74 ScanPage {
75 back => { root.current-subpage = 0 }
76 x: root.current-subpage == 2 ? 0 : parent.width + parent.x + 2px;
77 animate x { duration: 125ms; easing: ease; }
78 }
79
80 CopyPage {
81 back => { root.current-subpage = 0 }
82 x: root.current-subpage == 1 ? 0 : parent.width + parent.x + 2px;
83 animate x { duration: 125ms; easing: ease; }
84 }
85}
86