Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45413
## Changes
Add an example in RNTester to test that pressability with NativeDrivers works properly.
## Context
The pressability handling is a bit peculiar.
We have to handle 3 main behaviors:
* `PressIn` -> `PressOut` => triggers the `onPress`
* `PressIn` -> move inside the rectangle -> `PressOut` => triggers the `onPress`
* `PressIn` -> move outside the rectangle -> `PressOut` => cancel `onPress`.
For the first case, we detect whether the press happens inside a component in the Native layer only. And everything works.
When a move is involved, we:
1. Detect the initial press in the Native layer
2. We move the coursor and we delegate the detection of whether we are inside of a rect or not to the JS layer
3. The JS layer asks the C++ layer about the layout and decide whether we are in case 2 (move but still inside the rect) or in case 3 (move but outside the rect).
The problem is that with `nativeDriver` and animations, the C++ layer doesn't know about where the receiver view actually is.
This results in issues like the one shown by [#36504](https://github.com/facebook/react-native/issues/36504), where the onMove is not handled correctly.
## Solution
The solution is to keep detecting whether we are in the receiver view or not in the Native layer and pass the receiver view position and size back to JS so that the JS layer don't have to jump to C++ to make this decision.
We decided to pass the frame information because the JS layer is adding some padding and configurations to the final rectangle and we don't want to lose those configurations.
## Changelog
[General][Added] - Add example in RNTester to show that pressability works properly with NativeDrivers
Reviewed By: sammy-SC
Differential Revision: D58182480
fbshipit-source-id: 9ca4fb9a3ca1a8af52ccbe208cbfe8434175f87d
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/36933
Skew is already supported on the platform side; there's no reason to disable animating it.
Changelog:
[General][Added] - Enable animating skew in transforms with native driver
Reviewed By: mdvacca
Differential Revision: D45053914
fbshipit-source-id: 31198c35eeb55211a3ff88c968707db65b025f49
Summary:
Color support for AnimatedInterpolation was incomplete with native drivers, as only rgba type strings were supported. There was also an issue where color props instead a StyleAnimatedNode would never get applied. We were also potentially duplicating color parsing support, which is already centralized in `normalizeColor` / `processColor`.
Changelog: [Android][Added] Enable AnimatedInterpolation to interpolate arbitrary color types.
Reviewed By: mdvacca
Differential Revision: D40571873
fbshipit-source-id: 41857ab0391279c5307bc31b855ea8fbcb4cccd8
Summary:
This change replaces the text in `ColorStylesExample` with two different spans of nested text, which requires special attention with the native driver.
Changelog:
[Internal][Added] - Add Nested Text Animated Color RNTester Example
Reviewed By: genkikondo
Differential Revision: D37762708
fbshipit-source-id: 755e6dd922432781645cd84749a77f29ec57665d
Summary:
Changelog:
[Internal]
Cleans up unnecessary type casts / suppressions throughout the codebase following D35869725.
Reviewed By: javache
Differential Revision: D35870027
fbshipit-source-id: eefcb544b19ba93587011cdfd4046d18dddb246e
Summary:
Changelog:
[Internal] - Add an example to demo Animated colors with both JS and native drivers
Reviewed By: mdvacca
Differential Revision: D34153047
fbshipit-source-id: 9b61fd4e5f597b0440bed7ff1a33716e50ec34e5
Summary:
`Easing` only has static properties and is never constructed or subclassed, so there doesn't seem to be any reason for it to be a class instead of an object.
as a class, Flow errors about `method-unbinding` on every single use of it.
Changelog: [Internal]
Reviewed By: motiz88
Differential Revision: D33774944
fbshipit-source-id: c0bd2e3d7a78e538f95b88b2b1b12d301c8f590c
Summary:
This diff runs the codemod to add type annotations to function parameters in preparation for Flow's local type inference (LTI) project. I ran the codemod over xplat/js and reverted any files that had flow errors in them. See the list of commands run to see the regeneration of various files.
Changelog:
[Internal][Changed] - Added type annotations
Reviewed By: yungsters
Differential Revision: D32075270
fbshipit-source-id: 6a9cd85aab120b4d9e690bac142a415525dbf298
Summary: Changelog: [Internal] - Add an example to demo all the transform properties.
Reviewed By: charlesbdudley
Differential Revision: D29865790
fbshipit-source-id: 79174457071de8fca9b0aab8bf8dcc543ea9a0a3
Summary:
- Update `RNTesterNavBar` to be positioned relatively to allow for scroll views to not be clipped
- Add EasingExample with example animations taken from https://reactnative.dev/docs/easing
Changelog: [Internal]
Reviewed By: lunaleaps
Differential Revision: D29744160
fbshipit-source-id: d0e2112769d74dd34e11477f1d3b1f8f0ffebc03
Summary:
Changelog: [Internal] - Update Animation examples to toggle useNativeDriver
There are issues when we toggle the native driver on and off. Where once off, the animations don't seem to update anymore, until we turn nativeDriver back on. See videos in testplan
Reviewed By: yungsters
Differential Revision: D29774939
fbshipit-source-id: cf6d70c1b574a87bb803510196dfb273b36de5e1
Summary:
Changelog:
[Internal] - Rename some types and components in RNTester to support work for tertiary levels of navigation.
module = component | api
moduleExample = an example of a certain feature a module
Reviewed By: kacieb
Differential Revision: D29381875
fbshipit-source-id: c348bcbb73aaf95e85928bb14080a097e685cc78
Summary: Changelog: [Internal] - Update expectations on RNTester's Animated Moving Box example. We don't restore defaults for the animated value on unmount. Also adds a Reset option to the example.
Reviewed By: kacieb
Differential Revision: D29143505
fbshipit-source-id: abb1e87530313cfbfe9c4985e651667d28589a67
Summary:
This pre-suppresses the 154 error diff ahead of its release, since it is large.
Changelog: [Internal]
Reviewed By: samwgoldman
Differential Revision: D29065246
fbshipit-source-id: f418041305a46df410dcbe3d9a4db81a61ac7014
Summary:
Minor changes to the `Animated` examples index module to make the static typing a bit more intuitive.
Changelog:
[Internal]
Reviewed By: kacieb
Differential Revision: D28799742
fbshipit-source-id: f798631081538e79fc58377105db4e47b9728843
Summary:
Minor reorganization of `AnimatedGratuitousApp` to be a separate top-level directory in `examples/`, like `Animated`.
Changelog:
[Internal]
Reviewed By: kacieb
Differential Revision: D28799737
fbshipit-source-id: b0329e420d6eae912e91d0d74b68ac299c9bd9f3
Summary:
This pre-suppresses the 153 error diff ahead of its release, since it is large.
Changelog: [Internal]
Reviewed By: mroch
Differential Revision: D28754374
fbshipit-source-id: 1806f53bc7d804644d434583a2dcd6da63d00328
Summary:
Changelog:
[Internal][Changed] - Move FadeInView example to separate module in RNTester and refactor to use functional component
Reviewed By: nadiia
Differential Revision: D27245473
fbshipit-source-id: bd9aacc17203dadcee134eee1bae54a5daa16cde
Summary:
Context: in non-Fabric (classic) RN, LayoutAnimations is disabled by default on Android; and this is needed to enable LayoutAnimations globally for Android.
Reasoning: in Fabric this noops, because LayoutAnimations are unconditionally enabled in Android+Fabric; and to support StaticViewConfig and Bridgeless RN, we need to remove direct UIManager calls.
Potential impact: On Android and for non-Fabric users only, some transitions will not be animated. Given that LayoutAnimations in non-Fabric RN on Android are not stable and have lots of known un-fixable crashes, this will probably increase stability for non-Fabric Android users. For iOS or Fabric users there's no impact.
Changelog: [Changed][Android] LayoutAnimations in AnimatedGratuitousApp disabled for non-Fabric Android devices
Reviewed By: mdvacca
Differential Revision: D27273392
fbshipit-source-id: 786d5d2f2b05591ca747aab134fb3f321500fece
Summary:
## Changelog
<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://github.com/facebook/react-native/wiki/Changelog
-->
This PR aims to migrate the RNTester App to `packages` directory. But is currently, open to inspect the CI issues and resolve the merge conflicts.
Currently done
- Working on iOS
- Working on Android
- Detox Tests working on iOS
Need to work on
- Errors generated by the CI builds
[General] [Changed] - Migrated the RNTester App to the packages directory.
Pull Request resolved: https://github.com/facebook/react-native/pull/29567
Test Plan: It runs on both ios and android for now and the detox iOS builds are working.
Reviewed By: cpojer
Differential Revision: D23034761
Pulled By: rickhanlonii
fbshipit-source-id: e04bb06e1c7ef15d340206090d1575a871b9e6f5
Sam Zhou
Riccardo Cipolleschi
zhongwuzw
Biki-das
George Zahariev
Moti Zilberman
Gabriel Donadel Dall'Agnol
Genki Kondo
Pieter De Baets
Nick Gerleman
Moti Zilberman
Genki Kondo
Marshall Roch
Andres Suarez
Evan Yeung
Tim Yung
Luna Wei
Charles Dudley
Daniel Sainati
Joshua Gross
Nadiia D
