Progettazione dell'interfaccia utente Android Nozioni di base sull'ordine Focus Focus

Non c'è niente di più fastidioso di cercare di navigare in un'interfaccia utente mal progettata su un'applicazione mobile. Come si comporta la tua applicazione in termini di navigazione dello schermo può significare la differenza tra un utente felice e uno che ti fiammeggia sull'Android Market. Oggi, ci concentriamo sulla messa a fuoco, ovvero sulla messa a fuoco e su come personalizzarla all'interno delle interfacce utente.

I metodi di input dei dispositivi Android stanno diventando molto diversi: pad direzionali, trackball, touchscreen, tastiere e altro ancora. Alcuni dispositivi, come i tablet, sono principalmente navigabili al tatto. Altri, come Google TV, non hanno touchscreen e si basano su dispositivi di input come quelli con un pad direzionale (d-pad).

Gli sviluppatori Android devono capire in che modo gli utenti navigano i controlli su uno schermo, come e in quale ordine questi controlli dello schermo ottengono e perdono l'attenzione e come personalizzare l'ordine di messa a fuoco dei comandi nelle loro applicazioni per fornire agli utenti un'esperienza senza frustrazione.

Comprensione dell'ordine di messa a fuoco di controllo

La piattaforma Android fa del suo meglio per determinare un ordine di controllo appropriato per un determinato tipo di layout. In molti casi, l'ordine di messa a fuoco di default ha un senso. Tuttavia, questo non è sempre il caso. Il controllo che dovrebbe ottenere la messa a fuoco successiva viene determinato trovando il vicino più prossimo del controllo focalizzato corrente in una determinata direzione (su / giù / sinistra / destra). Quando ci sono più controlli che corrispondono a quella descrizione, la piattaforma esegue la scansione da sinistra a destra, dall'alto verso il basso, proprio come si potrebbe leggere un libro in inglese.

Questo ha alcune implicazioni. Per impostazione predefinita, il controllo più in alto in una schermata non avrebbe nulla su cui concentrarsi se l'utente navigasse? Su ?, né qualcosa accadrebbe se l'utente navigasse? dal controllo in basso sullo schermo. Allo stesso modo, non accadrebbe nulla se l'utente provasse a navigare? dal controllo più a sinistra, o? Giusto? dal controllo più a destra. Non c'è? Involucro? di messa a fuoco, per impostazione predefinita.

Vediamo ora un esempio di come potresti voler modificare il comportamento di messa a fuoco predefinito su uno schermo e farlo funzionare per te e per i tuoi utenti. Ad esempio, supponiamo di voler forzare l'ordine di messa a fuoco per avvolgere circolarmente attorno a una serie di controlli che compongono un quadrante.

Passaggio 0: Introduzione

Forniamo il codice sorgente completo per l'applicazione di esempio discussa in questo tutorial. Puoi scaricare qui il codice sorgente di esempio che forniamo per la revisione.

Passaggio 1: definire un layout con i controlli

Innanzitutto, creare o modificare il file di risorse di layout utilizzato dalla classe Activity, ad esempio /res/layout/main.xml. Ad esempio, il seguente layout definisce una sorta di? Quadrante? di controlli Button utilizzando un RelativeLayout.

               

Lo stile chiamato clockFaceNum è definito nel file /res/values/styles.xml come segue:

    

Lo schermo risultante assomiglia a questo:

Passaggio 2: rivedere l'ordine di messa a fuoco predefinito

Esaminiamo l'ordine di messa a fuoco predefinito per il quadrante del clock Controlli in questo RelativeLayout. Se l'utente è focalizzato sul pulsante 12 e preme? Down? su un pad direzionale, il prossimo controllo da mettere a fuoco sarà il pulsante 11, seguito dal pulsante 10, ecc.

L'impostazione predefinita? Giù? il percorso è mostrato qui:

Passaggio 3: fornire un ordine di messa a fuoco di controllo personalizzato

Diciamo che vogliamo forzare l'utente a essere in grado di attraversare i controlli del quadrante dell'orologio in senso orario o antiorario rispetto all'ordine di messa a fuoco predefinito, come mostrato:

Possiamo definire questo comportamento specificando, per ciascun pulsante, quale controllo dovrebbe acquisire l'attenzione successiva. Esistono quattro attributi XML che è possibile impostare su qualsiasi controllo di visualizzazione per definire l'ordine di messa a fuoco. Questi attributi sono:

  • android: nextFocusUp: questo attributo definisce il controllo che dovrebbe acquisire lo stato attivo se l'utente naviga verso l'alto
  • android: nextFocusDown: questo attributo definisce il controllo che dovrebbe acquisire lo stato attivo se l'utente naviga verso il basso
  • android: nextFocusLeft: questo attributo definisce il controllo che dovrebbe acquisire lo stato attivo se l'utente naviga verso sinistra
  • android: nextFocusRight: questo attributo definisce il controllo che dovrebbe essere attivo se l'utente naviga correttamente

Quindi diciamo che vogliamo tutto? Giù? e? Giusto? navigazione per consentire all'utente di attraversare il quadrante dell'orologio Controlli in senso orario, e tutti? e sinistra? navigazione per consentire all'utente di attraversare i controlli in senso antiorario. Dovremmo quindi definire questi quattro attributi per ogni controllo. Ad esempio, se ti sei trasferito? Giù? o destra? dal pulsante 12, si raggiungerà il pulsante 1. Allo stesso modo, se ti sei trasferito? o? a sinistra? dal pulsante 12, si raggiunge il pulsante 11.

Una definizione completa di questo nuovo layout del quadrante ha il seguente aspetto:

               

Pertanto, il nostro nuovo? Giù? il percorso, che inizia con il pulsante 12, si presenta ora come segue:

Passaggio 4: impostazione della messa a fuoco di controllo iniziale

Infine, ecco un trucco per impostare il controllo predefinito per concentrarsi su un determinato schermo all'interno del file di layout. Puoi farlo solo per un controllo di visualizzazione in ogni file.

Utilizzare il tag all'interno del controllo View per impostare il focus iniziale sullo schermo. Ad esempio, potremmo voler aggiornare il pulsante 12 per ottenere il focus iniziale, come questo:

 

Ovviamente puoi anche usare il metodo programmatico per impostare anche il control focus, usando il metodo della classe View chiamato requestFocus ().

Conclusione

Gli sviluppatori Android devono ricordare che utenti diversi esploreranno l'interfaccia utente di un'applicazione utilizzando metodi di input diversi. Alcuni metodi facilitano il passaggio tra i controlli dello schermo, mentre altri possono rendere la navigazione onerosa. Gli sviluppatori possono fornire ordini di messa a fuoco personalizzati che possono migliorare notevolmente l'esperienza dell'utente con l'applicazione. Si prega di non dimenticare gli utenti della tastiera. ?

Riguardo agli Autori

Gli sviluppatori mobili Lauren Darcey e Shane Conder hanno coautore diversi libri sullo sviluppo di Android: un libro di programmazione approfondito intitolato Sviluppo di applicazioni wireless Android, seconda edizione e Sams ti insegna a sviluppare applicazioni Android in 24 ore, seconda edizione. Quando non scrivono, passano il loro tempo a sviluppare software mobile presso la loro azienda ea fornire servizi di consulenza. Possono essere contattati via email a [email protected], tramite il loro blog su androidbook.blogspot.com e su Twitter @androidwireless.

Hai bisogno di più aiuto nella scrittura di app per Android? Consulta i nostri ultimi libri e risorse!

я я