Stato attivo in Glimmer di Jetpack Compose

Dispositivi XR applicabili
Queste indicazioni ti aiutano a creare esperienze per questi tipi di dispositivi XR.
Scopri di più sui tipi di dispositivi XR →
AI Glasses
Scopri di più sui tipi di dispositivi XR →

Tutti i componenti Glimmer di Jetpack Compose sono progettati per funzionare con metodi di input standard, come un tocco o uno scorrimento sul touchpad degli occhiali AI, pur essendo ricettivi a comandi di input di livello inferiore specifici dell'hardware degli occhiali AI. I componenti Glimmer di Jetpack Compose gestiscono automaticamente gli eventi di input necessari. Per i componenti personalizzati, puoi utilizzare le API Compose esistenti come Modifier.draggable o Modifier.scrollable per implementare comportamenti di interazione specifici.

Sugli occhiali AI con display, l'input del puntatore può influire sulla messa a fuoco:

  • Tocca: interazione diretta per attivare l'elemento. Il focus si sposta su un elemento quando un utente interagisce con esso.
  • Scorrimento: utilizzato per la navigazione e lo scorrimento. I movimenti di scorrimento non gestiti vengono tradotti automaticamente in movimenti di messa a fuoco, consentendo una navigazione dell'interfaccia utente senza input diretto del puntatore.

Movimento e ordine dello stato attivo quando un utente naviga nell'app.

Movimento dello stato attivo

In un contenitore scorrevole, lo stato attivo si sposta continuamente con uno scorrimento sul touchpad. Per gli elementi discreti, come una riga di pulsanti, ogni scorrimento sposta il focus di un elemento alla volta.

Ordine di messa a fuoco

Proprio come in Jetpack Compose, Jetpack Compose Glimmer utilizza la ricerca unidimensionale della messa a fuoco. Per scoprire di più sull'ordine di attraversamento della messa a fuoco, consulta Modificare l'ordine di attraversamento della messa a fuoco.

Per modificare l'elemento inizialmente selezionato, puoi aggiungere un Modifier.focusGroup() di primo livello e specificare un onEnter personalizzato focusProperty:

Modifier.focusProperties {
    onEnter = {
        initialFocus.requestFocus()
        cancelFocusChange()
    }
}
.focusGroup()

Contenitori a scorrimento

Per un'esperienza utente ottimale, i contenitori di scorrimento come gli elenchi devono essere l'unico componente principale di una schermata. Evita di posizionare un elenco scorrevole direttamente sopra o sotto altri elementi interattivi, come pulsanti, per evitare confusione nella navigazione e favorire un movimento del focus fluido e prevedibile.

Stati di messa a fuoco predefiniti

Jetpack Compose Glimmer implementa gli stati di messa a fuoco predefiniti nei suoi componenti interattivi, tra cui superfici, schede ed elementi di elenco, promuovendo un feedback visivo coerente e chiaro durante l'interazione dell'utente.

Figura 1. Tre stati di messa a fuoco in Jetpack Compose Glimmer, che si differenziano utilizzando un feedback visivo basato sul contorno.

  • Predefinito: il colore di sfondo del pulsante deriva da GlimmerTheme.colors.surface, il suo contenuto principale calcola il colore dei contenuti di quella superficie e le icone sono GlimmerTheme.colors.primary.

  • Selezionato: lo spessore del bordo viene aumentato per indicare la selezione.

  • Focus + Pressione: lo sfondo è impostato su GlimmerTheme.colors.surface con opacità completa per comunicare lo stato selezionato.