1 | // Copyright © SixtyFPS GmbH <info@slint.dev> |
2 | // SPDX-License-Identifier: MIT |
3 | |
4 | import { Page } from "page.slint" ; |
5 | import { GroupBox, Tile, BarTiles, BarTileModel } from "../widgets/widgets.slint" ; |
6 | import { Images } from "../images.slint" ; |
7 | |
8 | export global WeatherAdapter { |
9 | in property <string> title: "Weather" ; |
10 | in property <image> current-temperature-icon: Images.cloud; |
11 | in property <string> current-temperature: "22°" ; |
12 | in property <string> current-day: "May 6th 2023" ; |
13 | in property <string> current-weather-description: "Very cloudy" ; |
14 | in property <[BarTileModel]> week-model: [ |
15 | { |
16 | title: "Thu" , |
17 | icon: Images.cloudy, |
18 | max: 21, |
19 | min: 18, |
20 | absolute-max: 21, |
21 | absolute-min: 15, |
22 | unit: "°" |
23 | }, |
24 | { |
25 | title: "Fri" , |
26 | icon: Images.cloudy, |
27 | max: 20, |
28 | min: 17, |
29 | absolute-max: 21, |
30 | absolute-min: 15, |
31 | unit: "°" |
32 | }, |
33 | { |
34 | title: "Sat" , |
35 | icon: Images.cloudy, |
36 | max: 18, |
37 | min: 15, |
38 | absolute-max: 21, |
39 | absolute-min: 15, |
40 | unit: "°" |
41 | } |
42 | ]; |
43 | } |
44 | |
45 | export component Weather inherits Page { |
46 | in property <string> title <=> WeatherAdapter.title; |
47 | in property <image> current-temperature-icon <=> WeatherAdapter.current-temperature-icon; |
48 | in property <string> current-temperature <=> WeatherAdapter.current-temperature; |
49 | in property <string> current-day <=> WeatherAdapter.current-day; |
50 | in property <string> current-weather-description <=> WeatherAdapter.current-weather-description; |
51 | in property <[BarTileModel]> week-model <=> WeatherAdapter.week-model; |
52 | |
53 | GroupBox { |
54 | title: root.title; |
55 | spacing: 1px; |
56 | |
57 | Tile { |
58 | value: current-temperature; |
59 | text: current-day; |
60 | sub-text: current-weather-description; |
61 | icon: current-temperature-icon; |
62 | } |
63 | |
64 | BarTiles { |
65 | model: week-model; |
66 | active: root.active; |
67 | } |
68 | |
69 | // stretches the empty element |
70 | if(week-model.length == 0) : Rectangle {} |
71 | } |
72 | } |