Skip to content

Commit 13f4c7b

Browse files
m-bertj-piasecki
andauthored
[Docs] Add pressOutAfterAnimation docs (#4573)
## Description Documents the `pressOutAfterAnimation` prop added to `Touchable` and `Pressable` in this stack. ## Test plan Read docs 🤓 --------- Co-authored-by: Jakub Piasecki <jakub.piasecki@swmansion.com>
1 parent fab67d0 commit 13f4c7b

2 files changed

Lines changed: 30 additions & 2 deletions

File tree

‎packages/docs-gesture-handler/docs/components/pressable.mdx‎

Lines changed: 16 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@ Either view styles or a function that receives a boolean reflecting whether the
5252
onPress?: null | ((event: PressableEvent) => void);
5353
```
5454

55-
Called after [`onPressOut`](#onpressout) when a single tap gesture is detected. Details about the event object can be found in the [PressableEvent](#pressableevent) section below.
55+
Called when a single tap gesture is detected. It follows [`onPressOut`](#onpressout), unless [`pressOutAfterAnimation`](#pressoutafteranimation) delays `onPressOut`. Details about the event object can be found in the [PressableEvent](#pressableevent) section below.
5656

5757
### onPressIn
5858

@@ -68,7 +68,7 @@ Called before `onPress` when a touch is engaged. Details about the event object
6868
onPressOut?: null | ((event: PressableEvent) => void);
6969
```
7070

71-
Called before `onPress` when a touch is released (before [`onPress`](#onpress)). Details about the event object can be found in the [PressableEvent](#pressableevent) section below.
71+
Called when a touch is released. When [`pressOutAfterAnimation`](#pressoutafteranimation) is set to `true`, a quick tap the platform deferred calls it after [`onPress`](#onpress). Details about the event object can be found in the [PressableEvent](#pressableevent) section below.
7272

7373
### onLongPress
7474

@@ -201,6 +201,20 @@ needsOffscreenAlphaCompositing?: boolean;
201201

202202
Whether the view should render with an offscreen alpha-compositing buffer when its `opacity` is less than `1`. Defaults to `false`.
203203

204+
<Badges platforms={['android', 'ios']}>
205+
### pressOutAfterAnimation [A][I]
206+
</Badges>
207+
208+
```ts
209+
pressOutAfterAnimation?: boolean;
210+
```
211+
212+
In some cases the platform defers the press, so a quick tap calls `onPressIn` and `onPressOut` almost at the same time and the `pressed` state never shows up.
213+
214+
When set to `true`, `onPressOut` for such a tap is held back so that `pressed` lasts at least 130 ms, matching React Native's `Pressable`. `onPress` is never delayed, so on such a tap it is called before `onPressOut`. Longer presses and presses that were not deferred by the platform keep the usual order.
215+
216+
By default set to `true`. Has no effect on web, where presses are never deferred, or when `simultaneousWith`, `requireToFail` or `block` is passed.
217+
204218
### testOnly_pressed
205219

206220
```ts

‎packages/docs-gesture-handler/docs/components/touchable.mdx‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -586,6 +586,20 @@ cancelOnLeave?: boolean;
586586

587587
Whether the touch should be canceled when the pointer leaves the component. By default set to `true`. On web this prop doesn't have any effect and behaves as if `true` was set.
588588

589+
<Badges platforms={['android', 'ios']}>
590+
### pressOutAfterAnimation [A][I]
591+
</Badges>
592+
593+
```ts
594+
pressOutAfterAnimation?: boolean;
595+
```
596+
597+
In some cases the platform defers the press, so a quick tap calls `onPressIn` and `onPressOut` almost at the same time and feedback driven from these callbacks never shows up.
598+
599+
When set to `true`, `onPressOut` for such a tap is held back until the press-in animation (see [`animationDuration`](#animationduration)) finishes. `onPress` is never delayed, so on such a tap it is called before `onPressOut`. Longer presses and presses that were not deferred by the platform keep the usual order.
600+
601+
By default set to `false`. Has no effect on web, where presses are never deferred.
602+
589603
<Badges platforms={['android']}>
590604
### needsOffscreenAlphaCompositing [A]
591605
</Badges>

0 commit comments

Comments
 (0)