Exergie/Telemetrix
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added Window Header and minor tweaks

Browse Source
This commit is contained in:
Hector van der Aa
2026-03-10 13:18:28 +01:00
parent 20393f3f70
commit 8faa56c522
4 changed files with 371 additions and 364 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
ui/components/map-window.slint
View File

@@ -2,6 +2,7 @@
// Copyright (C) 2026 Association Exergie <association.exergie@gmail.com>
// SPDX-License-Identifier: GPL-3.0-or-later
import { Palette } from "../palette.slint";
import { WindowHeader } from "window-header.slint";
export component MapWindow {
in property <[float]> data;
in property <[float]> rpm-axis;
@@ -9,8 +10,6 @@ export component MapWindow {
in property <float> data-min;
in property <float> data-max;
in property <string> name;
preferred-width: 100%;
preferred-height: 100%;
VerticalLayout {
padding: 12px;
@@ -20,8 +19,6 @@ export component MapWindow {
}
background: Palette.bg-main;
border-color: area.has-hover ? Palette.border-focus : Palette.border;
border-width: 2px;
border-radius: 8px;
drop-shadow-color: black;
drop-shadow-offset-x: 6px;
@@ -29,25 +26,59 @@ export component MapWindow {
drop-shadow-blur: 10px;
VerticalLayout {
HorizontalLayout {
alignment: center;
padding-top: 6px;
Text {
text: name;
font-size: 20px;
color: Palette.text-primary;
}
WindowHeader {
title: name;
}
GridLayout {
width: 100%;
padding: 6px;
vertical-stretch: 1;
Rectangle {
border-color: black;
border-width: 1px;
width: 60px;
height: 60px;
col: 0;
row: 0;
clip: true;
Rectangle {
height: 2 * (parent.height);
width: 2px;
background: white;
transform-rotation: -45deg;
}
Text {
text: "RPM";
font-size: 14px;
color: Palette.text-primary;
transform-origin: { x: self.width / 2, y: self.height / 2 };
transform-rotation: 45deg;
x: parent.width / 2 + 18px * sin(45deg) - self.width / 2;
y: parent.height / 2 - 18px * sin(45deg) - self.height / 2;
}
Text {
text: "Map";
font-size: 14px;
color: Palette.text-primary;
transform-origin: { x: self.width / 2, y: self.height / 2 };
transform-rotation: 45deg;
x: parent.width / 2 - 18px * sin(45deg) - self.width / 2;
y: parent.height / 2 + 18px * sin(45deg) - self.height / 2;
}
}
for i in rpm-axis.length: Rectangle {
border-color: black;
border-width: 1px;
width: (parent.width - 2 * parent.padding) / (rpm-axis.length + 1);
width: 60px;
height: 60px;
property <int> r: 0;
property <int> c: mod(i, rpm-axis.length) + 1;
@@ -64,7 +95,8 @@ export component MapWindow {
for i in map-axis.length: Rectangle {
border-color: black;
border-width: 1px;
width: (parent.width - 2 * parent.padding) / (rpm-axis.length + 1);
width: 60px;
height: 30px;
property <int> r: i + 1;
property <int> c: 0;
@@ -82,7 +114,8 @@ export component MapWindow {
border-color: black;
border-width: 1px;
background: hsv((240deg - ((data[i] - data-min) / (data-max - data-min)) * 240deg), 0.8, 0.80);
width: (parent.width - 2 * parent.padding) / (rpm-axis.length + 1);
width: 60px;
height: 30px;
property <int> r: i / rpm-axis.length + 1;
property <int> c: mod(i, rpm-axis.length) + 1;
@@ -99,6 +132,14 @@ export component MapWindow {
}
}
}
Rectangle {
background: transparent;
border-color: area.has-hover ? Palette.border-focus : Palette.border;
border-width: 2px;
border-radius: 8px;
vertical-stretch: 1;
}
}
}
}