2ndbeam/aliveline
1
1
Fork 0
Code Issues Pull requests Projects Releases 5 Packages Wiki Activity Actions

ui: Mass layout refactor

Browse source 
- Replaced TabWidget mode selection with ComboBox
- Moved Timeline out of record/review widgets
- Added TimelineState struct
- Set slint style to cosmic
This commit is contained in:
Alexey 2026-04-08 11:12:49 +03:00
commit 1a1f6dde83
7 changed files with 190 additions and 160 deletions
Download patch file Download diff file Expand all files Collapse all files

59
ui/timeline.slint
View file

@ -1,55 +1,28 @@
import { Palette } from "theme.slint";
import { TimeString, Const } from "global.slint";
export struct TimelineEvent {
start: int,
duration: int,
finished: bool,
label: string,
color-id: int
color-id: int,
}
global TimeString {
pure function pad-mh(seconds: int, param: int) -> string {
if seconds / param < 10 {
return "0\{floor(seconds / param)}";
}
return "\{floor(seconds / param)}";
}
pure function pad-s(seconds: int) -> string {
if mod(seconds, 60) < 10 {
return "0\{mod(seconds, 60)}";
}
return "\{mod(seconds, 60)}";
}
public pure function from(seconds: int) -> string {
return "\{pad-mh(seconds, 3600)}:\{pad-mh(mod(seconds, 3600), 60)}:\{pad-s(seconds)}";
}
export struct TimelineState {
visible-time: int,
offset: int,
events: [TimelineEvent],
}
export component Timeline inherits Rectangle {
callback new-day-started;
callback clicked <=> ta.clicked;
background: Palette.background;
in-out property<bool> updating: true;
in-out property<[TimelineEvent]> events: [];
in-out property<int> visible-time: 3600;
property<int> visible-offset: max(offset, visible-time);
in-out property<int> offset: 0;
out property<int> max-offset: 24 * 3600 - 1;
timer := Timer {
interval: 1s;
running: updating;
triggered => {
if (offset >= max-offset) {
root.new-day-started();
offset = 0;
return;
}
offset += 1;
}
}
in-out property<TimelineState> state;
property<int> visible-offset: max(state.offset, state.visible-time);
out property<int> max-offset: Const.max-offset;
ta := TouchArea {
preferred-width: 100%;
@ -72,7 +45,7 @@ export component Timeline inherits Rectangle {
Text {
x: 0;
y: parent.height - self.height;
text: TimeString.from(visible-offset - visible-time);
text: TimeString.from(visible-offset - state.visible-time);
color: Palette.background-text;
}
@ -83,9 +56,9 @@ export component Timeline inherits Rectangle {
color: Palette.background-text;
}
for event in events: timeline-event := Rectangle {
property<length> real-x: ((visible-time - (visible-offset - event.start)) / visible-time) * parent.width;
property<length> real-width: event.duration / visible-time * parent.width + min(real-x, 0);
for event in state.events: timeline-event := Rectangle {
property<length> real-x: ((state.visible-time - (visible-offset - event.start)) / state.visible-time) * parent.width;
property<length> real-width: event.duration / state.visible-time * parent.width + min(real-x, 0);
x: max(real-x, 0);
y: parent.height / 4;
z: 1;
@ -110,7 +83,7 @@ export component Timeline inherits Rectangle {
y: root.height - self.height - timeline-event.height;
text: timeline-event.x == timeline-event.real-x ?
TimeString.from(event.start) :
TimeString.from(visible-offset - visible-time);
TimeString.from(visible-offset - state.visible-time);
visible: timeline-event.visible &&
(self.width * 2 < timeline-event.width ||
(!end-txt.visible && self.width < timeline-event.width));