Scorri per ignorare

L'animazione Scorri per ignorare mostra la transizione quando gli utenti passano alla pagina precedente.

I dettagli dell'animazione per ignorare il gesto di scorrimento sono simili alla pressione della risposta RSB. Il dito controlla l'avanzamento dell'animazione fino al 50%.

Nella visualizzazione app è presente un'animazione aggiuntiva collegata al gesto di chiusura. La quantità di movimento mostrata nella visualizzazione dell'app non corrisponde esattamente alla distanza che deve essere percorsa con il dito. La vista dell'app non deve mai uscire dal bordo dello schermo, mostrando un effetto simile a quello di pressione con una certa resistenza.

Implementazione

Wear ha la sua versione di Box, SwipeToDismissBox. In questo modo viene aggiunto il supporto del gesto di scorrimento per ignorare, simile al pulsante Indietro sui dispositivi mobili.

SwipeToDismissBox è un elemento componibile che può essere ignorato scorrendo verso destra.

Per utilizzare SwipeToDismissBox, devi prima creare uno stato. Lo stato contiene informazioni sulla direzione di scorrimento, se un'animazione è in esecuzione, il valore corrente e il target e altro ancora. L'esempio seguente mostra come progettare un semplice scorrimento per ignorare l'azione:

val state = rememberSwipeToDismissBoxState()
SwipeToDismissBox(
    onDismissed = { /* navigateBack */ },
) { isBackground ->
    if (isBackground) {
        Box(modifier = Modifier.fillMaxSize().background(MaterialTheme.colors.secondaryVariant))
    } else {
        Column(
            modifier = Modifier.fillMaxSize().background(MaterialTheme.colors.primary),
            horizontalAlignment = Alignment.CenterHorizontally,
            verticalArrangement = Arrangement.Center,
        ) {
            Text("Swipe to dismiss", color = MaterialTheme.colors.onPrimary)
        }
    }
}

Per ulteriori informazioni sull'utilizzo di SwipeToDeployBox insieme alla Libreria di navigazione, consulta la documentazione di riferimento per la Libreria di navigazione Wear Compose.

Design

Quando progetti lo scorrimento per ignorare l'azione, tieni presente i seguenti due principi:

Bordo dello schermo

Prende in considerazione altri elementi dell'interfaccia utente sfogliabili, come le visualizzazioni dell'app impaginate. Quando è possibile ignorare il gesto di scorrimento, riserva il 20% del bordo dello schermo per attivare quel movimento.

Guarda questo esempio dal codebase di Compose Material per Wear OS, per un esempio di scorrimento sui bordi quando è possibile scorrere orizzontalmente il contenuto.

Soglia per tornare indietro o rimanere nella visualizzazione app

Se l'utente ha trascinato il dito su oltre il 50% della larghezza dello schermo, l'app dovrebbe attivare il resto dell'animazione di scorrimento a ritroso. Se è inferiore, l'app dovrebbe tornare alla visualizzazione completa.

Se il gesto è rapido, ignora la regola di soglia del 50% e scorri indietro.