Vier Fassungen des Moments zwischen „Beenden" und der Seite: was heute gebaut ist, dein Strich mit Looping, eine Landung des Rings und eine Fassung ohne Haken. Tipp auf einen Bildschirm, dann läuft er noch einmal. Mit ¼× siehst du jeden Schritt. Die Bühne darunter ist die echte: Stange 88 × 8 bei y 281, Held 100 px, Kicker 13.
Ring und Haken zeichnen sich in der Bildschirmmitte, „Fertig!" darunter. Nach 1,2 s verblasst alles, und die Seite blendet darunter ein. Der Haken landet nirgends mehr — das ist der Umbau vom 4. Sep.
Was daran fehlt: Die Bewegung endet im Nichts. Der Haken steht in der Mitte, die Zahl erscheint 100 px weiter oben, die Stange noch einmal woanders — drei Orte, keine Verbindung.
Der Haken ist heute 23 px breit in einem 90er-Ring. So steht es im Code (checkFaktor 0,25);
ich habe ihn nicht größer gezeichnet, damit du siehst, was am Gerät läuft.
| Zeit | Was passiert |
|---|---|
| 0 – 600 | Ring zeichnet sich, von oben im Uhrzeigersinn |
| 300 – 900 | Haken zeichnet sich · bei 900 der Schlag (Haptik) |
| 700 – 1000 | „Fertig!" blendet ein |
| 1150 – 2000 | Text, Haken, Grund blenden aus; die Seite blendet ein, die Zahl zählt hoch |
Ein 8 px dicker Strich — so dick wie die Stange — kommt von links, in der Höhe, in der nachher die Stange liegt. In der Mitte macht er einen Looping: der Looping ist der Ring, so groß wie die Zahl, die später an dieser Stelle steht. Der Haken zeichnet sich in den Ring, „Fertig!" erscheint unter dem Strich. Der Strich läuft rechts aus dem Bild.
Dann: Ring und Haken verblassen, der Strich zieht sich von beiden Enden zurück, bis nur die 88 px unter der Zahl übrig sind — das ist die Stange. Die Zahl zählt an der Stelle hoch, wo der Ring war.
Was ich an deiner Skizze geändert habe: (1) Der Strich läuft auf Stangenhöhe, nicht durch die Bildschirmmitte — sonst müsste er am Ende noch nach oben fahren. (2) Der Looping hat den Durchmesser der Zahl, damit die Zahl in seiner Spur landet. (3) Der Strich verblasst nicht, er zieht sich zurück — die Stange ist dann wirklich ein Stück von ihm.
| Zeit | Was passiert |
|---|---|
| 0 – 1500 | Der Stift läuft: von links zur Mitte, Looping, rechts hinaus (ein Weg, eine Kurve) |
| 900 – 1200 | Haken zeichnet sich in den Ring · bei 1200 der Schlag |
| 1000 – 1300 | „Fertig!" blendet ein, 24 px unter dem Strich |
| 1700 – 2200 | Ring und Haken verblassen · der Strich zieht sich auf 88 px zurück · „Fertig!" geht |
| 2000 – 2600 | Kicker, Zahl und Seite blenden ein · die Zahl zählt ab 2100 hoch |
Ring und Haken wie heute in der Mitte, nur mit 4 px Strich statt 3. Statt zu verblassen, fliegt der Ring nach oben und drückt sich dabei flach — bis er die Stange ist, 88 × 8, unter der Zahl. Der Haken geht vorher. Die Zahl erscheint, während der Ring landet.
Warum sie hier steht: Das ist die günstigste Fassung, die trotzdem irgendwo ankommt. Es ändert sich
nur der Abgang; das Zeichnen bleibt, wie es ist. In Flutter ist das ein Transform plus ein
abgerundetes Rechteck, dessen Maße mitlaufen.
Was dagegen spricht: Der Ring legt 117 px zurück und wird dabei elfmal flacher. Bei 1× wirkt das wie ein Schlucken. Bei ½× sieht man, was passiert — am Gerät hat niemand ½×.
| Zeit | Was passiert |
|---|---|
| 0 – 500 | Ring zeichnet sich |
| 300 – 800 | Haken zeichnet sich · bei 800 der Schlag |
| 700 – 1000 | „Fertig!" blendet ein |
| 1200 – 1500 | Haken und „Fertig!" gehen |
| 1300 – 1900 | Der Ring fliegt hoch und wird flach; ab 1600 füllt er sich, bis er die Stange ist |
| 1700 – 2300 | Seite blendet ein · die Zahl zählt ab 1900 hoch |
Ein Strich wischt einmal von links nach rechts durch, auf Stangenhöhe. Wo er vorbeikommt, bleibt die Stange liegen, und die Seite erscheint dahinter. Kein Ring, kein Haken, kein „Fertig!" — 1,3 s statt 2,2.
Warum sie hier steht: Als Gegenprobe. Die große Zahl sagt schon, dass es geschafft ist; die Frage ist, ob der Haken noch etwas dazusagt. Ich finde: ja — der Haken ist der Moment „fertig", die Zahl ist der Moment „so viel". Zwei Aussagen, zwei Zeichen. Aber du sollst es sehen, nicht nur lesen.
| Zeit | Was passiert |
|---|---|
| 0 – 900 | Der Kopf des Strichs läuft von links nach rechts durch |
| 250 – 1150 | Das Ende folgt ihm mit Abstand |
| 500 – 700 | Die Stange bleibt unter dem Strich liegen |
| 500 – 1200 | Seite blendet ein · die Zahl zählt ab 600 hoch |
| Fassung | Bis die Seite steht | Haken | Kommt etwas an? | Aufwand in Flutter | Hellmodus |
|---|---|---|---|---|---|
| Ist | 2,2 s | ja, Mitte | nein — alles verblasst | gebaut | Strich 700er, Stange 400er: zwei Töne, nie gleichzeitig sichtbar |
| A · Strich | 2,6 s | ja, im Looping | ja — Strich → Stange, Ring → Platz der Zahl | mittel: ein CustomPainter, Kopf und Ende des Strichs über PathMetric.extractPath; rund 250 Zeilen | Stift im 700er, beim Zurückziehen Überblendung auf den 400er der Stange (im Dunkeln unsichtbar, beide gleich) |
| B · Landung | 2,3 s | ja, Mitte | ja — Ring → Stange | klein: Abgang tauschen, Transform + RRect; rund 120 Zeilen | Ring 700er, beim Flachwerden auf den 400er umfärben |
| C · nur Stange | 1,3 s | nein | ja — Strich → Stange | klein: ein Painter; rund 80 Zeilen | Strich = Stange = 400er, ein Ton |