Finestre di dialogo e riquadri a comparsa

Finestre di dialogo e riquadri sono elementi dell'interfaccia utente temporanei che vengono visualizzati quando si verifica un evento che richiede una notifica, l'approvazione o informazioni aggiuntive dall'utente.

Finestre di dialogo

Le finestre di dialogo sono sovrapposizioni dell'interfaccia utente modale che offrono informazioni contestuali per l'app. Le finestre di dialogo bloccano le interazioni con la finestra dell'app finché non vengono chiuse in modo esplicito. Spesso richiedono un'azione da parte dell'utente.

Riquadri a comparsa

Un riquadro a comparsa è un leggero popup contestuale che visualizza l'interfaccia utente correlata all'operazione che sta eseguendo l'utente. Include il posizionamento e la logica di ridimensionamento. Inoltre, può essere usato per mostrare un controllo secondario o ulteriori dettagli su un elemento.

A differenza di una finestra di dialogo, un riquadro a comparsa può essere chiuso rapidamente toccando o facendo clic in un punto all'esterno del riquadro, premendo il tasto ESC o il pulsante Indietro, ridimensionando la finestra dell'app o modificando l'orientamento del dispositivo.

È il controllo giusto?

Le finestre di dialogo e i riquadri a comparsa consentono di fornire informazioni importanti agli utenti, ma interrompono l'esperienza utente. Poiché le finestre di dialogo sono modali (comportano un blocco), interrompono gli utenti, impedendo loro di eseguire qualsiasi altra operazione fino a quando non interagiscono con la finestra. I riquadri a comparsa disturbano meno l'esperienza, ma la visualizzazione di troppi riquadri a comparsa può distrarre l'utente.

Dopo aver determinato di voler usare una finestra di dialogo o un riquadro a comparsa, occorre scegliere quale delle due risorse usare.

Dato che le finestre di dialogo bloccano le interazioni, mentre i riquadri a comparsa no, le finestre di dialogo devono essere usate solo nelle situazioni in cui vuoi che l'utente smetta di svolgere altre operazioni per concentrarsi su informazioni specifiche o rispondere a una domanda. I riquadri a comparsa invece possono essere usati quando vuoi richiamare l'attenzione su qualcosa che però l'utente può scegliere senza problemi di ignorare.

Usa una finestra di dialogo per...

• Presentare informazioni importanti che l'utente deve leggere e confermare prima di procedere. Esempi:
  • Quando la sicurezza dell'utente potrebbe essere compromessa
  • L'utente sta per modificare in modo permanente un asset importante
  • L'utente sta per eliminare un asset importante
  • Conferma di un acquisto in-app
• Messaggi di errore che si applicano al contesto generale dell'app, ad esempio un errore di connettività.
• Domande, quando l'app deve porre all'utente una domanda per sbloccare una situazione, ad esempio quando l'app non può scegliere per conto dell'utente. Una domanda bloccante non può essere ignorata o rinviata e deve offrire all'utente scelte ben definite.

Usa un riquadro a comparsa per...

• Raccolta di informazioni aggiuntive necessarie per il completamento di un'azione.
• Visualizzare informazioni che sono pertinenti solo in alcuni casi. In un'app di raccolta foto, ad esempio, quando l'utente fa clic su un'anteprima di un'immagine, puoi usare un riquadro a comparsa per visualizzare una versione dell'immagine di grandi dimensioni.
• Visualizzazione di altre informazioni, come dettagli o descrizioni più lunghe di un elemento nella pagina.

Modi per evitare di usare finestre di dialogo e riquadri a comparsa

Prendi in considerazione l'importanza delle informazioni che vuoi condividere: sono sufficientemente importanti da giustificare l'interruzione dell'attività dell'utente? Si prenda anche in considerazione la frequenza con cui le informazioni devono essere visualizzate. Se occorre visualizzare una finestra di dialogo o una notifica ogni pochi minuti, potrebbe essere preferibile allocare spazio per queste info nell'interfaccia utente principale. In un client di chat, ad esempio, invece di visualizzare un riquadro a comparsa ogni volta che un amico esegue l'accesso, si potrebbe visualizzare un elenco degli amici attualmente online ed evidenziare gli amici che eseguono l'accesso.

Le finestre di dialogo sono spesso usate per confermare un'azione (ad esempio l'eliminazione di un file) prima di eseguirla. Se si prevede che l'utente svolga un'azione specifica di frequente, valutare la possibilità di fornire un modo per annullare l'azione in caso di errore, invece che richiedere agli utenti di confermare l'azione ogni volta.

Esempi

• API importanti: classe ContentDialog, classe Flyout

• Se è installata l'app Raccolta WinUI 3, fare clic qui per aprirla e vedere ContentDialog o Flyout in azione. Ottenere l'app da Microsoft Store o visualizzare il codice sorgente in GitHub.

Come creare una finestra di dialogo

Vedi l'articolo sulle finestre di dialogo.

Come creare un riquadro a comparsa

Vedi l'articolo sui riquadri a comparsa.