0.6.7: icone sui tre tasti delle azioni rapide (fiamma, casa, manopole), disegnate in casa

scripts/make_glyphs.py

@@ -0,0 +1,93 @@
+#!/usr/bin/env python3
+"""Disegna le icone dei tre tasti delle opzioni rapide in Home.
+
+Stanno in qml/icons/ perche' il pulsante Silica vuole un'immagine, non un disegno
+QML. PNG e non SVG di proposito: il PNG si vede di sicuro, l'SVG dipende dal
+supporto SVG dentro il sandbox dell'app.
+
+Bianche su trasparente: sul tema Sailfish i tasti sono scuri e le icone di
+sistema sono cosi'. Tre concetti che il tema Sailfish non ha (nell'elenco
+ufficiale non c'e' nessuna fiamma, nessuna goccia): boost = fiamma, assenza =
+casa (la stessa casa dell'icona dell'app), comandi = tre righe con le manopole.
+
+Uso: python3 scripts/make_glyphs.py
+"""
+import math
+import pathlib
+
+from PIL import Image, ImageDraw
+
+BASE = 688          # si disegna grande e si riduce: bordi puliti a ogni taglia
+OUT = 172           # come l'icona piu' grande dell'app, abbondante per il tasto
+DEST = pathlib.Path(__file__).resolve().parent.parent / "qml" / "icons"
+BIANCO = (255, 255, 255, 255)
+VUOTO = (0, 0, 0, 0)
+
+
+def nuova():
+    return Image.new("RGBA", (BASE, BASE), VUOTO)
+
+
+def fiamma(d, cx, cy, w, h):
+    """Boost: fiamma — stretta, punta piegata a sinistra, fondo tondo."""
+    r = 0.26 * w
+    alto = h - 0.55 * r
+    fondo = cy + h / 2
+    destra, sinistra = [], []
+    passi = 160
+    for i in range(passi + 1):
+        t = i / passi
+        mezza = (w / 2) * math.sin(math.pi * (t ** 0.7))
+        piega = (w * 0.18) * (t ** 1.7)      # la punta pende a sinistra
+        y = fondo - alto * t
+        destra.append((cx + mezza - piega, y))
+        sinistra.append((cx - mezza - piega, y))
+    d.polygon(destra + list(reversed(sinistra)), fill=BIANCO)
+    # fondo arrotondato: copre la punta stretta in basso
+    d.ellipse([cx - r, fondo - 0.55 * r, cx + r, fondo + 0.55 * r], fill=BIANCO)
+
+
+def casa(d, cx, cy, w, h):
+    """Assenza: casa con la porta (senza la porta si legge come una freccia)."""
+    cima = cy - h / 2
+    base = cy + h / 2
+    spalle = cima + h * 0.36              # dove il tetto incontra il muro
+    d.polygon([(cx - w * 0.52, spalle), (cx, cima), (cx + w * 0.52, spalle)], fill=BIANCO)
+    d.rectangle([cx - w * 0.33, spalle - 1, cx + w * 0.33, base], fill=BIANCO)
+    # la porta: e' quello che la distingue da una freccia
+    d.rectangle([cx - w * 0.20 / 2, base - h * 0.30, cx + w * 0.20 / 2, base], fill=VUOTO)
+
+
+def comandi(d, cx, cy, w, h):
+    """Comandi: tre righe con la manopola in posizioni diverse."""
+    manopole = (-0.18, 0.20, -0.06)
+    for i, posizione in enumerate(manopole):
+        y = cy - h / 2 + h * (0.16 + 0.34 * i)
+        spessore = h * 0.115
+        d.rounded_rectangle([cx - w / 2, y - spessore / 2, cx + w / 2, y + spessore / 2],
+                            radius=spessore / 2, fill=BIANCO)
+        kx = cx + w * posizione
+        r = h * 0.13
+        d.ellipse([kx - r * 1.5, y - r * 1.5, kx + r * 1.5, y + r * 1.5], fill=VUOTO)
+        d.ellipse([kx - r, y - r, kx + r, y + r], fill=BIANCO)
+
+
+def main():
+    DEST.mkdir(parents=True, exist_ok=True)
+    disegni = (
+        ("quick-boost.png", fiamma, 0.58),
+        ("quick-away.png", casa, 0.74),
+        ("quick-commands.png", comandi, 0.82),
+    )
+    lato = BASE * 0.72                    # margine generoso: il tasto ha il suo
+    for nome, disegno, strettezza in disegni:
+        img = nuova()
+        d = ImageDraw.Draw(img)
+        disegno(d, BASE / 2, BASE / 2, lato * strettezza, lato)
+        img = img.resize((OUT, OUT), Image.LANCZOS)
+        img.save(DEST / nome)
+        print("scritto", (DEST / nome).relative_to(DEST.parent.parent))
+
+
+if __name__ == "__main__":
+    main()

scripts/render_mockups.py

@@ -503,12 +503,20 @@ def main_screen() -> Image.Image:
     # ---- azioni rapide ----------------------------------------------------- #
     y = section_header(d, y, T("quick_actions"))
     bw = (W - 2 * M - 2 * gap) // 3
+    # icona a sinistra e testo di fianco, come fa il pulsante Silica
+    glifi = ("quick-boost.png", "quick-away.png", "quick-commands.png")
     for i, testo in enumerate((T("boost"), T("away_btn"), T("commands"))):
         x = M + i * (bw + gap)
         d.rounded_rectangle([x, y, x + bw, y + 74], radius=18, fill=BTN_BG,
                             outline=BTN_EDGE, width=2)
+        icona = Image.open(OUT.parent.parent / "qml" / "icons" / glifi[i]).convert("RGBA")
+        lato = 42
+        icona = icona.resize((lato, lato), Image.LANCZOS)
         tw = d.textlength(testo, font=font(24))
-        d.text((x + (bw - tw) / 2, y + 23), testo, font=font(24), fill=PRIMARY)
+        blocco = lato + 12 + tw
+        x0 = x + (bw - blocco) / 2
+        img.paste(icona, (int(x0), int(y + (74 - lato) / 2)), icona)
+        d.text((x0 + lato + 12, y + 23), testo, font=font(24), fill=PRIMARY)
     y += 104
 
     # ---- letture di contorno ----------------------------------------------- #