react-native/Libraries/LayoutAnimation/LayoutAnimation.js

155 lines
3.5 KiB
JavaScript
Raw Normal View History

/**
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
* @providesModule LayoutAnimation
2015-03-25 02:34:12 +00:00
* @flow
*/
'use strict';
var PropTypes = require('ReactPropTypes');
var UIManager = require('UIManager');
var createStrictShapeTypeChecker = require('createStrictShapeTypeChecker');
var keyMirror = require('fbjs/lib/keyMirror');
Updates from Thu 9 Apr - [React Native] Fix RCTText crashes | Alex Akers - Ensure that NSLocationWhenInUseUsageDescription is set, throw error if not | Alex Kotliarskyi - [ReactNative] fix exception handler method name | Spencer Ahrens - [ReactNative] Re-configure horizontal swipe animations | Eric Vicenti - [ReactNative] <Text>: apply the fontWeight correctly if fontFamily style is also present | Kevin Gozali - [MAdMan] Dimensions.get('window') considered harmful | Philipp von Weitershausen - Navigator: Changed transitioner background color to 'transparent' | Eric Vicenti - [react-native] Listen on all IPv6 interfaces | Ben Alpert - [react-packager] Don't depend on error.stack being available | Amjad Masad - [ReactNative] fixup AnimationExperimental a bit | Spencer Ahrens - [react-packager] Implement new style asset packaging (with dimensions) | Amjad Masad - [React Native] RCT_EXPORT lvl.2 | Alex Akers - [react_native] Implement TextInput end editing | Andrei Coman - [react_native] Make TextInput focus, blur, dismiss and show keyboard work | Andrei Coman - Added non-class-scanning-based approach fror registering js methods | Nick Lockwood - [ReactNative] Update package.json | Christopher Chedeau - [ReactNative] Do flow check when running packager | Spencer Ahrens - [ReactNative] Fix typo/bug in Navigator._completeTransition | Eric Vicenti - [ReactNative] Fix Navigator exception when touching during transition | Eric Vicenti - [ReactNative] Remove bridge retaining cycles | Tadeu Zagallo - [ReactNative] Fix and re-add WebView executor | Tadeu Zagallo
2015-04-09 15:46:53 +00:00
var TypesEnum = {
spring: true,
linear: true,
easeInEaseOut: true,
easeIn: true,
easeOut: true,
keyboard: true,
Updates from Thu 9 Apr - [React Native] Fix RCTText crashes | Alex Akers - Ensure that NSLocationWhenInUseUsageDescription is set, throw error if not | Alex Kotliarskyi - [ReactNative] fix exception handler method name | Spencer Ahrens - [ReactNative] Re-configure horizontal swipe animations | Eric Vicenti - [ReactNative] <Text>: apply the fontWeight correctly if fontFamily style is also present | Kevin Gozali - [MAdMan] Dimensions.get('window') considered harmful | Philipp von Weitershausen - Navigator: Changed transitioner background color to 'transparent' | Eric Vicenti - [react-native] Listen on all IPv6 interfaces | Ben Alpert - [react-packager] Don't depend on error.stack being available | Amjad Masad - [ReactNative] fixup AnimationExperimental a bit | Spencer Ahrens - [react-packager] Implement new style asset packaging (with dimensions) | Amjad Masad - [React Native] RCT_EXPORT lvl.2 | Alex Akers - [react_native] Implement TextInput end editing | Andrei Coman - [react_native] Make TextInput focus, blur, dismiss and show keyboard work | Andrei Coman - Added non-class-scanning-based approach fror registering js methods | Nick Lockwood - [ReactNative] Update package.json | Christopher Chedeau - [ReactNative] Do flow check when running packager | Spencer Ahrens - [ReactNative] Fix typo/bug in Navigator._completeTransition | Eric Vicenti - [ReactNative] Fix Navigator exception when touching during transition | Eric Vicenti - [ReactNative] Remove bridge retaining cycles | Tadeu Zagallo - [ReactNative] Fix and re-add WebView executor | Tadeu Zagallo
2015-04-09 15:46:53 +00:00
};
var Types = keyMirror(TypesEnum);
Updates from Thu 9 Apr - [React Native] Fix RCTText crashes | Alex Akers - Ensure that NSLocationWhenInUseUsageDescription is set, throw error if not | Alex Kotliarskyi - [ReactNative] fix exception handler method name | Spencer Ahrens - [ReactNative] Re-configure horizontal swipe animations | Eric Vicenti - [ReactNative] <Text>: apply the fontWeight correctly if fontFamily style is also present | Kevin Gozali - [MAdMan] Dimensions.get('window') considered harmful | Philipp von Weitershausen - Navigator: Changed transitioner background color to 'transparent' | Eric Vicenti - [react-native] Listen on all IPv6 interfaces | Ben Alpert - [react-packager] Don't depend on error.stack being available | Amjad Masad - [ReactNative] fixup AnimationExperimental a bit | Spencer Ahrens - [react-packager] Implement new style asset packaging (with dimensions) | Amjad Masad - [React Native] RCT_EXPORT lvl.2 | Alex Akers - [react_native] Implement TextInput end editing | Andrei Coman - [react_native] Make TextInput focus, blur, dismiss and show keyboard work | Andrei Coman - Added non-class-scanning-based approach fror registering js methods | Nick Lockwood - [ReactNative] Update package.json | Christopher Chedeau - [ReactNative] Do flow check when running packager | Spencer Ahrens - [ReactNative] Fix typo/bug in Navigator._completeTransition | Eric Vicenti - [ReactNative] Fix Navigator exception when touching during transition | Eric Vicenti - [ReactNative] Remove bridge retaining cycles | Tadeu Zagallo - [ReactNative] Fix and re-add WebView executor | Tadeu Zagallo
2015-04-09 15:46:53 +00:00
var PropertiesEnum = {
opacity: true,
scaleXY: true,
Updates from Thu 9 Apr - [React Native] Fix RCTText crashes | Alex Akers - Ensure that NSLocationWhenInUseUsageDescription is set, throw error if not | Alex Kotliarskyi - [ReactNative] fix exception handler method name | Spencer Ahrens - [ReactNative] Re-configure horizontal swipe animations | Eric Vicenti - [ReactNative] <Text>: apply the fontWeight correctly if fontFamily style is also present | Kevin Gozali - [MAdMan] Dimensions.get('window') considered harmful | Philipp von Weitershausen - Navigator: Changed transitioner background color to 'transparent' | Eric Vicenti - [react-native] Listen on all IPv6 interfaces | Ben Alpert - [react-packager] Don't depend on error.stack being available | Amjad Masad - [ReactNative] fixup AnimationExperimental a bit | Spencer Ahrens - [react-packager] Implement new style asset packaging (with dimensions) | Amjad Masad - [React Native] RCT_EXPORT lvl.2 | Alex Akers - [react_native] Implement TextInput end editing | Andrei Coman - [react_native] Make TextInput focus, blur, dismiss and show keyboard work | Andrei Coman - Added non-class-scanning-based approach fror registering js methods | Nick Lockwood - [ReactNative] Update package.json | Christopher Chedeau - [ReactNative] Do flow check when running packager | Spencer Ahrens - [ReactNative] Fix typo/bug in Navigator._completeTransition | Eric Vicenti - [ReactNative] Fix Navigator exception when touching during transition | Eric Vicenti - [ReactNative] Remove bridge retaining cycles | Tadeu Zagallo - [ReactNative] Fix and re-add WebView executor | Tadeu Zagallo
2015-04-09 15:46:53 +00:00
};
var Properties = keyMirror(PropertiesEnum);
var animChecker = createStrictShapeTypeChecker({
duration: PropTypes.number,
delay: PropTypes.number,
springDamping: PropTypes.number,
initialVelocity: PropTypes.number,
type: PropTypes.oneOf(
Object.keys(Types)
),
property: PropTypes.oneOf( // Only applies to create/delete
Object.keys(Properties)
),
});
2015-03-25 02:34:12 +00:00
type Anim = {
duration?: number;
delay?: number;
springDamping?: number;
initialVelocity?: number;
Updates from Thu 9 Apr - [React Native] Fix RCTText crashes | Alex Akers - Ensure that NSLocationWhenInUseUsageDescription is set, throw error if not | Alex Kotliarskyi - [ReactNative] fix exception handler method name | Spencer Ahrens - [ReactNative] Re-configure horizontal swipe animations | Eric Vicenti - [ReactNative] <Text>: apply the fontWeight correctly if fontFamily style is also present | Kevin Gozali - [MAdMan] Dimensions.get('window') considered harmful | Philipp von Weitershausen - Navigator: Changed transitioner background color to 'transparent' | Eric Vicenti - [react-native] Listen on all IPv6 interfaces | Ben Alpert - [react-packager] Don't depend on error.stack being available | Amjad Masad - [ReactNative] fixup AnimationExperimental a bit | Spencer Ahrens - [react-packager] Implement new style asset packaging (with dimensions) | Amjad Masad - [React Native] RCT_EXPORT lvl.2 | Alex Akers - [react_native] Implement TextInput end editing | Andrei Coman - [react_native] Make TextInput focus, blur, dismiss and show keyboard work | Andrei Coman - Added non-class-scanning-based approach fror registering js methods | Nick Lockwood - [ReactNative] Update package.json | Christopher Chedeau - [ReactNative] Do flow check when running packager | Spencer Ahrens - [ReactNative] Fix typo/bug in Navigator._completeTransition | Eric Vicenti - [ReactNative] Fix Navigator exception when touching during transition | Eric Vicenti - [ReactNative] Remove bridge retaining cycles | Tadeu Zagallo - [ReactNative] Fix and re-add WebView executor | Tadeu Zagallo
2015-04-09 15:46:53 +00:00
type?: $Enum<typeof TypesEnum>;
property?: $Enum<typeof PropertiesEnum>;
2015-03-25 02:34:12 +00:00
}
var configChecker = createStrictShapeTypeChecker({
duration: PropTypes.number.isRequired,
create: animChecker,
update: animChecker,
delete: animChecker,
});
2015-03-25 02:34:12 +00:00
type Config = {
duration: number;
create?: Anim;
update?: Anim;
delete?: Anim;
}
function configureNext(config: Config, onAnimationDidEnd?: Function) {
2015-03-25 02:34:12 +00:00
configChecker({config}, 'config', 'LayoutAnimation.configureNext');
UIManager.configureNextLayoutAnimation(
config, onAnimationDidEnd || function() {}, function() { /* unused */ }
);
2015-03-25 02:34:12 +00:00
}
function create(duration: number, type, creationProp): Config {
return {
duration,
create: {
type,
property: creationProp,
},
update: {
type,
},
};
}
[ReactNative] Animated infra - ValueXY, addListener, fixes, etc Summary: This is most of the infra necessary for the gratuitous animation demo app. I originally had things more split up, but it was just confusing because everything is so interlinked and dependent, so lower diffs would have code that wasn't even going to survive (and thus not useful to review), so I merged it all here. - `Animated.event` now supports mapping to multiple arguments (needed for `onPanResponderMove` events which provide the `gestureState` as the second arg. - Vectors: new `Animated.ValueXY` class which composes two `Animated.Value`s for convenience/brevity - Listeners: values and events can be listened to in order to trigger state updates based on their values. Intended to work as async updates from native that might lag behind truth. - Offsets: a common pattern with pan and other gestures is to track where you left off. This is easily encoded in the Value directly with `setOffset(offset)`, typically used on grant, and can be flattened back into the base value and reset with `flattenOffset()`, typically called on release. - Tracking: supports `Animated.Value/ValueXY` for `toValue` with all animations, enabling linking multiple values together with some curve or physics. `Animated.timing` can be used with `duration: 0` to rigidly link the values with no lag, or `Animated.spring` can be used to link them like chat heads. - `Animated.Image` as a default export. - Various cleanup, bug, flow and lint fixes.
2015-07-07 20:33:51 +00:00
var Presets = {
easeInEaseOut: create(
300, Types.easeInEaseOut, Properties.opacity
),
linear: create(
500, Types.linear, Properties.opacity
),
spring: {
duration: 700,
create: {
type: Types.linear,
property: Properties.opacity,
},
update: {
type: Types.spring,
springDamping: 0.4,
},
},
};
/**
* Automatically animates views to their new positions when the
* next layout happens.
*
* A common way to use this API is to call `LayoutAnimation.configureNext`
* before calling `setState`.
*/
var LayoutAnimation = {
/**
* Schedules an animation to happen on the next layout.
*
* @param config Specifies animation properties:
*
* - `duration` in milliseconds
* - `create`, config for animating in new views (see `Anim` type)
* - `update`, config for animating views that have been updated
* (see `Anim` type)
*
* @param onAnimationDidEnd Called when the animation finished.
* Only supported on iOS.
* @param onError Called on error. Only supported on iOS.
*/
2015-03-25 02:34:12 +00:00
configureNext,
/**
* Helper for creating a config for `configureNext`.
*/
2015-03-25 02:34:12 +00:00
create,
Types,
Properties,
configChecker: configChecker,
[ReactNative] Animated infra - ValueXY, addListener, fixes, etc Summary: This is most of the infra necessary for the gratuitous animation demo app. I originally had things more split up, but it was just confusing because everything is so interlinked and dependent, so lower diffs would have code that wasn't even going to survive (and thus not useful to review), so I merged it all here. - `Animated.event` now supports mapping to multiple arguments (needed for `onPanResponderMove` events which provide the `gestureState` as the second arg. - Vectors: new `Animated.ValueXY` class which composes two `Animated.Value`s for convenience/brevity - Listeners: values and events can be listened to in order to trigger state updates based on their values. Intended to work as async updates from native that might lag behind truth. - Offsets: a common pattern with pan and other gestures is to track where you left off. This is easily encoded in the Value directly with `setOffset(offset)`, typically used on grant, and can be flattened back into the base value and reset with `flattenOffset()`, typically called on release. - Tracking: supports `Animated.Value/ValueXY` for `toValue` with all animations, enabling linking multiple values together with some curve or physics. `Animated.timing` can be used with `duration: 0` to rigidly link the values with no lag, or `Animated.spring` can be used to link them like chat heads. - `Animated.Image` as a default export. - Various cleanup, bug, flow and lint fixes.
2015-07-07 20:33:51 +00:00
Presets,
easeInEaseOut: configureNext.bind(
null, Presets.easeInEaseOut
),
linear: configureNext.bind(
null, Presets.linear
),
spring: configureNext.bind(
null, Presets.spring
),
};
module.exports = LayoutAnimation;