Page: Fahrzeugübersicht #6

Closed
opened 2026-08-28 08:30:00 +02:00 by erdbruegger · 7 comments
Owner

Jetzt viel besser!
Können wir das Auto noch etwas größer machen und den Bereich für den SoC dafür etwas kleiner?
Vielleicht probieren wir es auch doch noch Mal mit dem Ring/Kreis als Füllstandsanzeige, aber der Rand des Rings sollte wesentlich schmaler sein und in der Mitte des Rings ist das Bild vom Fahrzeug und da drunter zwei Labels mit soc und Restreichweite

Jetzt viel besser! Können wir das Auto noch etwas größer machen und den Bereich für den SoC dafür etwas kleiner? Vielleicht probieren wir es auch doch noch Mal mit dem Ring/Kreis als Füllstandsanzeige, aber der Rand des Rings sollte wesentlich schmaler sein und in der Mitte des Rings ist das Bild vom Fahrzeug und da drunter zwei Labels mit soc und Restreichweite
Collaborator

Umgesetzt und live (http://192.168.1.85/, Commit c85cd5c) — Strg+F5 wegen Cache.

Fahrzeug-Seite: Bild und Akku-Karte sind jetzt ein gemeinsamer Hero.

  • Ring als Fuellstandsanzeige — schmaler Rand (5 px), Farbe nach Ladestand, der Fuellstand animiert beim Laden der Werte.
  • In der Mitte des Rings steht der U5 und damit deutlich groesser als vorher.
  • Darunter zwei Labels: Ladestand (%) und Restreichweite (km).
  • Der alte dicke SoC-Block und das liegende Akku-Symbol sind weggefallen — dadurch ist der SoC-Bereich kleiner und das Auto gross.

CI + Deploy waren gruen (analyze/gate/release/deploy-web).

Umgesetzt und live (**http://192.168.1.85/**, Commit `c85cd5c`) — Strg+F5 wegen Cache. **Fahrzeug-Seite:** Bild und Akku-Karte sind jetzt ein gemeinsamer Hero. - **Ring als Fuellstandsanzeige** — schmaler Rand (5 px), Farbe nach Ladestand, der Fuellstand animiert beim Laden der Werte. - **In der Mitte des Rings steht der U5** und damit deutlich groesser als vorher. - **Darunter zwei Labels:** Ladestand (%) und Restreichweite (km). - Der alte dicke SoC-Block und das liegende Akku-Symbol sind weggefallen — dadurch ist der SoC-Bereich kleiner und das Auto gross. CI + Deploy waren gruen (analyze/gate/release/deploy-web).
Author
Owner

Das sieht schon fast hervorragend aus! Können wir jetzt noch etwas die Button-Anpassung verändern. Ein paar Mini-"bugs" noch:
Aktuell Zeigt die Fahrzeugbeschriftung ja sowas wie "TESTUPLOAD" oder "TEST-INX-VERIFY". In der Realität wird dort ja später die FIN draus. Oben Rechts in dem Screen im Drop-Down bin ich da auch fein mit, wenn da die FIN steht, aber die zweite Überschrift da drunter sollte nicht die Finn sein, sondern das Auto-Modell (also Aiways U5). Ich denke aktuell kommen diese Infos noch nicht aus dem Backend, deswegen hast du das so gelöst, aber vllt kannst du das bis dahin einfach hartcodieren

Das sieht schon fast hervorragend aus! Können wir jetzt noch etwas die Button-Anpassung verändern. Ein paar Mini-"bugs" noch: Aktuell Zeigt die Fahrzeugbeschriftung ja sowas wie "TESTUPLOAD" oder "TEST-INX-VERIFY". In der Realität wird dort ja später die FIN draus. Oben Rechts in dem Screen im Drop-Down bin ich da auch fein mit, wenn da die FIN steht, aber die zweite Überschrift da drunter sollte nicht die Finn sein, sondern das Auto-Modell (also Aiways U5). Ich denke aktuell kommen diese Infos noch nicht aus dem Backend, deswegen hast du das so gelöst, aber vllt kannst du das bis dahin einfach hartcodieren
Collaborator

Umgesetzt und live (http://192.168.1.85/, Commit 36822ad) — Strg+F5 wegen Cache.

Zweite Überschrift = Modell statt Kennung. Auf der Fahrzeug-Seite steht über der Status-Headline jetzt fest Aiways U5. Oben rechts im Fahrzeugmenü bleibt die Kennung (TESTUPLOAD / TEST-INX-VERIFY, später die FIN) — genau wie von Dir gewünscht. Zweimal dieselbe Nummer untereinander sagte ohnehin nichts.

Das Modell kommt noch nicht aus dem Backend, es liegt bis dahin als Konstante Vehicle.model in models.dart. Wenn das Backend irgendwann ein Modell-Feld liefert, ist das genau eine Zeile.

Zu den Buttons — hier habe ich geraten. „Können wir jetzt noch etwas die Button-Anpassung verändern" war mir nicht eindeutig, deshalb habe ich den echten kleinen Fehler in der Kachelzeile behoben und den Rest gelassen:

  • Ver-/Entriegeln passte nicht in die schmale Kachel und wurde mit abgeschnitten → heißt jetzt Türen (Ver- und Entriegeln stehen ohnehin beide im Sheet, das aufgeht).
  • Beschriftungen dürfen zwei Zeilen haben und sind zentriert.
  • Alle drei Kacheln sind jetzt exakt gleich hoch, auch wenn eine Beschriftung umbricht.

Sag bitte, was Du wirklich gemeint hast — Größe der Kacheln? Andere Reihenfolge? Andere Aktionen (z. B. Standort mit in die Zeile statt als eigene Karte darunter)? Beschriftungen ganz weg? Ich setze es dann gezielt um, statt weiter zu raten.

CI + Deploy grün (analyze/gate/release/deploy-web), flutter analyze sauber. Live gegengeprüft: „Aiways U5" ist im ausgelieferten Bundle, Ver-/Entriegeln nicht mehr.

Umgesetzt und live (**http://192.168.1.85/**, Commit `36822ad`) — Strg+F5 wegen Cache. **Zweite Überschrift = Modell statt Kennung.** Auf der Fahrzeug-Seite steht über der Status-Headline jetzt fest **Aiways U5**. Oben rechts im Fahrzeugmenü bleibt die Kennung (`TESTUPLOAD` / `TEST-INX-VERIFY`, später die FIN) — genau wie von Dir gewünscht. Zweimal dieselbe Nummer untereinander sagte ohnehin nichts. Das Modell kommt noch **nicht** aus dem Backend, es liegt bis dahin als Konstante `Vehicle.model` in `models.dart`. Wenn das Backend irgendwann ein Modell-Feld liefert, ist das genau eine Zeile. **Zu den Buttons — hier habe ich geraten.** „Können wir jetzt noch etwas die Button-Anpassung verändern" war mir nicht eindeutig, deshalb habe ich den echten kleinen Fehler in der Kachelzeile behoben und **den Rest gelassen**: - `Ver-/Entriegeln` passte nicht in die schmale Kachel und wurde mit `…` abgeschnitten → heißt jetzt **Türen** (Ver- und Entriegeln stehen ohnehin beide im Sheet, das aufgeht). - Beschriftungen dürfen zwei Zeilen haben und sind zentriert. - Alle drei Kacheln sind jetzt exakt gleich hoch, auch wenn eine Beschriftung umbricht. **Sag bitte, was Du wirklich gemeint hast** — Größe der Kacheln? Andere Reihenfolge? Andere Aktionen (z. B. Standort mit in die Zeile statt als eigene Karte darunter)? Beschriftungen ganz weg? Ich setze es dann gezielt um, statt weiter zu raten. CI + Deploy grün (analyze/gate/release/deploy-web), `flutter analyze` sauber. Live gegengeprüft: „Aiways U5" ist im ausgelieferten Bundle, `Ver-/Entriegeln` nicht mehr.
Author
Owner

Sehr gut, können wir noch ergänzen, dass wenn das Auto sich im Ladezustand befindet, dieser Ring auf der Fahrzeug-Seite so pulsierend leuchtet als Animation? Auch mit Farbanpassung? (sanftes Grün für laden, sanftes rot für entladen, und so wie es jetzt ist - ohne animation - wenn weder geladen noch entladen wird)

Sehr gut, können wir noch ergänzen, dass wenn das Auto sich im Ladezustand befindet, dieser Ring auf der Fahrzeug-Seite so pulsierend leuchtet als Animation? Auch mit Farbanpassung? (sanftes Grün für laden, sanftes rot für entladen, und so wie es jetzt ist - ohne animation - wenn weder geladen noch entladen wird)
Collaborator

Umgesetzt und live (http://192.168.1.85/, Release v1.0.27) — Strg+F5 wegen Cache.

Der Ring zeigt jetzt den Energiefluss:

  • Lädt → sanftes Grün, der Bogen leuchtet langsam pulsierend (ca. 1,7 s pro Atemzug, weicher Schein um die Linie — die Linie selbst bleibt scharf, damit der Füllstand exakt ablesbar bleibt).
  • Entlädt → dasselbe Pulsieren in sanftem Rot.
  • Weder noch → genau wie bisher: ruhig, Farbe nach Ladestand.
  • Der Wechsel dazwischen wird weich übergeblendet, nichts springt.

Zwei Entscheidungen, die ich getroffen habe:

  • Die Prozentzahl behält die Ladestandsfarbe (rot unter 10 %, gelb unter 20 %). Sonst würde bei fast leerem Akku ein grün leuchtender Ring die Warnung überdecken — jetzt sagt der Ring „was fließt", die Zahl „wie voll".
  • Laden/Entladen kommt aus dem Pack-Strom (negativ = laden, positiv = entladen; bis 1 A gilt als Ruhestrom, damit im Stand nichts flackert). Das ist dieselbe Logik, die die Laden-Seite schon für „Lädt/Entlädt" nutzt — sie liegt jetzt als Telemetry.flow an einer Stelle, statt zweimal im Code.

Der Puls läuft nur, solange wirklich Strom fließt (kostet im Stand also keine Frames), und respektiert die System-Einstellung „Animationen reduzieren" — dann bleibt der Ring farbig, aber still.

Dazu Tests für Fluss-Logik, Puls-Start/-Stopp und das Blitz-Symbol (11 Tests grün, flutter analyze sauber). CI + Deploy grün (analyze/gate/release/deploy-web).

Umgesetzt und live (**http://192.168.1.85/**, Release `v1.0.27`) — Strg+F5 wegen Cache. **Der Ring zeigt jetzt den Energiefluss:** - **Lädt** → sanftes Grün, der Bogen leuchtet langsam pulsierend (ca. 1,7 s pro Atemzug, weicher Schein um die Linie — die Linie selbst bleibt scharf, damit der Füllstand exakt ablesbar bleibt). - **Entlädt** → dasselbe Pulsieren in sanftem Rot. - **Weder noch** → genau wie bisher: ruhig, Farbe nach Ladestand. - Der Wechsel dazwischen wird weich übergeblendet, nichts springt. **Zwei Entscheidungen, die ich getroffen habe:** - Die **Prozentzahl behält die Ladestandsfarbe** (rot unter 10 %, gelb unter 20 %). Sonst würde bei fast leerem Akku ein grün leuchtender Ring die Warnung überdecken — jetzt sagt der Ring „was fließt", die Zahl „wie voll". - Laden/Entladen kommt aus dem **Pack-Strom** (negativ = laden, positiv = entladen; bis 1 A gilt als Ruhestrom, damit im Stand nichts flackert). Das ist dieselbe Logik, die die Laden-Seite schon für „Lädt/Entlädt" nutzt — sie liegt jetzt als `Telemetry.flow` an einer Stelle, statt zweimal im Code. Der Puls läuft nur, solange wirklich Strom fließt (kostet im Stand also keine Frames), und respektiert die System-Einstellung „Animationen reduzieren" — dann bleibt der Ring farbig, aber still. Dazu **Tests** für Fluss-Logik, Puls-Start/-Stopp und das Blitz-Symbol (11 Tests grün, `flutter analyze` sauber). CI + Deploy grün (analyze/gate/release/deploy-web).
Author
Owner

Also im TEST-INX-VERIFY holt der 23A aus dem Packstrom, aber der Ring ist nur rot und plusiert nicht? Funktioniert das im Web nicht, bzw. nur unter Android?

Also im TEST-INX-VERIFY holt der 23A aus dem Packstrom, aber der Ring ist nur rot und plusiert nicht? Funktioniert das im Web nicht, bzw. nur unter Android?
Collaborator

Umgesetzt und live (http://192.168.1.85/, Commit 695bb38) — Strg+F5 wegen Cache.

Die Fluss-Erkennung war in Ordnung — bei TEST-INX-VERIFY sind es +23,2 A, das ist Entladen, deshalb rot. Der Fehler lag im Puls selbst: er saß ausschließlich in einem weichgezeichneten Schein um den Bogen (Alpha 0,18 → 0,50). Auf einem hellen Bildschirm ist das schlicht nicht zu sehen — die Animation lief, man sah sie nur nicht. Das ist keine Android/Web-Sache.

Jetzt atmet der Ring wirklich sichtbar:

  • Der Bogen selbst wird beim Pulsieren breiter (5 → 7 px) und heller — nicht nur die Aura drumherum.
  • Dazu ein harter Mantel um den Bogen, der mitatmet. Der braucht keine Weichzeichnung und pulsiert damit in jedem Renderer sichtbar.
  • Der Schimmer hinter dem Fahrzeug schwingt doppelt so weit.
  • Der Füllstand bleibt exakt ablesbar: die Kante der Linie bleibt scharf.

Falls es bei Dir trotzdem still bleibt, gibt es genau eine Erklärung, und die kannst Du jetzt selbst nachsehen: Mehr › Diagnose › Anzeige. Dort stehen drei neue Zeilen — Energiefluss, Animationen reduzieren und Ring-Puls. Steht bei „Ring-Puls“ „still (Systemeinstellung)“, dann hat Dein System/Browser „Animationen reduzieren“ an (Windows: Einstellungen › Barrierefreiheit › Visuelle Effekte › Animationseffekte; Chrome meldet das als prefers-reduced-motion). Die App respektiert das absichtlich. Sag Bescheid, wenn Du dafür einen Schalter in den Einstellungen willst, der die Systemeinstellung übergeht — baue ich dann.

Der bisherige Test prüfte nur, dass der Animations-Controller läuft — genau die falsche Frage. Er prüft jetzt, dass sich das gemalte Bild zwischen zwei Frames wirklich ändert (und im Ruhezustand eben nicht). 45 Tests grün, flutter analyze sauber, CI + Deploy grün, live gegengeprüft.

Umgesetzt und live (**http://192.168.1.85/**, Commit `695bb38`) — Strg+F5 wegen Cache. Die Fluss-Erkennung war in Ordnung — bei `TEST-INX-VERIFY` sind es +23,2 A, das ist **Entladen**, deshalb rot. Der Fehler lag im **Puls selbst**: er saß ausschließlich in einem weichgezeichneten Schein um den Bogen (Alpha 0,18 → 0,50). Auf einem hellen Bildschirm ist das schlicht nicht zu sehen — die Animation lief, man sah sie nur nicht. Das ist keine Android/Web-Sache. **Jetzt atmet der Ring wirklich sichtbar:** - Der **Bogen selbst** wird beim Pulsieren breiter (5 → 7 px) und heller — nicht nur die Aura drumherum. - Dazu ein **harter Mantel** um den Bogen, der mitatmet. Der braucht keine Weichzeichnung und pulsiert damit in **jedem** Renderer sichtbar. - Der Schimmer hinter dem Fahrzeug schwingt doppelt so weit. - Der Füllstand bleibt exakt ablesbar: die Kante der Linie bleibt scharf. **Falls es bei Dir trotzdem still bleibt**, gibt es genau eine Erklärung, und die kannst Du jetzt selbst nachsehen: **Mehr › Diagnose › Anzeige**. Dort stehen drei neue Zeilen — *Energiefluss*, *Animationen reduzieren* und *Ring-Puls*. Steht bei „Ring-Puls“ **„still (Systemeinstellung)“**, dann hat Dein System/Browser „Animationen reduzieren“ an (Windows: *Einstellungen › Barrierefreiheit › Visuelle Effekte › Animationseffekte*; Chrome meldet das als `prefers-reduced-motion`). Die App respektiert das absichtlich. Sag Bescheid, wenn Du dafür einen Schalter in den Einstellungen willst, der die Systemeinstellung übergeht — baue ich dann. Der bisherige Test prüfte nur, dass der Animations-Controller läuft — genau die falsche Frage. Er prüft jetzt, dass sich das **gemalte Bild** zwischen zwei Frames wirklich ändert (und im Ruhezustand eben nicht). 45 Tests grün, `flutter analyze` sauber, CI + Deploy grün, live gegengeprüft.
Sign in to join this conversation.
No milestone
No project
No assignees
2 participants
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference
aiways/AiwaysApp#6
No description provided.