1// Copyright © SixtyFPS GmbH <info@slint.dev>
2// SPDX-License-Identifier: MIT
3
4import { Header, HeaderAdapter } from "blocks/blocks.slint";
5import { Images } from "images.slint";
6import { Theme } from "theme.slint";
7import { Menu, PageScrollView, PageContainer } from "widgets/widgets.slint";
8import { MenuPage } from "pages/pages.slint";
9import { Balance, Overview, Usage, UsageAdapter, Weather, About } from "pages/pages.slint";
10
11export component MidMain {
12 Rectangle {
13 background: Theme.palette.background-gradient;
14
15 VerticalLayout {
16 padding-bottom: 50px;
17
18 Header {}
19
20 i-page-scroll-view := PageScrollView {
21 vertical-stretch: 1;
22 page-count: 5;
23
24 PageContainer {
25 clicked => { i-page-scroll-view.toggle-selection(self.index, self.x); }
26
27 index: 0;
28 selected <=> i-page-scroll-view.selection;
29 selected-width: i-page-scroll-view.selected-width;
30 selected-height: i-page-scroll-view.selected-height;
31 selected-h-offset: i-page-scroll-view.selected-h-offset;
32
33 Overview {}
34 }
35
36 PageContainer {
37 clicked => { i-page-scroll-view.toggle-selection(self.index, self.x); }
38
39 index: 1;
40 selected <=> i-page-scroll-view.selection;
41 selected-width: i-page-scroll-view.selected-width;
42 selected-height: i-page-scroll-view.selected-height;
43 selected-h-offset: i-page-scroll-view.selected-h-offset;
44
45 Usage {}
46 }
47
48 PageContainer {
49 clicked => { i-page-scroll-view.toggle-selection(self.index, self.x); }
50
51 index: 2;
52 selected <=> i-page-scroll-view.selection;
53 selected-width: i-page-scroll-view.selected-width;
54 selected-height: i-page-scroll-view.selected-height;
55 selected-h-offset: i-page-scroll-view.selected-h-offset;
56
57 Balance {}
58 }
59
60 PageContainer {
61 clicked => { i-page-scroll-view.toggle-selection(self.index, self.x); }
62
63 index: 3;
64 selected <=> i-page-scroll-view.selection;
65 selected-width: i-page-scroll-view.selected-width;
66 selected-height: i-page-scroll-view.selected-height;
67 selected-h-offset: i-page-scroll-view.selected-h-offset;
68
69 Weather {}
70 }
71
72 PageContainer {
73 clicked => { i-page-scroll-view.toggle-selection(self.index, self.x); }
74
75 index: 4;
76 selected <=> i-page-scroll-view.selection;
77 selected-width: i-page-scroll-view.selected-width;
78 selected-height: i-page-scroll-view.selected-height;
79 selected-h-offset: i-page-scroll-view.selected-h-offset;
80
81 About {}
82 }
83 }
84 }
85
86 i-menu := Menu {
87 stays-open: true;
88 preferred-width: 100%;
89 preferred-height: 100%;
90 start-y: 35px;
91 end-y: 75px;
92 menu-width: root.width / 3;
93 menu-height: root.height - 75px;
94
95 opened => {
96 i-menu-page.current-index = 0;
97 }
98
99 i-menu-page := MenuPage {
100 close => {
101 i-menu.hide();
102 }
103
104 preferred-width: 100%;
105 preferred-height: 100%;
106 }
107 }
108 }
109}
110