Przesuń, by zamknąć
Zadbaj o dobrą organizację dzięki kolekcji
Zapisuj i kategoryzuj treści zgodnie ze swoimi preferencjami.
Animowana animacja typu Przesuń, aby zamknąć informuje o przejściu, gdy użytkownik przejdzie na poprzednią stronę.
Szczegóły animacji przesunięcia w celu zamknięcia są podobne do tych dotyczących naciśnięcia przycisku RSB. Palec kontroluje postęp animacji do 50%.
W widoku aplikacji jest dodatkowa animacja powiązana z gesturem odrzucenia. Odległość wyświetlana w widoku aplikacji nie jest taka sama jak odległość, jaką musi pokonać palec. Widok aplikacji nie powinien nigdy wychodzić poza krawędź ekranu. Efekt ściskania powinien być wyświetlany z pewnym oporem.
Implementacja
SwipeDismissableNavHost
z biblioteki komponentów nawigacjidomyślnie zapewnia gest przesuwania w celu zamknięcia.
Jeśli nie korzystasz z biblioteki nawigacji, nadal możesz obsługiwać ten gest nawigacji na pełnym ekranie, korzystając bezpośrednio z BasicSwipeToDismissBox
.
Projektowanie
Podczas projektowania działania „przesuń, aby zamknąć” pamiętaj o tych 2 zasadach:
Krawędź ekranu
uwzględniać inne elementy interfejsu, które można przewijać, np. pogrupowane widoki aplikacji;
Jeśli przesunięcie palcem w stronę odrzucania jest możliwe, zarezerwuj 20% krawędzi ekranu, aby wywołać to działanie.
Przykład przesuwania palcem po krawędzi, gdy treści można przewijać poziomo, znajdziesz w tym przykładzie z kodu źródłowego Compose Material na Wear OS.
Próg, po przekroczeniu którego użytkownik wraca do widoku aplikacji lub pozostaje w niej
Jeśli użytkownik przesunął palcem po ponad 50% szerokości ekranu, aplikacja powinna uruchomić pozostałą część animacji przesuwania do tyłu. Jeśli jest mniejszy, aplikacja powinna
przywrócić pełny widok aplikacji.
Jeśli gest jest szybki, zignoruj zasadę progu 50% i przesuń palcem w drugą stronę.
Treść strony i umieszczone na niej fragmenty kodu podlegają licencjom opisanym w Licencji na treści. Java i OpenJDK są znakami towarowymi lub zastrzeżonymi znakami towarowymi należącymi do firmy Oracle lub jej podmiotów stowarzyszonych.
Ostatnia aktualizacja: 2025-07-27 UTC.
[[["Łatwo zrozumieć","easyToUnderstand","thumb-up"],["Rozwiązało to mój problem","solvedMyProblem","thumb-up"],["Inne","otherUp","thumb-up"]],[["Brak potrzebnych mi informacji","missingTheInformationINeed","thumb-down"],["Zbyt skomplikowane / zbyt wiele czynności do wykonania","tooComplicatedTooManySteps","thumb-down"],["Nieaktualne treści","outOfDate","thumb-down"],["Problem z tłumaczeniem","translationIssue","thumb-down"],["Problem z przykładami/kodem","samplesCodeIssue","thumb-down"],["Inne","otherDown","thumb-down"]],["Ostatnia aktualizacja: 2025-07-27 UTC."],[],[],null,["# Swipe to dismiss\n\n[Swipe to dismiss](/reference/kotlin/androidx/wear/compose/foundation/package-summary#BasicSwipeToDismissBox(androidx.wear.compose.foundation.SwipeToDismissBoxState,androidx.compose.ui.Modifier,kotlin.Any,kotlin.Any,kotlin.Boolean,kotlin.Function2))\nanimation conveys the transition when users navigate to the previous page.\n\nThe animation details for swipe to dismiss are similar to the RSB press. Your\nfinger controls the progress of the animation up to 50%.\n\nThere is an additional animation on the App View that is linked to the dismiss\ngesture. The amount of movement shown on the app view is not exactly the same as\nthe distance that the finger needs to move. The app view should never leave the\nedge of the screen, displaying a squeeze like effect with some resistance.\n\nImplementation\n--------------\n\n[`SwipeDismissableNavHost`](/reference/kotlin/androidx/wear/compose/navigation/package-summary#SwipeDismissableNavHost(androidx.navigation.NavHostController,kotlin.String,androidx.compose.ui.Modifier,kotlin.Boolean,androidx.wear.compose.navigation.SwipeDismissableNavHostState,kotlin.String,kotlin.Function1))\nfrom the [navigation library](/training/wearables/compose/navigation)\nprovides the swipe-to-dismiss navigation gesture by default.\n\nIf you are not using the navigation library, then you can still support this full\nscreen navigation gesture by using [`BasicSwipeToDismissBox`](/reference/kotlin/androidx/wear/compose/foundation/package-summary#BasicSwipeToDismissBox(androidx.wear.compose.foundation.SwipeToDismissBoxState,androidx.compose.ui.Modifier,kotlin.Any,kotlin.Any,kotlin.Boolean,kotlin.Function2))\ndirectly.\n\nDesign\n------\n\nWhen designing the swipe to dismiss action, keep the following two principles\nin mind:\n\n### Edge of the screen\n\nAccount for other UI elements that are swipable, such as paginated app views.\nWhen swipe to dismiss is possible, reserve 20% of the edge of the screen to\ntrigger that motion.\n\nSee this [example from the Compose Material for Wear OS codebase](https://cs.android.com/androidx/platform/frameworks/support/+/androidx-main:wear/compose/compose-material/samples/src/main/java/androidx/wear/compose/material/samples/SwipeToDismissBoxSample.kt;l=151)\nfor an example of edge-swiping when the content is horizontally scrollable.\n\n### Threshold to go back or stay on app view\n\nIf the user has dragged their finger across over 50% of the screen width,\nthe app should trigger the rest of the swipe back animation. If it's less than\nthat, the app should snap back to the full app view.\n\nIf the gesture is quick, ignore the 50% threshold rule and swipe back."]]