Il nuovo design di macOS Tahoe arriva sulle tue applicazioni 4D

Con macOS Tahoe, Apple Inc. introduce un nuovo linguaggio visivo denominato Liquid Glass. In questa versione, adottiamo questo stile di interfaccia per rimanere al passo con le ultime evoluzioni del design di macOS.

A partire da 4D 21 R3, le vostre applicazioni desktop 4D adottano automaticamente questa nuova interfaccia Liquid Glass. Non sono necessari aggiornamenti dei moduli, modifiche al codice o riprogettazioni.

Per supportare questa transizione, 4D ha adattato il proprio rendering per conformarsi ai nuovi vincoli di Liquid Glass introdotti da macOS. 4D si fa carico della complessità dell’evoluzione dell’interfaccia utente, in modo che le vostre applicazioni rimangano aggiornate con il minimo sforzo. Di conseguenza, gli utenti Mac beneficiano di un’interfaccia coerente con l’attuale stile visivo del sistema, con il minimo sforzo da parte degli sviluppatori.

Cos’è Liquid Glass

Secondo Apple, Liquid Glass è un nuovo stile di rendering dell’interfaccia basato su materiali traslucidi, sfocatura dinamica e sottili effetti di illuminazione. Questi elementi si adattano al contenuto di sfondo e introducono un maggiore senso di profondità, mantenendo la leggibilità.

Integrazione nativa e automatica

Il rendering Liquid Glass è gestito direttamente da macOS. 4D sfrutta il motore grafico del sistema per applicare automaticamente questi aggiornamenti visivi alle finestre delle applicazioni e ai controlli standard.

Non sono necessarie configurazioni, codice aggiuntivo o migrazione dei moduli. Quando un’applicazione 4D viene eseguita su macOS Tahoe, beneficia del rendering fornito dal sistema.

Questo approccio garantisce che le vostre interfacce rimangano allineate agli standard del sistema operativo, preservando al contempo i vostri investimenti esistenti.

Suggerimenti per la transizione quando si adotta Liquid Glass nelle applicazioni 4D

Sebbene Liquid Glass venga applicato automaticamente, la revisione di alcuni elementi dell’interfaccia utente può aiutare a mantenere la coerenza visiva e l’integrità del layout.

Pulsanti

Presta particolare attenzione alle varianti dei pulsanti. In Liquid Glass:

• I pulsanti nella variante standard hanno un aspetto quadrato.
• I pulsanti della variante Large appaiono più arrotondati.

Il cambiamento visivo avviene con una differenza di altezza di appena un pixel. Se i moduli contengono sequenze di pulsanti con altezze leggermente incoerenti, è possibile che si noti un mix di stili quadrati e arrotondati.

Prenditi un momento per verificare le altezze dei pulsanti per mantenere un allineamento visivo coerente.

Pulsanti di opzione e caselle di controllo

I pulsanti di opzione e le caselle di controllo appaiono leggermente più grandi con Liquid Glass.

Controlla la spaziatura e l’allineamento attorno a questi controlli per garantire la leggibilità e l’equilibrio visivo con le dimensioni aggiornate dei controlli.

Caselle combinate

Con Liquid Glass, le caselle combinate ora utilizzano un rendering traslucido. Pertanto, gli elementi di sfondo che prima erano invisibili potrebbero apparire attraverso la casella combinata.

Se nei moduli sono presenti oggetti sovrapposti, controllare attentamente tali aree. Potrebbe essere necessario regolare la visibilità degli oggetti di sfondo tramite codice per mantenere la chiarezza ed evitare la visualizzazione di oggetti indesiderati.

Adattare l’interfaccia utente con CSS e il tema FORM

Sebbene Liquid Glass venga applicato automaticamente, 4D fornisce anche strumenti per mettere a punto l’interfaccia quando necessario.

È possibile utilizzare le media query CSS per adattare lo stile in base al tema del modulo corrente. Ciò è particolarmente utile per gestire le differenze tra macOS Classic, macOS Liquid Glass, Windows Classic e Windows Fluent UI.

@media (form-theme: liquid-glass) {
    .panel {
        borderRadius: 10px;
        fill: #F5F7FA;
        stroke: #CDD6E0;
    }
}

@media (form-theme: mac-classic) {
    .panel {
        borderRadius: 4px;
        fill: #F2F2F2;
        stroke: #D0D0D0;
    }
}

In questo esempio, l’aspetto della classe “.panel” viene regolato automaticamente in base al tema del modulo attivo, consentendo all’interfaccia di adattarsi alle caratteristiche visive di Liquid Glass o allo stile classico di macOS senza logica aggiuntiva.

Inoltre, il FORM theme comando consente di rilevare la modalità di rendering corrente a livello di programmazione. Ora restituisce valori come LiquidGlass o Classic, rendendo facile regolare il comportamento quando necessario.

Questo approccio offre flessibilità: nella maggior parte dei casi non sono necessarie modifiche, ma si ha comunque il pieno controllo quando sono necessarie regolazioni di precisione.

Informazioni sulla disabilitazione di Liquid Glass

C’è un’importante distinzione da comprendere.

Per le applicazioni 4D e 4D Server in esecuzione con 4D 21 R3 su macOS 26 Tahoe, Liquid Glass non può essere disabilitato. Il rendering è gestito in modo nativo dal sistema operativo e viene applicato automaticamente.

Tuttavia, per le applicazioni basate su motore, è possibile disabilitare Liquid Glass durante una fase di transizione. Per farlo, aggiungere la chiave “UIDesignRequiresCompatibility” al file “Info.plist” dell’applicazione. Ciò consente all’applicazione basata su motore di mantenere lo stile visivo precedente mentre si adatta l’interfaccia.

Questa flessibilità può aiutare a rendere più agevoli le migrazioni. A lungo termine, l’adozione del rendering nativo del sistema garantisce una migliore coerenza visiva e integrazione.

Conclusione

Con il supporto di Liquid Glass su macOS Tahoe, le applicazioni 4D adottano automaticamente lo stile visivo corrente del sistema, senza richiedere modifiche al codice o ai moduli.

Questa integrazione nativa mette in evidenza uno dei principali vantaggi di 4D: le applicazioni si evolvono con gli standard dell’interfaccia utente del sistema operativo con il minimo sforzo, mentre altre tecnologie potrebbero richiedere una riprogettazione o un adattamento manuale.

Di conseguenza, gli sviluppatori possono concentrarsi sulle funzionalità, pur continuando a fornire interfacce visivamente aggiornate.