[ReactNative] OSS Interaction Manager
This commit is contained in:
Родитель
66bb821a31
Коммит
2ad43094ea
|
@ -13,6 +13,14 @@ var invariant = require('invariant');
|
||||||
var keyMirror = require('keyMirror');
|
var keyMirror = require('keyMirror');
|
||||||
var setImmediate = require('setImmediate');
|
var setImmediate = require('setImmediate');
|
||||||
|
|
||||||
|
var _emitter = new EventEmitter();
|
||||||
|
var _interactionSet = new Set();
|
||||||
|
var _addInteractionSet = new Set();
|
||||||
|
var _deleteInteractionSet = new Set();
|
||||||
|
var _nextUpdateHandle = null;
|
||||||
|
var _queue = [];
|
||||||
|
var _inc = 0;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* InteractionManager allows long-running work to be scheduled after any
|
* InteractionManager allows long-running work to be scheduled after any
|
||||||
* interactions/animations have completed. In particular, this allows JavaScript
|
* interactions/animations have completed. In particular, this allows JavaScript
|
||||||
|
@ -20,11 +28,14 @@ var setImmediate = require('setImmediate');
|
||||||
*
|
*
|
||||||
* Applications can schedule tasks to run after interactions with the following:
|
* Applications can schedule tasks to run after interactions with the following:
|
||||||
*
|
*
|
||||||
|
* ```
|
||||||
* InteractionManager.runAfterInteractions(() => {
|
* InteractionManager.runAfterInteractions(() => {
|
||||||
* // ...long-running synchronous task...
|
* // ...long-running synchronous task...
|
||||||
* });
|
* });
|
||||||
|
* ```
|
||||||
*
|
*
|
||||||
* Compare this to other scheduling alternatives:
|
* Compare this to other scheduling alternatives:
|
||||||
|
*
|
||||||
* - requestAnimationFrame(): for code that animates a view over time.
|
* - requestAnimationFrame(): for code that animates a view over time.
|
||||||
* - setImmediate/setTimeout(): run code later, note this may delay animations.
|
* - setImmediate/setTimeout(): run code later, note this may delay animations.
|
||||||
* - runAfterInteractions(): run code later, without delaying active animations.
|
* - runAfterInteractions(): run code later, without delaying active animations.
|
||||||
|
@ -37,27 +48,32 @@ var setImmediate = require('setImmediate');
|
||||||
* creating an interaction 'handle' on animation start, and clearing it upon
|
* creating an interaction 'handle' on animation start, and clearing it upon
|
||||||
* completion:
|
* completion:
|
||||||
*
|
*
|
||||||
|
* ```
|
||||||
* var handle = InteractionManager.createInteractionHandle();
|
* var handle = InteractionManager.createInteractionHandle();
|
||||||
* // run animation... (`runAfterInteractions` tasks are queued)
|
* // run animation... (`runAfterInteractions` tasks are queued)
|
||||||
* // later, on animation completion:
|
* // later, on animation completion:
|
||||||
* InteractionManager.clearInteractionHandle(handle);
|
* InteractionManager.clearInteractionHandle(handle);
|
||||||
* // queued tasks run if all handles were cleared
|
* // queued tasks run if all handles were cleared
|
||||||
|
* ```
|
||||||
*/
|
*/
|
||||||
|
|
||||||
var _emitter = new EventEmitter();
|
|
||||||
var _interactionSet = new Set();
|
|
||||||
var _addInteractionSet = new Set();
|
|
||||||
var _deleteInteractionSet = new Set();
|
|
||||||
var _nextUpdateHandle = null;
|
|
||||||
var _queue = [];
|
|
||||||
var _inc = 0;
|
|
||||||
|
|
||||||
var InteractionManager = {
|
var InteractionManager = {
|
||||||
Events: keyMirror({
|
Events: keyMirror({
|
||||||
interactionStart: true,
|
interactionStart: true,
|
||||||
interactionComplete: true,
|
interactionComplete: true,
|
||||||
}),
|
}),
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Schedule a function to run after all interactions have completed.
|
||||||
|
*/
|
||||||
|
runAfterInteractions(callback) {
|
||||||
|
invariant(
|
||||||
|
typeof callback === 'function',
|
||||||
|
'Must specify a function to schedule.'
|
||||||
|
);
|
||||||
|
scheduleUpdate();
|
||||||
|
_queue.push(callback);
|
||||||
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Notify manager that an interaction has started.
|
* Notify manager that an interaction has started.
|
||||||
*/
|
*/
|
||||||
|
@ -81,20 +97,6 @@ var InteractionManager = {
|
||||||
_deleteInteractionSet.add(handle);
|
_deleteInteractionSet.add(handle);
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
|
||||||
* Schedule a function to run after all interactions have completed.
|
|
||||||
*
|
|
||||||
* @param {function} callback
|
|
||||||
*/
|
|
||||||
runAfterInteractions(callback) {
|
|
||||||
invariant(
|
|
||||||
typeof callback === 'function',
|
|
||||||
'Must specify a function to schedule.'
|
|
||||||
);
|
|
||||||
scheduleUpdate();
|
|
||||||
_queue.push(callback);
|
|
||||||
},
|
|
||||||
|
|
||||||
addListener: _emitter.addListener.bind(_emitter),
|
addListener: _emitter.addListener.bind(_emitter),
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -7,9 +7,9 @@
|
||||||
|
|
||||||
var ReactNative = {
|
var ReactNative = {
|
||||||
...require('React'),
|
...require('React'),
|
||||||
Animation: require('Animation'),
|
|
||||||
ActivityIndicatorIOS: require('ActivityIndicatorIOS'),
|
ActivityIndicatorIOS: require('ActivityIndicatorIOS'),
|
||||||
AlertIOS: require('AlertIOS'),
|
AlertIOS: require('AlertIOS'),
|
||||||
|
Animation: require('Animation'),
|
||||||
AppRegistry: require('AppRegistry'),
|
AppRegistry: require('AppRegistry'),
|
||||||
AppState: require('AppState'),
|
AppState: require('AppState'),
|
||||||
AppStateIOS: require('AppStateIOS'),
|
AppStateIOS: require('AppStateIOS'),
|
||||||
|
@ -18,6 +18,7 @@ var ReactNative = {
|
||||||
DatePickerIOS: require('DatePickerIOS'),
|
DatePickerIOS: require('DatePickerIOS'),
|
||||||
ExpandingText: require('ExpandingText'),
|
ExpandingText: require('ExpandingText'),
|
||||||
Image: require('Image'),
|
Image: require('Image'),
|
||||||
|
InteractionManager: require('InteractionManager'),
|
||||||
LayoutAnimation: require('LayoutAnimation'),
|
LayoutAnimation: require('LayoutAnimation'),
|
||||||
ListView: require('ListView'),
|
ListView: require('ListView'),
|
||||||
ListViewDataSource: require('ListViewDataSource'),
|
ListViewDataSource: require('ListViewDataSource'),
|
||||||
|
|
Загрузка…
Ссылка в новой задаче