8f9dc7f1a6
- Füge listenspezifische PNGs hinzu (famous quotes, farmer wisdom, UNfortune, idioms, sandman, unicorn, vegan recipes) - Implementiere dynamische Bildauswahl basierend auf currentFortuneListName - Cookie-Bild aktualisiert sich sofort beim Start und Listenwechsel - Bereinige Cookie-Icon-Größen für einheitliches Aussehen (34x30 / 30x26 GU) - Entferne Spruchanzahl in Klammern aus Listenbeschreibungen - Füge Switch für Cookie-Knacksgeräusch (cookieCrackEnabled) in Einstellungen hinzu - Optimierte updateCookieImage()-Funktion mit expliziten Aufrufen bei allen Zustandsänderungen Generated by Mistral Vibe. Co-Authored-By: Mistral Vibe <vibe@mistral.ai>
99 lines
3.3 KiB
Markdown
99 lines
3.3 KiB
Markdown
# Lektionen gelehrt am 06.06.2026
|
|
|
|
## 🎯 Dynamische Cookie-Bilder Implementierung
|
|
|
|
### Problem
|
|
Cookie-Bilder sollten sich je nach ausgewählter Spruchliste ändern (z.B. `famous quotes_open.png` für berühmte Zitate).
|
|
|
|
### Lösung
|
|
1. **Funktion `updateCookieImage()`** erstellt, die den Bildpfad basierend auf `currentFortuneListName` und `fortuneOpened` bestimmt
|
|
2. **Explizite Aufrufe** an allen Stellen, wo sich der Zustand ändert:
|
|
- Initialisierung (mit `Qt.callLater` für UI-Bereitschaft)
|
|
- Beim Listenwechsel in den Einstellungen
|
|
- Beim Öffnen/Schließen des Cookies (MouseArea Handler)
|
|
- Beim Neuladen des Fortunes
|
|
|
|
### Wichtige Erkenntnis
|
|
**Qt.binding() funktioniert NICHT zuverlässig** für automatische Updates, wenn sich Properties in JavaScript-Funktionen ändern.
|
|
→ **Immer explizite Aufrufe** von Update-Funktionen verwenden, statt auf automatische Bindings zu vertrauen.
|
|
|
|
### Code-Beispiel
|
|
```qml
|
|
function updateCookieImage() {
|
|
var listName = currentFortuneListName || "fortune";
|
|
var availableLists = ["farmer wisdom", "UNfortune", ...];
|
|
if (availableLists.indexOf(listName) !== -1) {
|
|
var encodedName = listName.replace(/ /g, "%20");
|
|
cookieImage.source = Qt.resolvedUrl("../assets/" + encodedName + (fortuneOpened ? "_open.png" : "_close.png"));
|
|
} else {
|
|
cookieImage.source = fortuneOpened ? Qt.resolvedUrl("../assets/cookie_open2.png") : Qt.resolvedUrl("../assets/cookie_closed2.png");
|
|
}
|
|
}
|
|
```
|
|
|
|
---
|
|
|
|
## 📝 Listenbeschreibungen
|
|
|
|
### Problem
|
|
Spruchanzahl wurde in Klammern angezeigt (z.B. "Redensarten aus aller Welt (15)").
|
|
|
|
### Lösung
|
|
`cleanDescription()`-Funktion entfernt alle Klammern mit Zahlen am Ende:
|
|
```qml
|
|
function cleanDescription(text) {
|
|
return text.replace(/\s*\(\d+\)$/, "");
|
|
}
|
|
```
|
|
|
|
---
|
|
|
|
## 🔊 Cookie-Knacksgeräusch Toggle
|
|
|
|
### Implementierung
|
|
- Property `cookieCrackEnabled` (default: true)
|
|
- Switch in Einstellungen mit Binding an die Property
|
|
- Sound wird nur abgespielt, wenn `cookieCrackEnabled === true`
|
|
|
|
### Code
|
|
```qml
|
|
Switch {
|
|
checked: cookieCrackEnabled
|
|
onCheckedChanged: {
|
|
cookieCrackEnabled = checked;
|
|
py.call("fortunecookie.set_cookie_crack_enabled", [checked]);
|
|
}
|
|
}
|
|
|
|
// In Event-Handlern:
|
|
if (cookieCrackEnabled) crackMediaPlayer.play();
|
|
```
|
|
|
|
---
|
|
|
|
## 📏 Cookie-Icon-Größen
|
|
|
|
### Anpassung
|
|
- Geschlossen: 30x26 GU
|
|
- Geöffnet: 34x30 GU
|
|
|
|
Alle Cookie-Bilder haben jetzt ähnliche Dimensionen für ein einheitliches Aussehen.
|
|
|
|
---
|
|
|
|
## 🔧 Debugging-Tipps
|
|
|
|
1. **console.log() ist essenziell** - Ohne Debug-Ausgaben ist es schwer, den Code-Fluss zu verfolgen
|
|
2. **Clean Build** - `clickable clean` vor `clickable build` durchführen, wenn Änderungen nicht sichtbar sind
|
|
3. **Git Status prüfen** - `git status` zeigt, welche Dateien geändert sind
|
|
4. **Build-Directory prüfen** - Manchmal wird die alte Main.qml verwendet, weil der Build nicht neu gestartet wurde
|
|
|
|
---
|
|
|
|
## 📌 Best Practices
|
|
|
|
1. **Explizit > Implizit** - Bei QML besser explizite Funktionsaufrufe als automatische Bindings verwenden
|
|
2. **Fehlerbehandlung** - try-catch in komplexen Funktionen hilft bei der Fehlersuche
|
|
3. **Konsistente Größen** - UI-Elemente sollten ähnliche Dimensionen haben für ein professionelles Aussehen
|
|
4. **Benutzerfreundlichkeit** - Toggle-Switches für Sound sind intuitiver als Checkboxen
|