Проведите, чтобы закрыть

Анимация смахивания для закрытия передает переход, когда пользователи переходят на предыдущую страницу.

Детали анимации смахивания для закрытия аналогичны нажатию RSB. Ваш палец контролирует ход анимации до 50%.

В представлении приложения есть дополнительная анимация, связанная с жестом закрытия. Количество движений, отображаемое в представлении приложения, не совсем совпадает с расстоянием, на которое должен переместиться палец. Вид приложения никогда не должен выходить за край экрана, отображая эффект сжатия с некоторым сопротивлением.

Выполнение

У Wear есть собственная версия Box — SwipeToDismissBox . Это добавляет поддержку жеста смахивания для закрытия, который аналогичен кнопке «Назад» на мобильном телефоне.

SwipeToDismissBox — это составной элемент, который можно закрыть, проведя пальцем вправо.

Чтобы использовать SwipeToDismissBox , необходимо сначала создать состояние. Состояние содержит информацию о направлении прокрутки, запущена ли анимация, текущем значении и цели и т. д. В следующем примере показано, как создать простое пролистывание для отклонения действия:

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)
        }
    }
}

Дополнительную информацию об использовании SwipeToDismissBox в сочетании с библиотекой навигации см. в справочной документации по библиотеке Wear Compose Navigation .

Дизайн

При разработке смахивания для отклонения действия помните о следующих двух принципах:

Край экрана

Учитывайте другие элементы пользовательского интерфейса, которые можно перелистывать, например представления приложений с разбивкой на страницы. Если смахивание для закрытия возможно, зарезервируйте 20 % края экрана, чтобы вызвать это движение.

См. этот пример из кодовой базы Compose Material для Wear OS, где приведен пример смахивания по краю, когда контент прокручивается по горизонтали.

Порог для возврата или продолжения просмотра приложения

Если пользователь провел пальцем по 50 % ширины экрана, приложение должно запустить остальную часть анимации смахивания назад. Если оно меньше этого значения, приложение должно вернуться к полному представлению приложения.

Если жест быстрый, игнорируйте правило порога 50 % и проведите пальцем назад.