Commit Graph
20 Commits
Author SHA1 Message Date
Genki Kondo d3a0c4129d Support string color values in Animated.Color
Summary:
In addition to rgba values, allow creating Animated.Color with a string color.

Followup changes will include support for platform colors and native driver.

Changelog:
[General][Added] - Support string color values in Animated.Color

Reviewed By: javache

Differential Revision: D33810717

fbshipit-source-id: 208bc2675b6153a515fbf2122da15a065c473e73
2022-01-27 17:36:35 -08:00
Genki Kondo ea90a76efe Initial non-native implementation of AnimatedColor
Summary:
Creates Animated.Color for animating color props.

Implement AnimatedColor, which basically consists of 4 AnimatedValues (along the same vein as ValueXY) which allows us to just use AnimatedValue's interpolation. Provides a string color value of shape 'rgba(r, g, b, a)'

AnimationNode DAG looks like:

{F696076974}

Followup changes will include support for string color values, platform colors, and native driver.

Changelog:
[General][Added] - New Animated.Color node

Reviewed By: mdvacca

Differential Revision: D33778456

fbshipit-source-id: 83ddbc955156bf589c864f229a5f83fe6875fd0e
2022-01-27 13:37:59 -08:00
Genki Kondo 8858c21124 Make sure that AnimatedTracking is started when CompositeAnimation.start is called
Summary:
In Animated, when a toValue of AnimatedValue (as opposed to a number) is passed in, the [AnimatedValue starts tracking via AnimatedTracking](https://www.internalfb.com/code/fbsource/[b688f3747a706236fce300636978ed1ca5e4081a]/xplat/js/react-native-github/Libraries/Animated/AnimatedImplementation.js?lines=142) but it doesn't actually start animating even if start() is called on the animation.

This behavior is inconsistent with a toValue of a number, which executes immediately on start(). This diff adds a call to AnimatedTracking.update within AnimatedValue.track, which starts the tracking animation.

Changelog:
[General][Fixed] - Fixes execution of animation when a toValue of AnimatedValue is used.

Reviewed By: JoshuaGross

Differential Revision: D33800373

fbshipit-source-id: 85ee6f51bc2bb2e078b586b076a8d1dfe92c1155
2022-01-26 21:23:54 -08:00
Andres Suarez 8bd3edec88 Update copyright headers from Facebook to Meta
Reviewed By: aaronabramov

Differential Revision: D33367752

fbshipit-source-id: 4ce94d184485e5ee0a62cf67ad2d3ba16e285c8f
2021-12-30 15:11:21 -08:00
Eric Rozell fe53cae954 Deduct offset from getValue result when detaching
Summary:
The NativeAnimated `getValue` API returns `value + offset`:
Android:
iOS: https://github.com/facebook/react-native/blob/main/Libraries/NativeAnimation/Nodes/RCTValueAnimatedNode.m#L44
Android: https://github.com/facebook/react-native/blob/main/ReactAndroid/src/main/java/com/facebook/react/animated/ValueAnimatedNode.java#L36

When we store the value after detaching the NativeAnimated node, it stores the result of the NativeAnimated `getValue` call to the `_value` property, so if we call `__getValue` at some later point on the `AnimatedValue`, we will count the offset twice.

This change deducts the offset value from the result returned from `getValue` when storing the latest value.

Changelog:
[General][Fixed] - AnimatedValue.__detach should store getValue result with offset deducted

Reviewed By: yungsters

Differential Revision: D32987003

fbshipit-source-id: 488d1fe512f886c7a9de1e5a4de8f19441ebd81e
2021-12-10 08:07:38 -08:00
Eric Rozell 8ba771c3dd Fire AnimatedValue.stopAnimation callback with correct native value
Summary:
AnimatedValue fires a callback with the current value (raw value + offset) after calling it's `stopAnimation` method. The `_value` field on the `AnimatedValue` node is not necessarily kept in sync with the NativeAnimated value node, so the value provided to the callback may be out of sync.

This change checks if the `AnimatedValue` is a native node and passes the callback to the `NativeAnimatedAPI.getValue` callback, defaulting to the previous current JS node state if the node is not native.

Changelog:
[General][Fixed] - AnimatedValue.stopAnimation callback with correct value for NativeAnimated

Reviewed By: yungsters

Differential Revision: D32968572

fbshipit-source-id: b83f86eabe5456f762a15bc29cacb43f84513f6c
2021-12-09 11:40:13 -08:00
Tim Yung 148c98ec80 RN: Resolve Outstanding ESLint Warnings
Summary:
Resolves outstanding ESLint warnings in React Native.

Changelog:
[Internal]

Reviewed By: lunaleaps

Differential Revision: D32291912

fbshipit-source-id: 61337d5a5a0e6ed55f732675e029f4b76d850af9
2021-11-09 21:46:21 -08:00
Tim Yung 77ecc7ede1 JS: Format with Prettier v2.4.1 [3/n]
Summary:
Changelog:
[General][Internal]

Reviewed By: zertosh

Differential Revision: D31883447

fbshipit-source-id: cbbf85e4bf935096d242336f41bf0cc5d6f92359
2021-11-02 22:14:16 -07:00
Pieter De Baets 27dd2ecb70 Fix validation of AnimatedEvent with AnimatedValueXY
Summary: Changelog: [General][Fixed] Support Animated.ValueXY when validating Animated.event

Reviewed By: yungsters

Differential Revision: D30779011

fbshipit-source-id: 56f4d9eb6a20200584e5429a1693d0703f8c1a37
2021-09-09 04:31:58 -07:00
Tim Yung 8ccc4064c5 Animated: Setup Experiment Injection
Summary:
Sets up an injection mechanism for experimenting in production with an alternate implementation of `createAnimatedComponent`.

This will be used to implement and refine a new `createAnimatedComponent` that is compatible with concurrent rendering.

Changelog:
[Internal]

Reviewed By: lunaleaps

Differential Revision: D28799739

fbshipit-source-id: 46ba2dd6137f7bf73ce8a659698533ed3985516f
2021-06-02 22:36:13 -07:00
Tim Yung faf4550047 Animated: Decouple __attach from new AnimatedProps
Summary:
Decouples `__attach` from the constructor in `AnimatedProps`.

This change will enable the instantiation of `AnimatedProps` (and subsequent invocation of `__getValue()`) without having to trigger side effects until after mount or update. This is important in order for `Animated` to ever become safe for Concurrent Mode.

Changelog:
[Internal]

Reviewed By: lunaleaps

Differential Revision: D28271628

fbshipit-source-id: 6ccfed6de79382cecdfa6939c7dad3134e1ecaaa
2021-05-10 17:02:59 -07:00
Tim Yung ae4946f983 Animated: Remove Animated.__PropsOnlyForTests
Summary:
Deletes `Animated.__PropsOnlyForTests` because it is unnecessary for actually testing `AnimatedProps`.

Changelog:
[General][Removed] - Removed `Animated.__PropsOnlyForTests`.

Reviewed By: kacieb

Differential Revision: D28271629

fbshipit-source-id: 7d4c83d72f7298ed43e3659126cb45d271c5dac7
2021-05-07 21:05:58 -07:00
Andrei Shikov ef0db95300 Back out "Adjust animation batch numbers to be consistent when controlled by native"
Summary:
This change caused crashes in animations on some surfaces.

Changelog: [Internal]

Reviewed By: JoshuaGross

Differential Revision: D28013969

fbshipit-source-id: 95845c69d6e67d59582ea14ad08cbf42fd3e2f8f
2021-04-27 04:00:16 -07:00
Andrei Shikov bda032af6e Adjust animation batch numbers to be consistent when controlled by native
Summary:
D27682424 (https://github.com/facebook/react-native/commit/ea1ff374de2ece7d1698b14d4e1aa8075df22cdd) updated how animated node batches are executed in Fabric. On Paper, these batches were controlled by native module in some places (batch was executed ~every 2 frames), but some animations were switching animation batching control to JS globally there as well.

This change updates two things:
- If batching is controlled by native, it makes sure batches are calculated correctly.
- At the same time, this change switches control for animation node batching to JS, aligning it with Fabric.

Changelog: [Internal]

Reviewed By: JoshuaGross, mdvacca

Differential Revision: D27939659

fbshipit-source-id: d6251bce2a303a4a007dc10297edc0175cc4b348
2021-04-23 15:07:35 -07:00
Micha Reiser 93377ff508 Remove "use strict" directive from ES Modules
Summary:
ES Modules implicitly enable strict mode. Adding the "use strict" directive is, therefore, not required.

This diff removes all "use strict" directives from ES modules.

Changelog:

[Internal]

Reviewed By: motiz88

Differential Revision: D26172715

fbshipit-source-id: 57957bcbb672c4c3e62b1db633cf425c1c9d6430
2021-02-02 11:12:56 -08:00
Tim Yung 9c9e677918 RN: Remove react-animated Legacy Package
Summary:
Removes the legacy `react-animated` package configuration and collapses the `Animated/src/` directory into `Animated/`.

Also, reconfigures all references to `Animated/src/` to just be `Animated/`.

Changelog:
[Internal]

Reviewed By: cpojer

Differential Revision: D22450848

fbshipit-source-id: 9fd4861e9f357d817d82e9fec71967a2936a3830
2020-08-25 14:15:35 -07:00
Christopher Chedeau a50b4ea7b9 Initial web implementation
Summary: @​public

This diff does a couple of things:
- Move all the code in a src/ folder
- Move bezier.js in the Animated folder
- Rename Animated.js into AnimatedImplementation.js and adds two entry points: AnimatedReactNative.js and AnimatedWeb.js
- Implement very dumb polyfills for flattenStyle, Set and InteractionManager
- Import my work in progress demo.html file to make sure that the code is actually working.

Everything is not working correctly:
- It calls forceUpdate on every frame and doesn't use bindings because setNativeProps is not implemented
- None of the style: {transform} are working because React web doesn't know about the array notation for transform
- The demo need more work

Reviewed By: @sahrens

Differential Revision: D2464277
2015-09-22 11:58:37 -07:00
Christoph Pojer fa01b2e4cb Codemod tests to use top-level-requires
Reviewed By: @DmitrySoshnikov

Differential Revision: D2456250
2015-09-19 15:41:29 -07:00
Spencer Ahrens 9ad2c322c0 [RN] improve elastic easing
Summary:
1) Makes params more intuitive (only one now, bounciness, which maps intuitively to number of oscillations).
2) Satisfies boundary conditions (f(0) = 0, f(1) = 1) so animation actually goes where you tell it (before it would finish at a random location depending on the input params).
3) Simple test to verify boundary conditions.
2015-08-31 13:39:00 -08:00
Eric Vicenti 6f17dba39b [ReactNative] Remove POPAnimation
Summary:
Thanks to @vjeux' work on Animated, we have transitioned away from POPAnimation entirely
2015-08-20 22:24:28 -07:00