Commit Graph

50 Commits

Author SHA1 Message Date
Genki Kondo 49f3f47b1e Support color animation with native driver for iOS
Summary:
Adds support for Animated.Color with native driver for iOS. Reads the native config for the rbga channel AnimatedNodes, and on update(), converts the values into a SharedColor.

Followup changes will include support for platform colors.

Ran update_pods: https://www.internalfb.com/intern/wiki/React_Native/Preparing_to_Ship/Open_Source_Pods/

Changelog:
[iOS][Added] - Support running animations with AnimatedColor with native driver

Reviewed By: sammy-SC

Differential Revision: D33860583

fbshipit-source-id: 990ad0f754a21e3939f2cb233bcfa793ef12eb14
2022-02-10 11:18:39 -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
Samuel Susla 569c1cdce9 Remove unused property _rootTag RCTPropsAnimatedNode
Summary:
changelog: [internal]

`_rootTag` is never assigned to and never read, let's remove it.

Reviewed By: RSNara

Differential Revision: D30667860

fbshipit-source-id: f4b89ebe6b6d26559188b0e19682f5ac765d40b6
2021-09-01 10:27:31 -07:00
Samuel Susla beb3c2b538 Back out "Flush operations queue when animation starts in RCTNativeAnimatedModule"
Summary:
Changelog: [internal]

Original commit changeset: d3fc021dd434

Reviewed By: motiz88

Differential Revision: D30223203

fbshipit-source-id: 8edf79e109858855d13a36fabab2bcae36180df2
2021-08-10 09:48:38 -07:00
Samuel Susla f3374d0508 Flush operations queue when animation starts in RCTNativeAnimatedModule
Summary:
changelog: [internal]

If nodesManager has the information if animated node is managed by Fabric, we can't decide if the operation queue should be flushed before it is flushed. Therefore, keep the information about animated nodes inside a set instead of nodesManager.

For simplicity, I will refer to class `RCTNativeAnimatedTurboModule` as *NativeAnimated* and to `RCTNativeAnimatedNodesManager` as *NodesManager*

Notice that each call to *NativeAnimated* is queued up in `_operations` or `_preOperations`. When the queues are flushed, only then methods are called on `RCTNativeAnimatedNodesManager`.

There are two mechanisms that flush operations.
One is triggered by `RCTMountingManager` before mounting operations are applied and after they are applied. This works fine but is important to paint the picture.

