Nota
L'accesso a questa pagina richiede l'autorizzazione. È possibile provare ad accedere o modificare le directory.
L'accesso a questa pagina richiede l'autorizzazione. È possibile provare a modificare le directory.
Questo articolo descrive la selezione e la modifica di testo, immagini e controlli e fornisce linee guida per l'esperienza utente da considerare quando si usano questi meccanismi nelle app.
API importanti: Windows.UI.Xaml.Input, Windows.UI.Input
Procedure rischiose e procedure consigliate
Usa i glifi del tipo di carattere quando implementi la tua interfaccia utente gripper. Il gripper è una combinazione di due tipi di carattere dell'interfaccia utente Segoe disponibili a livello di sistema. L'uso delle risorse dei tipi di carattere semplifica il rendering con valori DPI diversi e funziona bene con i vari livelli di ridimensionamento dell'interfaccia utente. Quando si implementano i gripper personalizzati, devono condividere i tratti dell'interfaccia utente seguenti:
- Forma circolare
- Visibile su qualsiasi sfondo
- Dimensioni coerenti
Fornire un margine intorno al contenuto selezionabile per ospitare l'interfaccia utente del gripper. Se la tua app abilita la selezione del testo in un'area che non esegue la panoramica/scorrimento, consenti un margine di gripper 1/2 sui lati sinistro e destro dell'area di testo e 1 altezza gripper sui lati superiore e inferiore dell'area di testo (come illustrato nelle immagini seguenti). In questo modo si garantisce che l'intera interfaccia utente del gripper sia esposta all'utente e riduca al minimo le interazioni indesiderate con altre interfacce utente basate su bordo.
Nascondere l'interfaccia utente dei gripper durante l'interazione. Elimina l'occlusione dai gripper durante l'interazione. Ciò è utile quando un punto di presa non è completamente oscurato dal dito o ci sono diversi punti di presa per la selezione del testo. In questo modo vengono eliminati gli artefatti visivi durante la visualizzazione delle finestre figlie.
Non consentire la selezione di elementi dell'interfaccia utente, ad esempio controlli, etichette, immagini, contenuto proprietario e così via. In genere, le applicazioni Windows consentono la selezione solo all'interno di controlli specifici. I controlli, ad esempio pulsanti, etichette e logo, non sono selezionabili. Valutare se la selezione è un problema per l'app e, in tal caso, identificare le aree dell'interfaccia utente in cui la selezione deve essere vietata.
Indicazioni aggiuntive sull'uso
La selezione e la manipolazione del testo sono particolarmente vulnerabili alle sfide dell'esperienza utente introdotte dalle interazioni tramite tocco. L'input da mouse, penna/stilo e tastiera è altamente granulare: un clic del mouse o un contatto della penna/stilo viene in genere mappato a un singolo pixel e un tasto viene premuto o non premuto. L'input tocco non è granulare; è difficile mappare l'intera superficie di un dito a una posizione x-y specifica sullo schermo per posizionare un cursore di testo in modo accurato.
Considerazioni e raccomandazioni
Usa i controlli predefiniti esposti tramite i framework del linguaggio in Windows per creare app che forniscono l'esperienza di interazione utente completa della piattaforma, inclusi comportamenti di selezione e manipolazione. Troverai la funzionalità di interazione dei controlli predefiniti sufficienti per la maggior parte delle app di Windows.
Quando si usano controlli di testo di Windows standard, non è possibile personalizzare i comportamenti di selezione e gli oggetti visivi descritti in questo argomento.
Selezione testo
Se l'app richiede un'interfaccia utente personalizzata che supporta la selezione del testo, ti consigliamo di seguire i comportamenti di selezione di Windows descritti qui.
Contenuto modificabile e non modificabile
Con il tocco, le interazioni di selezione vengono eseguite principalmente tramite gesti come un tocco per impostare il cursore di inserimento o selezionare una parola, e uno scorrimento per modificare una selezione. Come per altre interazioni tramite tocco di Windows, le interazioni a tempo sono limitate al gesto di pressione e mantenere premuto per visualizzare l'interfaccia informativa. Per altre informazioni, vedere Linee guida per il feedback visivo.
Windows riconosce due possibili stati per le interazioni di selezione, modificabili e non modificabili e regola di conseguenza l'interfaccia utente di selezione, il feedback e le funzionalità.
Contenuto modificabile
Toccando all'interno della metà sinistra di una parola il cursore viene posizionato immediatamente a sinistra della parola, mentre toccando all'interno della metà destra il cursore viene posizionato immediatamente a destra della parola.
L'immagine seguente illustra come posizionare un cursore di inserimento iniziale con gripper toccando vicino all'inizio o alla fine di una parola.
L'immagine seguente dimostra come regolare una selezione trascinando il gripper.
Le immagini seguenti illustrano come richiamare il menu di scelta rapida toccando all'interno della selezione o su un gripper (è anche possibile usare la pressione e il blocco).
Nota Queste interazioni variano in qualche modo nel caso di una parola digitata in modo errato. Toccando una parola contrassegnata come con errori di ortografia, l'intera parola verrà evidenziata e verrà richiamato il menu di scelta rapida dell'ortografia suggerita.
Contenuto non modificabile
L'immagine seguente illustra come selezionare una parola toccando all'interno della parola (non sono inclusi spazi nella selezione iniziale).
Seguire le stesse procedure del testo modificabile per regolare la selezione e visualizzare il menu di scelta rapida.
Manipolazione degli oggetti
Laddove possibile, usare le stesse risorse di controllo (o simili) della selezione del testo quando si implementa la manipolazione di oggetti personalizzati in un'app di Windows. Ciò consente di offrire un'esperienza di interazione coerente nella piattaforma.
Ad esempio, i gripper possono essere usati anche nelle app di elaborazione delle immagini che supportano il ridimensionamento e il ritaglio o le app del lettore multimediale che forniscono barre di stato regolabili, come illustrato nelle immagini seguenti.
Lettore multimediale con indicatore di stato regolabile.
Editor di immagini con strumenti di ritaglio.
Articoli correlati
Per gli sviluppatori
Samples
- Esempio di input di base
- Esempio di input a bassa latenza
- Esempio di modalità di interazione utente
- esempio di elementi visivi di messa a fuoco
Esempi di archivio
Collabora con noi su GitHub
L'origine di questo contenuto è disponibile in GitHub, in cui è anche possibile creare ed esaminare i problemi e le richieste pull. Per ulteriori informazioni, vedere la guida per i collaboratori.
