Componentize and add data window

This commit is contained in:
2026-03-09 22:05:28 +01:00
parent 76589b4185
commit 9e17d5f638
4 changed files with 198 additions and 20 deletions

View File

@@ -1,7 +1,10 @@
// Copyright (C) 2026 Hector van der Aa <hector@h3cx.dev>
// Copyright (C) 2026 Association Exergie <association.exergie@gmail.com>
// SPDX-License-Identifier: GPL-3.0-or-later
import { VerticalBox, Button } from "std-widgets.slint";
import { Palette } from "palette.slint";
import { DataWindow } from "components/data-window.slint";
component StatusBadge {
in property <string> label;
@@ -35,9 +38,10 @@ component MenuButton {
Rectangle {
border-width: 2px;
border-color: Palette.brand;
border-color: area.has-hover ? Palette.brand : Palette.border;
border-radius: 8px;
background: area.pressed ? Palette.brand.darker(0.3) : area.has-hover ? Palette.bg-hover : Palette.bg-main;
background: area.pressed ? Palette.brand : area.has-hover ? Palette.bg-hover : Palette.bg-main;
HorizontalLayout {
padding-left: 12px;
@@ -83,21 +87,18 @@ export component AppWindow inherits Window {
Rectangle {
height: 40px;
width: 100%;
background: Palette.bg-secondary;
background: Palette.bg-main;
HorizontalLayout {
padding-top: 6px;
padding-bottom: 6px;
padding-left: 10px;
padding-right: 10px;
padding: 6px;
spacing: 6px;
MenuButton {
text: "File";
text: "Connect";
}
MenuButton {
text: "Edit";
text: "Window";
}
Rectangle {
@@ -118,9 +119,58 @@ export component AppWindow inherits Window {
// Main content
Rectangle {
background: Palette.bg-main;
background: Palette.bg-secondary;
horizontal-stretch: 1;
vertical-stretch: 1;
Rectangle {
width: parent.width / 2;
height: parent.height / 2;
x: 0px;
y: 0px;
DataWindow {
data1: [
{ label: "Engine Temp", value: 97, unit: " °C" },
{ label: "Engine RPM", value: 2573, unit: " RPM" },
{ label: "Engine Map", value: 7, unit: "" },
{ label: "Fuel Rate", value: 0.62, unit: " L/h" },
{ label: "Injector PW", value: 2.7, unit: " ms" },
{ label: "Ignition Adv", value: 21, unit: " °" },
];
data2: [
{ label: "GPS Speed", value: 38.9, unit: " km/h" },
{ label: "GPS Satellites", value: 14, unit: "" },
{ label: "Tank Pressure", value: 101.7, unit: " kPa" },
{ label: "Air Temp", value: 24, unit: " °C" },
{ label: "Humidity", value: 42, unit: " %" },
{ label: "Barometric", value: 1012, unit: " hPa" }
];
}
}
Rectangle {
width: parent.width / 2;
height: parent.height / 2;
x: parent.width / 2;
y: 0px;
DataWindow {
data1: [
{ label: "Engine Temp", value: 97, unit: " °C" },
{ label: "Engine RPM", value: 2573, unit: " RPM" },
{ label: "Engine Map", value: 7, unit: "" },
{ label: "Fuel Rate", value: 0.62, unit: " L/h" },
{ label: "Injector PW", value: 2.7, unit: " ms" },
{ label: "Ignition Adv", value: 21, unit: " °" },
];
data2: [
{ label: "GPS Speed", value: 38.9, unit: " km/h" },
{ label: "GPS Satellites", value: 14, unit: "" },
{ label: "Tank Pressure", value: 101.7, unit: " kPa" },
{ label: "Air Temp", value: 24, unit: " °C" },
{ label: "Humidity", value: 42, unit: " %" },
{ label: "Barometric", value: 1012, unit: " hPa" }
];
}
}
}
Rectangle {
@@ -131,7 +181,7 @@ export component AppWindow inherits Window {
Rectangle {
height: 32px;
background: Palette.bg-secondary;
background: Palette.bg-main;
width: 100%;
HorizontalLayout {
@@ -157,7 +207,7 @@ export component AppWindow inherits Window {
horizontal-stretch: 0;
height: parent.height - (2 * parent.padding-top);
width: 2px;
background: Palette.bg-main;
background: Palette.bg-secondary;
}
Rectangle {
@@ -173,7 +223,7 @@ export component AppWindow inherits Window {
horizontal-stretch: 0;
height: parent.height - (2 * parent.padding-top);
width: 2px;
background: Palette.bg-main;
background: Palette.bg-secondary;
}
StatusBadge {