The second mechanism is inside `[RCTNativeAnimatedTurboModule startAnimatingNode]`. It flushes the queues for Fabric nodes only (not sure why Fabric nodes only, I couldn't find any explanation in old diffs). It checks with *NativeAnimated* if a node is managed by Fabric. Keep in mind, *NodesManager* only knows about the nodes when the queues have been flushed.

Exampe:
JavaScript calls methods on *NativeAnimated*.
For example:
1. `createNode`
2. `connectAnimatedNodeToView`
3. `startAnimatingNode`. (here, the queues should be flushed, since we are in Fabric)

All of these operations are queued up and for as long as `RCTMountingManager` executes mounting, all proceeds as expected.
But if those operations happen after mounting phase, `startAnimatingNode` will not flush the operations queues, because it can't tell if nodeTag is managed by fabric or it isn't. This is because *NodesManager* hasn't been notified about any new nodes.

Reviewed By: RSNara

Differential Revision: D30099010

fbshipit-source-id: d3fc021dd4346d1cbbda3b49ecd9d982c543e705
2021-08-09 12:20:28 -07:00
Peter Argany b231e3ab41 Fix CircleCI breakage in RCTPropsAnimatedNode (#29800)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/29800

I changed this line in D23272735 (https://github.com/facebook/react-native/commit/700960c9f1a27a12d703b4f0a17673690799f019), to conform to normal ObjC semantics: impl files can import their header by file name.

I forgot that their's some special linking logic happening in this directory that doesn't allow for this import type.

This diff just reverts one line to fix CircleCI builds.

Changelog: [Internal]

Reviewed By: shergin

Differential Revision: D23399893

fbshipit-source-id: 976199c659522effd632aaeb38616d0d6c962f1f
2020-08-31 11:39:54 -07:00
Peter Argany 700960c9f1 Pass SurfacePresenter directly instead of relying on bridge
Summary:
`RCTPropsAnimatedNode` uses the bridge to access it's current surface presenter to perform animations.

In bridgeless mode, the surface presenter is not owned by the bridge. Instead, pass the surface presenter through the ownership chain:
`RCTNativeAnimated*Module` -> `RCTNativeAnimatedNodesManager` -> `RCTPropsAnimatedNode`

`RCTSurfacePresenter` should not be strongly held by any of these animation internals. If it gets destroyed at a higher level, animations should not be completed.

Changelog: [Internal]

Differential Revision: D23272735

fbshipit-source-id: ce08ee3b59ac2ba70e31cebb7ba8e9f3a644c848
2020-08-24 16:37:49 -07:00
Samuel Susla 163ec924fb Disable restoreDefaultValues in Native Animated in Fabric
Summary:
Changelog: [Internal]

# Problem

Before every update, restoreDefaults is called on animated nodes. In paper this makes sure no stale properties are on animated nodes. In paper it works fine because restoreDefaults is called before mounting and animations are triggered after mounting within single commit.

Details: https://github.com/facebook/react-native/pull/11819

In Fabric however it is called outside of other mounting operations and it applies default values to the view and then re-applies animated values.

Reviewed By: JoshuaGross

Differential Revision: D21786765

fbshipit-source-id: a2cb6d6d9cbd39d4c403c97c2f51e7d92078102f
2020-05-29 13:57:38 -07:00
Andres Suarez 3b31e69e28 Tidy up license headers [2/n]
Summary: Changelog: [General] [Fixed] - License header cleanup

Reviewed By: yungsters

Differential Revision: D17952694

fbshipit-source-id: 17c87de7ebb271fa2ac8d00af72a4d1addef8bd0
2019-10-16 10:06:34 -07:00
Anatolii Shevchenko d8e335df0e Remove ; from method implementation definition
Summary: Removing excessive semicolon ";" symbol from method implementation definition.

Reviewed By: adamjernst

Differential Revision: D16912006

fbshipit-source-id: 9c3e778a107e8fd0055f40a95ea9ca58d461e1c5
2019-08-21 15:49:16 -07:00
Kevin Gozali d2e18a1c5c iOS: Revert RCT->RN prefix renaming to avoid confusion
Summary: The previous rename from RCT->RN prefix ended up causing some confusions on which prefix to use for which files and under what circumstances. To avoid further confusion before we're done with the re-architecture project, let's keep them as RCT.

Reviewed By: mdvacca

Differential Revision: D16705566

fbshipit-source-id: 395bff771c84e5ded6b2261a84c7549df1e6c5e5
2019-08-08 07:21:25 -07:00
Kevin Gozali 9420de6860 iOS: codemod react-native-github: RCT->RN prefix for Fabric
Summary: Fabric ObjC(++) files will be prefixed by RN* for the time being, this codemod is a simple rename. This includes `interface` and `protocol` definition

Reviewed By: PeteTheHeat, yungsters

Differential Revision: D16611524

fbshipit-source-id: 868d2571ea2414dde4cbb3b75b1334b779b5d832
2019-08-01 20:06:04 -07:00
James Treanor 8131b7bb7b CocoaPods frameworks compatibility: Step 2 (#25619)
Summary:
This is my proposal for fixing `use_frameworks!` compatibility without breaking all `<React/*>` imports I outlined in https://github.com/facebook/react-native/pull/25393#issuecomment-508457700. If accepted, it will fix https://github.com/facebook/react-native/issues/25349.

It builds on the changes I made in https://github.com/facebook/react-native/pull/25496 by ensuring each podspec has a unique value for `header_dir` so that framework imports do not conflict. Every podspec which should be included in the `<React/*>` namespace now includes it's headers from `React-Core.podspec`.

The following pods can still be imported with `<React/*>` and so should not have breaking changes: `React-ART`,`React-DevSupport`, `React-CoreModules`, `React-RCTActionSheet`, `React-RCTAnimation`, `React-RCTBlob`, `React-RCTImage`, `React-RCTLinking`, `React-RCTNetwork`, `React-RCTPushNotification`, `React-RCTSettings`, `React-RCTText`, `React-RCTSettings`, `React-RCTVibration`, `React-RCTWebSocket` .

There are still a few breaking changes which I hope will be acceptable:

- `React-Core.podspec` has been moved to the root of the project. Any `Podfile` that references it will need to update the path.
- ~~`React-turbomodule-core`'s headers now live under `<turbomodule/*>`~~ Replaced by https://github.com/facebook/react-native/pull/25619#issuecomment-511091823.
- ~~`React-turbomodulesamples`'s headers now live under `<turbomodulesamples/*>`~~ Replaced by https://github.com/facebook/react-native/pull/25619#issuecomment-511091823.
- ~~`React-TypeSaferty`'s headers now live under `<TypeSafety/*>`~~ Replaced by https://github.com/facebook/react-native/pull/25619#issuecomment-511040967.
- ~~`React-jscallinvoker`'s headers now live under `<jscallinvoker/*>`~~ Replaced by https://github.com/facebook/react-native/pull/25619#issuecomment-511091823.
- Each podspec now uses `s.static_framework = true`. This means that a minimum of CocoaPods 1.5 ([released in April 2018](http://blog.cocoapods.org/CocoaPods-1.5.0/)) is now required. This is needed so that the ` __has_include` conditions can still work when frameworks are enabled.

Still to do:

- ~~Including `React-turbomodule-core` with `use_frameworks!` enabled causes the C++ import failures we saw in https://github.com/facebook/react-native/issues/25349. I'm sure it will be possible to fix this but I need to dig deeper (perhaps a custom modulemap would be needed).~~ Addressed by https://github.com/facebook/react-native/pull/25619/commits/33573511f02f3502a28bad48e085e9a4b8608302.
- I haven't got Fabric working yet. I wonder if it would be acceptable to move Fabric out of the `<React/*>` namespace since it is new? �

## Changelog

[iOS] [Fixed] - Fixed compatibility with CocoaPods frameworks.
Pull Request resolved: https://github.com/facebook/react-native/pull/25619

Test Plan:
### FB

```
buck build catalyst
```

### Sample Project

Everything should work exactly as before, where `use_frameworks!` is not in `Podfile`s. I have a branch on my [sample project](https://github.com/jtreanor/react-native-cocoapods-frameworks) here which has `use_frameworks!` in its `Podfile` to demonstrate this is fixed.

You can see that it works with these steps:

1. `git clone git@github.com:jtreanor/react-native-cocoapods-frameworks.git`
2. `git checkout fix-frameworks-subspecs`
3. `cd ios && pod install`
4. `cd .. && react-native run-ios`

The sample app will build and run successfully. To see that it still works without frameworks, remove `use_frameworks!` from the `Podfile` and do steps 3 and 4 again.

### RNTesterPods

`RNTesterPodsPods` can now work with or without `use_frameworks!`.

1. Go to the `RNTester` directory and run `pod install`.
2. Run the tests in `RNTesterPods.xcworkspace` to see that everything still works fine.
3. Uncomment the `use_frameworks!` line at the top of `RNTester/Podfile` and run `pod install` again.
4. Run the tests again and see that it still works with frameworks enabled.

Reviewed By: PeteTheHeat

Differential Revision: D16465247

Pulled By: PeteTheHeat

fbshipit-source-id: cad837e9cced06d30cc5b372af1c65c7780b9e7a
2019-07-24 23:27:09 -07:00
Min ho Kim 84f5ebe4f9 Fix typos (#25770)
Summary:
Fix typos mostly in comments and some string literals.

## Changelog

[General] [Fixed] - Fix typos
Pull Request resolved: https://github.com/facebook/react-native/pull/25770

Differential Revision: D16437857

Pulled By: cpojer

fbshipit-source-id: ffeb4d6b175e341381352091134f7c97d78c679f
2019-07-23 03:23:11 -07:00
Mikael Sand bdc530b9bb Fix connection of animated nodes and scroll offset with useNativeDriver. (#24177)
Summary:
Add example showing regression before this fix is applied.

https://github.com/facebook/react-native/pull/18187 Was found to introduce a regression in some internal facebook code-base end to end test which couldn't be shared. I was able to create a reproducible demo of a regression I found, and made a fix for it. Hopefully this will fix the internal test, such that the pr can stay merged.

## Changelog

[GENERAL] [Fixed] - Fix connection of animated nodes and scroll offset with useNativeDriver.
Pull Request resolved: https://github.com/facebook/react-native/pull/24177

Reviewed By: rickhanlonii

Differential Revision: D14845617

Pulled By: cpojer

fbshipit-source-id: 1f121dbe773b0cde2adf1ee5a8c3c0266034e50d
2019-06-06 04:52:19 -07:00
Spencer Ahrens 7b59c5a47e More iOS animation fixes
Summary:
Main change is to the property diffing - we now use the last known props set on the view rather than the default props to compute the diff. This requires exposing a `getProps` method on all view components which should be fine I think.

I also realized that in more complex animations with multiple nodes, the node that the animation starts on might not be connected to a view, so we don't know if it's fabric just based on that, so we have to do a recursive search through the children to find if there are any that are associated with a fabric view to decide we should start the animation immediately. Unfortunately there can still be a timing gap here since the animated API is async and the uimanager API is sync - I'll need to change the animated API to be sync to completely fix this.

Reviewed By: shergin

Differential Revision: D14732028

fbshipit-source-id: 882c056b0b63aa576f8e42439be405cf7fb3147a
2019-04-08 09:15:14 -07:00
Christoph Nakazawa 95c7db90b8 Back out "[react-native][PR] Support Interpolation of strings when using native driver in Animated, fix Expected node to be marked as "native", optimize AnimatedNode creation and connections"
Summary: Original commit changeset: 82a948a95419

Reviewed By: TheSavior

Differential Revision: D14631845

fbshipit-source-id: f20d8150bccf50ea85388761e2f31ca4f97ae158
2019-03-26 17:13:11 -07:00
Mikael Sand 5e4a5892b9 Support Interpolation of strings when using native driver in Animated, fix Expected node to be marked as "native", optimize AnimatedNode creation and connections (#18187)
Summary:
Allow interpolation of strings with useNativeDriver. This allows animating much more of react-native-svg. This PR adds support for native animation of lengths with units, path data, colors etc. Plus, fixing the redundantly created nodes and (and thus, previously incorrect) connection of native animated nodes, improving performance.

Docs will need to change, specifying that string interpolation works with the native driver as well.

[GENERAL] [Added] Add support for native driven string interpolation in Animated
[GENERAL] Fix exception: Expected node to be marked as "native"
[GENERAL] Fix connection of AnimatedNodes and creation of redundant AnimatedNodes
Pull Request resolved: https://github.com/facebook/react-native/pull/18187

Differential Revision: D14597147

Pulled By: cpojer

fbshipit-source-id: 82a948a95419236be7931a8cc4ff72f41e477e9c
2019-03-26 09:33:25 -07:00
Max Komarychev cc3f9a7538 Fix native implementation of Animated.modulo (#23973)
Summary:
fixes #23875
[ios,android][fixes] incorrect behavior of `Animated.modulo`

Use the same formula as used in js: `mod(a,m)=>(a % m + m) % m` (https://github.com/facebook/react-native/blob/master/Libraries/Animated/src/nodes/AnimatedModulo.js#L35)

Native implementation of `Animated.modulo` was different from what was used in javascript, more details available here: https://github.com/facebook/react-native/issues/23875

[iOS] [Fixed] incorrect behavior of Animated.modulo
[Android] [Fixed] incorrect behavior of Animated.modulo
Pull Request resolved: https://github.com/facebook/react-native/pull/23973

Differential Revision: D14502697

Pulled By: cpojer

fbshipit-source-id: befef2b99ae758f98459caaadc8ebdbbd547e69a
2019-03-18 07:40:56 -07:00
Spencer Ahrens 544d9fb10b Use surface observer for Animated
Summary:
Right now we rely on the Paper UIManager to update animated node graphs - this hooks us into `RCTSurfacePresenter` in the same way so we are no longer reliant on Paper. Should also help with complex ordering corner cases with pre vs. post operations and restoring defaults when nodes are removed. More info:

https://github.com/facebook/react-native/pull/11819/files

Note that we don't have a way to differentiate animation nodes related to fabric views vs. paper views, so if paper and fabric are both rendering updates simultaneously it's possible they could get processed by the wrong callback. That should be very rare, rarely cause problems even if it does happen, and won't be a problem at all in a post-Paper world.

Reviewed By: shergin

Differential Revision: D14336760

fbshipit-source-id: 1c6a72fa67d5fedbaefb21cd4d7e5d75484f4fae
2019-03-07 17:39:00 -08:00
Spencer Ahrens 3e40837a85 Fix animation delay
Summary:
We currently rely on the Paper UIManager calling `uiManagerWillPerformMounting` to flush the animated operations queue, which includes starting and stopping animations. This mostly works right now because Fabric always starts after Paper, but sometimes Paper doesn't fire `uiManagerWillPerformMounting` for a while, which can delay an animation starting.

To fix this, I force a flush of the queues on the UIThread whenever start or stop is called. This should be safe because the order of animation operations is still preserved, and start/stop are (almost?) always called in dedicated event handler loops, so any other updates like changing the way nodes are attached should already have been processed from a previous JS execution loop.

Reviewed By: JoshuaGross

Differential Revision: D14313502

fbshipit-source-id: 2a2b0c614fd1a591bd04b6b3fafcc09ff6c9d6e7
2019-03-07 17:39:00 -08:00
Spencer Ahrens ea54ceca13 basic useNativeDriver functionality
Summary:
Not super clean, but not terrible.

Unfortunately this still relies on the old Paper UIManager calling delegate methods to flush the operations queues. This will work for Marketplace You since Paper will be active, but we need to fix this, along with Animated Events which don't work at all yet.

Random aside: it seems like taps are less responsive in fabric vs. paper, at least on iOS. There is a sporadic delay between the touches event coming in nativly to the JS callback invoking the native module function to start the animation - this will need some debugging.

Reviewed By: shergin

Differential Revision: D14143331

fbshipit-source-id: 63a17eaafa1217d77a532a2716d9f886a96fae59
2019-02-25 12:25:34 -08:00
Héctor Ramos 1151c096da Update copyright headers to yearless format
Summary: This change drops the year from the copyright headers and the LICENSE file.

Reviewed By: yungsters

Differential Revision: D9727774

fbshipit-source-id: df4fc1e4390733fe774b1a160dd41b4a3d83302a
2018-09-11 15:33:07 -07:00
Vladislav Pilgasov 4906f8d28c Add an implementation of Animated.subtract
Summary:
Fixes #18451

I've added another example to NativeAnimationsExample, which makes use of `Animated.substract()`, let me know if the example is not desired / doesn't add much value. Below two GIFs of the new method working on iOS and Android:

<img width="320" src="https://user-images.githubusercontent.com/1437605/38154748-165cc5f8-3474-11e8-8b31-504444271896.gif" />
<img width="320" src="https://user-images.githubusercontent.com/1437605/38154749-1679bff0-3474-11e8-80b1-b558d44e0494.gif" />

<!--
  Required: Write your test plan here. If you changed any code, please provide us with
  clear instructions on how you verified your changes work. Bonus points for screenshots and videos!
-->

https://github.com/facebook/react-native-website/pull/276

[GENERAL] [ENHANCEMENT] [Animated] - Implemented Animated.subtract
Closes https://github.com/facebook/react-native/pull/18630

Differential Revision: D7462867

Pulled By: hramos

fbshipit-source-id: 4cb0b8af08bb0c841e44ea2099889b8c02a22a4a
2018-03-30 21:08:52 -07:00
Héctor Ramos b181b7797f Check PATENTS does not creep into files
Summary:
Some files have crept into the repo with the old license header. These are usually from PRs that were opened prior to the re-licensing of the project.

Let the script run, prior to fixing the errant files. The script outputs the following:

```
PATENTS crept into some new files?
 --- /dev/fd/63	2018-03-01 01:42:48.250153746 +0000
+++ /dev/fd/62	2018-03-01 01:42:48.250153746 +0000
@@ -1 +1,9 @@
+Libraries/NativeAnimation/Nodes/RCTTrackingAnimatedNode.h
+Libraries/NativeAnimation/Nodes/RCTTrackingAnimatedNode.m
+ReactAndroid/src/main/java/com/facebook/react/animated/TrackingAnimatedNode.java
+ReactAndroid/src/main/java/com/facebook/react/views/text/CustomLetterSpacingSpan.java
+ReactCommon/yoga/yoga/YGLayout.cpp
+ReactCommon/yoga/yoga/YGLayout.h
+ReactCommon/yoga/yoga/YGStyle.cpp
+ReactCommon/yoga/yoga/YGStyle.h
 scripts/circleci/check_license.sh
Exited with code 1
```

Fix the headers in these files and run the script again. No output, exit code 0.
Closes https://github.com/facebook/react-native/pull/18143

Reviewed By: sophiebits

Differential Revision: D7119356

Pulled By: hramos

fbshipit-source-id: d238e4d4a3ae320a2c8e625c2fa29690057a4814
2018-03-01 08:22:05 -08:00
Sophie Alpert 1490ab12ef Update license headers for MIT license
Summary:
Includes React Native and its dependencies Fresco, Metro, and Yoga. Excludes samples/examples/docs.

find: ^(?:( *)|( *(?:[\*~#]|::))( )? *)?Copyright (?:\(c\) )?(\d{4})\b.+Facebook[\s\S]+?BSD[\s\S]+?(?:this source tree|the same directory)\.$
replace: $1$2$3Copyright (c) $4-present, Facebook, Inc.\n$2\n$1$2$3This source code is licensed under the MIT license found in the\n$1$2$3LICENSE file in the root directory of this source tree.

Reviewed By: TheSavior, yungsters

Differential Revision: D7007050

fbshipit-source-id: 37dd6bf0ffec0923bfc99c260bb330683f35553e
2018-02-16 18:31:53 -08:00
Krzysztof Magiera b48f7e5605 Support for animated tracking in native driver
Summary:
This PR adds support for Animated tracking to Animated Native Driver implementation on Android and iOS.

Animated tracking allows for animation to be started with a "dynamic" end value. Instead of passing a fixed number as end value we can pass a reference to another Animated.Value. Then when that value changes, the animation will be reconfigured to drive the animation to the new destination point. What is important is that animation will keep its state in the process of updating "toValue". That is if it is a spring animation and the end value changes while the previous animation still hasn't settled the new animation will start from the current position and will inherit current velocity. This makes end value transitions very smooth.

Animated tracking is available in JS implementation of Animated library but not in the native implementation. Therefore until now, it wasn't possible to utilize native driver when using animated tracking. Offloading animation from JS thread turns out to be crucial for gesture driven animations. This PR is a step forward towards feature parity between JS and native implementations of Animated.

Here is a link to example video that shows how tracking can be used to implement chat heads effect: https://twitter.com/kzzzf/status/958362032650244101

In addition this PR fixes an issue with frames animation driver on Android that because of rounding issues was taking one extra frame to start. Because of that change I had to update a number of Android unit tests that were relying on that behavior and running that one additional animation step prior to performing checks.

As a part of this PR I'm adding three unit tests for each of the platforms that verifies most important aspects of this implementation. Please refer to the code and look at the test cases top level comments to learn what they do.

I'm also adding a section to "Native Animated Example" screen in RNTester app that provides a test case for tracking. In the example we have blue square that fallows the red line drawn on screen. Line uses Animated.Value for it's position while square is connected via tracking spring animation to that value. So it is ought to follow the line. When user taps in the area surrounding the button new position for the red line is selected at random and the value updates. Then we can watch blue screen animate to that position.

You can also refer to this video that I use to demonstrate how tracking can be linked with native gesture events using react-native-gesture-handler lib: https://twitter.com/kzzzf/status/958362032650244101

[GENERAL][FEATURE][Native Animated] - Added support for animated tracking to native driver. Now you can use `useNativeDriver` flag with animations that track other Animated.Values
Closes https://github.com/facebook/react-native/pull/17896

Differential Revision: D6974170

Pulled By: hramos

fbshipit-source-id: 50e918b36ee10f80c1deb866c955661d4cc2619b
2018-02-16 12:10:01 -08:00
Janic Duplessis c47759a9ae Fix potential retain cycles in Animated iOS
Summary:
Fixes potential retain cycles detected by an internal fb tool.

```
First:

__NSDictionaryM
-> RCTPropsAnimatedNode
-> _parentNodes -> __NSDictionaryM
-> RCTStyleAnimatedNode
-> _childNodes -> __NSDictionaryM

Second:

RCTScrollView
-> _eventDispatcher -> RCTEventDispatcher
-> _observers -> __NSArrayM
-> RCTNativeAnimatedModule
-> _nodesManager -> RCTNativeAnimatedNodesManager
-> _uiManager -> RCTUIManager
-> _viewRegistry -> __NSDictionaryM
-> RCTScrollView
```

First fix:
Use weak map for parent and child nodes, strong refs are managed by RCTNativeAnimatedNodesManager

Second fix:
Make RCTEventDispatcher observers a weak array and make sure we don't keep strong refs to UIManager in RCTNativeAnimatedNodesManager and RCTPropsAnimatedNode.

Tested that native animations still work in UIExplorer

[IOS] [BUGFIX] [NativeAnimated] - Fix potential retain cycles in Animated iOS
Closes https://github.com/facebook/react-native/pull/16506

Differential Revision: D6126400

Pulled By: shergin

fbshipit-source-id: 1ac5083f8ab79a806305edc23ae4796ed428f78b
2017-10-23 13:20:59 -07:00
Janic Duplessis fc45471af2 Native Animations - Fix edge case with restore default values
Summary:
There was an edge case where sometimes a view could be added and removed in the same batch so this caused issues because we ran `disconnectAnimatedNodeFromView` before `connectAnimatedNodeToView`. This separates restoring default values from `disconnectAnimatedNodeFromView` so we can run only `restoreDefaultValues` on the pre-operations queue and just do nothing in case the view doesn't exist (it is fine because we know it will be removed immediately).

**Test plan**
Tested that native animations still work properly in RNTester and tested that the edge case crash was fixed.
Closes https://github.com/facebook/react-native/pull/14114

Differential Revision: D5128989

Pulled By: javache

fbshipit-source-id: 9f47a2d3aafeb06d8ed1a4dd1800b8af225edb7d
2017-05-25 06:18:36 -07:00
Janic Duplessis 1d37dd063c Native Animated - Add tests on iOS
Summary:
Adds unit tests to the Native Animated implementation on iOS. This pretty much mirrors the tests we currently have on Android.

It also fixes 2 bugs I've found when adding the tests and pass the current time in `stepAnimation` instead of using `CACurrentMediaTime` to make testing easier.

- `stopListeningToAnimatedNodeValue` did not actually work at all, it should set the listener to nil.
- The finished value in the animation end callback was always true, this simplifies the `RCTAnimationDriver` interface to get rid of `removeAnimation` and fixes the end callback value.

**Test plan**
- Run the tests
- Make sure the UIExplorer example still works
Closes https://github.com/facebook/react-native/pull/13068

Differential Revision: D4786701

Pulled By: javache

fbshipit-source-id: a4f07e6eec1f363ca47b6f27984041793c915bfc
2017-03-28 09:16:58 -07:00
Janic Duplessis c9fae2fb93 Native Animated - Restore default values when removing props on iOS
Summary:
This fixes a bug that causes properties to keep stale values because they were not restored to their default after being removed when their value was controlled by native animated.

To fix this we restore default values in `disconnectFromView` by updating views with null values for all props that we modified previously. However this causes another issue where we lose any props that were set by the normal process because NativeAnimated operations are always executed after UIManager operatations. To fix this I added a way to hook into UIManager view updating process to be able to execute NativeAnimated operations either before or after updating native views.

In the case of disconnecting we want to do it before updating views so that it does: Value changed by native animated -> value restored to default -> (optional) value updated by normal prop.

This PR also depends on #10658.

**Test plan**
Tested that this fixed a particular bug in an app that uses ex-navigation + native animations where a navbar w
Closes https://github.com/facebook/react-native/pull/11819

Differential Revision: D4752566

Pulled By: javache

fbshipit-source-id: 68ee28200ffeba859ae1b98ac753bd7dcb8910f0
2017-03-28 05:33:02 -07:00
Ryan Gomba 7e869b9d0a Drive any numerical prop via NativeAnimated
Summary:
In theory, we should be able to animate any non-layout property, including custom ones. While there is still work to be done on the native side to fully enable this, we should start by dropping the prop whitelist.
Closes https://github.com/facebook/react-native/pull/10658

Differential Revision: D4379031

Pulled By: ericvicenti

fbshipit-source-id: fe9c30ea101e93a8b260d7d09a909fafbb82fee6
2017-01-26 18:28:53 -08:00
Ryan Gomba c858420b2d Fix NativeAnimation invalidation & races on iOS
Summary:
This diff attempts to fix a number of iOS native animation bugs related to improper node invalidation and a race with view creation. The major issues were presented in #9120 as problems 3 and 3b, but I'll recap here:

The invalidation model we use is overly complicated and incomplete. The proper combination of `_needsUpdate` and `_hasUpdated` will result in nodes values being recomputed. However, we do not invalidate nodes in all the places we should, e.g. if we create a new view and attach it to an existing value node (see example in #9120). This diff chooses to remove the `_hasUpdated` flag, and simply relies on the `_needsUpdate` flag to mark a node as dirty.

We mark nodes as dirty when they are:
- created
- updated
- attached to new parents
- detached from old parents
- attached to a view

Calling `updateNodeIfNecessary` will, if necessary, compute all invalidated parent values before recomputing the node value. It will then apply the update, and mark the no
Closes https://github.com/facebook/react-native/pull/10663

Differential Revision: D4120301

Pulled By: mkonicek

fbshipit-source-id: e247afcb5d8c15999b8328c664b9f7e764d76a75
2016-11-28 11:13:31 -08:00
Pieter De Baets e1577df1fd Move all header imports to "<React/..>"
Summary:
To make React Native play nicely with our internal build infrastructure we need to properly namespace all of our header includes.

Where previously you could do `#import "RCTBridge.h"`, you must now write this as `#import <React/RCTBridge.h>`. If your xcode project still has a custom header include path, both variants will likely continue to work, but for new projects, we're defaulting the header include path to `$(BUILT_PRODUCTS_DIR)/usr/local/include`, where the React and CSSLayout targets will copy a subset of headers too. To make Xcode copy headers phase work properly, you may need to add React as an explicit dependency to your app's scheme and disable "parallelize build".

Reviewed By: mmmulani

Differential Revision: D4213120

fbshipit-source-id: 84a32a4b250c27699e6795f43584f13d594a9a82
2016-11-23 07:58:39 -08:00
Ryan Gomba 6535858c71 Add extractOffset to Animated
Summary:
`flattenOffset` has proven extremely useful, especially when dealing with pan responders and other gesture based animations, but I've also found a number of use cases for the inverse. This diff introduces `extractOffset`, which sets the offset value to the base value, and resets the base value to zero. A common use case would be to extractOffset onGrant and flattenOffset onRelease.
Closes https://github.com/facebook/react-native/pull/10721

Differential Revision: D4145744

fbshipit-source-id: dc2aa31652df0b31450556f611db43548180c7dd
2016-11-07 20:43:37 -08:00
Janic Duplessis cdd2d791c9 Support static values in NativeAnimated transforms on iOS
Summary:
Support static values (non-animated) in transform config like Android already does.

**Test plan**
Tested in UIExplorer native animated example by adding a transform with a static value and comparing with JS.
Closes https://github.com/facebook/react-native/pull/10664

Differential Revision: D4109515

fbshipit-source-id: 2d7de17d51d6df835c569fd45d2de8fc170bf928
2016-10-31 21:13:41 -07:00
Ryan Gomba d950db4ef7 Add support for springs for NativeAnimated on iOS
Summary:
This diff adds support for native spring animations on iOS. This overlaps some spring work done by kmagiera on the Android side of things.

**Test plan (required)**

Run UIExplorer NativeAnimated examples before and after - compare the results. Pay special attention to the spring examples.
Closes https://github.com/facebook/react-native/pull/9048

Differential Revision: D4056088

Pulled By: foghina

fbshipit-source-id: a593408cb61cb850572bab4a0884f7157cece656
2016-10-21 04:29:03 -07:00
Ryan Gomba 5794ff61bc Add support for clamping for NativeAnimated on iOS
Summary:
This diff adds support for clamping on iOS. It separates out code originally submitted in #9048.

Test plan (required)

Run UIExplorer NativeAnimated examples before and after - compare the results. Pay special attention to the new clamped spring example.
Closes https://github.com/facebook/react-native/pull/9625

Differential Revision: D4053231

fbshipit-source-id: 29048de444ff5f6d7fe7dce7897399b483ee6d2d
2016-10-20 14:13:38 -07:00
Kevin Gozali 0a0dd30c6a Introduced AnimatedDivision
Summary:
Combining 2 animated values via addition, multiplication, and modulo are already supported, and this adds another one: division.
There are some cases where an animated value needs to invert (1 / x) another animated value for calculation. An example is inverting a scale (2x --> 0.5x), e.g.:

```
const a = Animated.Value(1);
const b = Animated.divide(1, a);

Animated.spring(a, {
  toValue: 2,
}).start();
```

`b` will then follow `a`'s spring animation and produce the value of `1 / a`.

The basic usage is like this:

```
<Animated.View style={{transform: [{scale: a}]}}>
  <Animated.Image style={{transform: [{scale: b}]}} />
<Animated.View>
```

In this example, the inner image won't get stretched at all because the parent's scaling gets cancelled out.

Also added this to native animated implementation.

Reviewed By: foghina, mmmulani

Differential Revision: D3922891

fbshipit-source-id: 32508956c4b65b2deb7574d50a10c85b4809b961
2016-09-26 16:43:51 -07:00
Ryan Gomba 9462a73189 Value offsets
Summary:
This diff adds support for value offsets on iOS. It separates out code originally submitted in #9048.

Test plan (required)

Set up an animation with an offset, and `useNativeModule: true`. Compare results with `useNativeModule: false`.
Closes https://github.com/facebook/react-native/pull/9627

Differential Revision: D3924410

fbshipit-source-id: 8177a25a5f6b9e33f00ea66143c782aeea24507d
2016-09-26 10:28:35 -07:00
Janic Duplessis e26c135746 Add support for DiffClamp node
Summary:
Add native support on iOS and Android for `Animated.diffClamp` that was added in #9419.

**Test plan**
Tested that it works properly using the native animations UIExplorer example.
Closes https://github.com/facebook/react-native/pull/9691

Differential Revision: D3813440

fbshipit-source-id: 48a3ecddf3708fa44b408954d3d8133ec8537f21
2016-09-06 15:43:35 -07:00
Ryan Gomba 82dba51f1a Modulo node
Summary:
This diff adds ModuloAnimatedNode on iOS. It separates out code originally submitted in #9048.

Test plan (required)

Set up an animation with a modulo node, and `useNativeModule: true`. Compare results with `useNativeModule: false`.
Closes https://github.com/facebook/react-native/pull/9626

Differential Revision: D3799636

fbshipit-source-id: 594499f11be41bf3ee709249056a3feedeace9eb
2016-08-31 14:43:43 -07:00
Janic Duplessis 0e204e1141 Add support for value listener
Summary:
Adds support for `Animated.Value#addListener` for native driven animated values. Same as #8844 but for iOS. This depends on some JS code in #8844 so only review the 2nd commit and let's wait for #8844 to land first.

**Test plan**
Tested using the UIExplorer example.
Closes https://github.com/facebook/react-native/pull/9194

Differential Revision: D3681749

fbshipit-source-id: 521a61e2221c1ad1f6f40c75dd2dc957361d0271
2016-08-11 18:13:31 -07:00
Janic Duplessis df05311777 Add transform support for native animated on Android
Summary:
This adds support for the `transform` animated node. This brings feature parity with the iOS implementation and allows running the NativeAnimated UIExplorer example that was created with the iOS implementation on Android. This is based on some work by kmagiera in the exponent RN fork.

This also adds support for mixing static values with animated ones in the same transform as well which is not supported on iOS at the moment. It is also implemented in a way that rebuilds the transform matrix the same way as we build it in JS so it will be easy to remove some of the current limitations like forcing the transforms order and only supporting one of each type.

**Test plan (required)**

Tested with the NativeAnimated example on Android and iOS. Also tested mixing in static values in a transform (`[{ rotate: '45deg' }, { translateX: animatedValue }]`).
Closes https://github.com/facebook/react-native/pull/8839

Differential Revision: D3682143

fbshipit-source-id: 5e6fd4b0b8be6a76053f24a36d1785771690a6f8
2016-08-07 00:58:36 -07:00
leeight 53c1da0047 InterpolationAnimatedNode fromDoubleArray should support the string type
Summary:
The `NativeAnimationsExample` in Android can not work due to inputRange and outputRange were limited to double array type, which is different from iOS.

So we need let android version to support string array type.
Closes https://github.com/facebook/react-native/pull/8900

Differential Revision: D3674754

fbshipit-source-id: e7844f00940bf0fdd6f7f5003dd4eeefa0c317a0
2016-08-05 02:58:30 -07:00
Ryan Gomba eb96b7fabc Maintain transform order
Summary:
This diff addresses the issues raised by kmagiera in https://github.com/facebook/react-native/pull/7884. Transforms should be applied in the order they are defined, just like in `processTransform.js`. A scale applied before a translation, for instance, should give a different result than a translation applied before a scale.

We leverage CATransform3D to do the heavy lifting. A concatenated transform is passed all the way to `RCTViewPropertyMapper`. It is compared with the transform currently applied to the view, and if different, applied. The same approach is used for opacity.

I think it makes the most sense to do this diffing in `RCTViewPropertyMapper`, as opposed to creating and cleaning up an `_updatedPropsDictionary` each frame in `RCTTransformAnimatedNode` and `RCTStyleAnimatedNode`. The node should keep its full value; applying a minimal set of altered props is an optimization.  The higher up this optimization is implemented, the more assumptions it makes. e.g. that there will only ever be a sing
Closes https://github.com/facebook/react-native/pull/9050

Differential Revision: D3658139

fbshipit-source-id: ad6286762ef734084cbdf83c9bd9241190302d34
2016-08-02 14:28:29 -07:00
Joel Arvidsson cc816fbd82 Harmonize native animation callback args with JS
Summary:
`Animated.parallel` among other functions expects the `start(callback)` function to be invoked with an `endState` object. Currently natively driven animations call the handler with `null`, this PR changes that to `{ finished: true }`.

**Test plan**

This should not throw any errors:
```js
Animated.parallel([
  Animated.timing(
    new Animated.Value(0),
    {
      toValue: 1,
      useNativeDriver: true
    }
  ),
  Animated.timing(
    new Animated.Value(0),
    {
      toValue: 1,
      useNativeDriver: true
    }
  )
]).start();
```
Closes https://github.com/facebook/react-native/pull/8567

Differential Revision: D3517291

Pulled By: javache

fbshipit-source-id: 0056a5b4261546b061451c0b1b249718739086bc
2016-07-05 11:13:23 -07:00
Brandon Withrow 19e2388a76 Add support for native animations on iOS
Summary:
Currently on iOS animations are being performed on the JS thread. This ports animations over to the native thread and performs them natively. A lot of this work has already been done on Android, but this PR enables a few animation nodes that Android doesn't yet support such as Transform, Multiplication, and Addition nodes.
Also there is a demo of the native animations added to the UIExplorer app.
Closes https://github.com/facebook/react-native/pull/7884

Reviewed By: javache

Differential Revision: D3409179

Pulled By: nicklockwood

fbshipit-source-id: ef2d8840032e0c32f49e4a16ba86d448662e1751
2016-06-09 10:43:51 -07:00
Brandon Withrow b29c938312 Reverted commit D3401811
Summary:
Currently on iOS animations are being performed on the JS thread. This ports animations over to the native thread and performs them natively. A lot of this work has already been done on Android, but this PR enables a few animation nodes that Android doesn't yet support such as Transform, Multiplication, and Addition nodes.
Also there is a demo of the native animations added to the UIExplorer app.
Closes https://github.com/facebook/react-native/pull/7884

Differential Revision: D3401811

Pulled By: nicklockwood

fbshipit-source-id: 709e533243130153febef03ddd60d39e9fe70e3e
2016-06-07 23:43:30 -07:00
Brandon Withrow 5ecdb252c3 Add support for native animations on iOS
Summary:
Currently on iOS animations are being performed on the JS thread. This ports animations over to the native thread and performs them natively. A lot of this work has already been done on Android, but this PR enables a few animation nodes that Android doesn't yet support such as Transform, Multiplication, and Addition nodes.
Also there is a demo of the native animations added to the UIExplorer app.
Closes https://github.com/facebook/react-native/pull/7884

Differential Revision: D3401811

Pulled By: nicklockwood

fbshipit-source-id: c8d750b75e4410923e17eaeb6dcaf079a09942e2
2016-06-07 20:43:37 -07:00