Summary:Follow-up to https://github.com/facebook/react-native/pull/5084
This…
- changes all requires within RN to `require('fbjs/lib/…')`
- updates `.flowconfig`
- updates `packager/blacklist.js`
- adapts tests
- removes things from `Libraries/vendor/{core,emitter}` that are also in fbjs
- removes knowledge of `fbjs` from the packager
Closes https://github.com/facebook/react-native/pull/5084
Reviewed By: bestander
Differential Revision: D2926835
fb-gh-sync-id: 2095e22b2f38e032599d1f2601722b3560e8b6e9
shipit-source-id: 2095e22b2f38e032599d1f2601722b3560e8b6e9
Summary:This is an initial take on how to allow for value wrapping in Animated (currently `.timing` only). It adds a wrap config options which is an array specifying a range of values to be wrapped around. Anytime the delta of `toValue and fromValue > wrapDistance / 2` instead of animating the long way it will animate towards the range extremity and then after breaching the range it will readjust to animated to the true toValue.
Example Usage:
```js
Animated.timing(
this.state.animatedDegrees,
{toValue: Math.random()*360, wrap: [0, 360]}
).start()
```
This is presumably very valuable in rotation based animations, but could also be useful in other applications like wrapping the edges of the viewport.
Questions & Todo:
- Is `wrap` as a config key semantically meaningful and accurate?
- Is there a way to expose this as a config option on `.interpolate` rather than timing
- Generalize to all animated API's (spring, decay), and will this work with ValueXY out of the box?
- Add tests
Closes https://github.com/facebook/react-native/pull/5743
Differential Revision: D2979992
fb-gh-sync-id: 69be510feba8c43acb10c253036f5854adff9258
shipit-source-id: 69be510feba8c43acb10c253036f5854adff9258
Summary:This adds support for passing plain numbers into the add and multiply operators. This can be useful if you want to have one AnimatedValue for a component that is say a scale 0 -> 1 and then animated many style properties accordingly using derivative Animated values.
Thoughts?
As far as implementation, there may be more performant implementations that do not require creating a whole new AnimatedValue for every static number. I am open to suggestion.
Closes https://github.com/facebook/react-native/pull/6154
Differential Revision: D2979962
Pulled By: vjeux
fb-gh-sync-id: b5ecb568b4c64b995dc4100991f02c17f0dd97dd
shipit-source-id: b5ecb568b4c64b995dc4100991f02c17f0dd97dd
Summary:
This PR was created in response to feedback from an older PR: https://github.com/facebook/react-native/pull/2045
The `.interpolate()` API of Animated values is quite effective to accomplish transformations based on a single animated value, but currently there is a class of animations that is impossible: animations being driven by more than one value.
Usage would be like the following:
```js
getInitialState: function() {
return {
panY: new Animated.Value(0),
offset: new Animated.Value(0),
};
}
```
```js
var scale = Animated.add(panY, offset).interpolate({
inputRange: [...],
outputRange: [...],
});
```
I have a real use case for this, and I cannot think of any way to accomplish what I need without an API like this.
The animation I am trying to accomplish is I have a PanResponder being used to detect both x and y panning. The y-axis panning drives a 3d sroll-like animation (which we can call `panY`), and the x-axis panning is driving a "swipe-to-remove" animation (
Closes https://github.com/facebook/react-native/pull/4395
Reviewed By: svcscm
Differential Revision: D2731305
Pulled By: vjeux
fb-gh-sync-id: 3b9422f10c7e7f3b3ecd270aeed8ea92315a89e9
Summary:
public
This causes a warning since propType not exist
Reviewed By: vjeux
Differential Revision: D2713358
fb-gh-sync-id: 58406d1dc969e6f1d40bee958c28cc87036b30c2
Summary: Adds a new option to animation configs so that animations can be marked as non-interactions. This solves the "loading indicator problem" where an animated loading screen would deadlock as it waits for all interactions to complete.
As for the API, what we really want long term is better scheduling. This needs to be built at the runtime level (into the RN bridge) and take care of things like priority donation that are probably overkill right now. Basically this API is a medium-term fix and I won't be upset if it gets replaced with a finer-grained scheduler.
Closes https://github.com/facebook/react-native/pull/3433
Reviewed By: @svcscm
Differential Revision: D2545300
Pulled By: @vjeux
fb-gh-sync-id: c1216bf69bfbbbae00c76c4697183fe96a6a01dd
Summary: These were accidentally supported because they were merged at a lower
level. That's an implementation detail. setNativeProps should still
normalize the API.
I fixed some callers.
Setting props the normal way used to ignore these. Unfortunately we can't
warn for those cases because lots of extra props are spread. (The classic
transferPropsTo issue.)
@public
Reviewed By: @vjeux
Differential Revision: D2514228
fb-gh-sync-id: 00ed6073827dc1924da20f3d80cbdf68d8a8a8fc
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
