Skip to content

Commit 60db876

Browse files
nicklockwoodfacebook-github-bot-9
authored andcommitted
Wrapped UIManager native module for better abstraction
Summary: public RCTUIManager is a public module with several useful methods, however, unlike most such modules, it does not have a JS wrapper that would allow it to be required directly. Besides making it more cumbersome to use, this also makes it impossible to modify the UIManager API, or smooth over differences between platforms in the JS layer without breaking all of the call sites. This diff adds a simple JS wrapper file for the UIManager module to make it easier to work with. Reviewed By: tadeuzagallo Differential Revision: D2700348 fb-gh-sync-id: dd9030eface100b1baf756da11bae355dc0f266f
1 parent 9e30c3b commit 60db876

25 files changed

Lines changed: 102 additions & 90 deletions

Examples/UIExplorer/ImageEditingExample.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,10 +25,11 @@ var {
2525
StyleSheet,
2626
Text,
2727
TouchableHighlight,
28+
UIManager,
2829
View,
2930
} = React;
3031
var ImageEditingManager = NativeModules.ImageEditingManager;
31-
var RCTScrollViewConsts = NativeModules.UIManager.RCTScrollView.Constants;
32+
var RCTScrollViewConsts = UIManager.RCTScrollView.Constants;
3233

3334
var PAGE_SIZE = 20;
3435

Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -10,15 +10,16 @@
1010
*/
1111
'use strict';
1212

13-
var DrawerConsts = require('NativeModules').UIManager.AndroidDrawerLayout.Constants;
1413
var NativeMethodsMixin = require('NativeMethodsMixin');
1514
var React = require('React');
1615
var ReactPropTypes = require('ReactPropTypes');
1716
var ReactNativeViewAttributes = require('ReactNativeViewAttributes');
18-
var RCTUIManager = require('NativeModules').UIManager;
1917
var StyleSheet = require('StyleSheet');
18+
var UIManager = require('UIManager');
2019
var View = require('View');
2120

21+
var DrawerConsts = UIManager.AndroidDrawerLayout.Constants;
22+
2223
var dismissKeyboard = require('dismissKeyboard');
2324
var merge = require('merge');
2425
var requireNativeComponent = require('requireNativeComponent');
@@ -182,17 +183,17 @@ var DrawerLayoutAndroid = React.createClass({
182183
},
183184

184185
openDrawer: function() {
185-
RCTUIManager.dispatchViewManagerCommand(
186+
UIManager.dispatchViewManagerCommand(
186187
this._getDrawerLayoutHandle(),
187-
RCTUIManager.AndroidDrawerLayout.Commands.openDrawer,
188+
UIManager.AndroidDrawerLayout.Commands.openDrawer,
188189
null
189190
);
190191
},
191192

192193
closeDrawer: function() {
193-
RCTUIManager.dispatchViewManagerCommand(
194+
UIManager.dispatchViewManagerCommand(
194195
this._getDrawerLayoutHandle(),
195-
RCTUIManager.AndroidDrawerLayout.Commands.closeDrawer,
196+
UIManager.AndroidDrawerLayout.Commands.closeDrawer,
196197
null
197198
);
198199
},

Libraries/Components/TextInput/TextInput.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -16,14 +16,14 @@ var EventEmitter = require('EventEmitter');
1616
var NativeMethodsMixin = require('NativeMethodsMixin');
1717
var Platform = require('Platform');
1818
var PropTypes = require('ReactPropTypes');
19-
var RCTUIManager = require('NativeModules').UIManager;
2019
var React = require('React');
2120
var ReactChildren = require('ReactChildren');
2221
var StyleSheet = require('StyleSheet');
2322
var Text = require('Text');
2423
var TextInputState = require('TextInputState');
2524
var TimerMixin = require('react-timer-mixin');
2625
var TouchableWithoutFeedback = require('TouchableWithoutFeedback');
26+
var UIManager = require('UIManager');
2727
var View = require('View');
2828

2929
var createReactNativeComponentClass = require('createReactNativeComponentClass');
@@ -496,11 +496,11 @@ var TextInput = React.createClass({
496496
},
497497

498498
_renderAndroid: function() {
499-
var autoCapitalize = RCTUIManager.UIText.AutocapitalizationType[this.props.autoCapitalize];
499+
var autoCapitalize = UIManager.UIText.AutocapitalizationType[this.props.autoCapitalize];
500500
var textAlign =
501-
RCTUIManager.AndroidTextInput.Constants.TextAlign[this.props.textAlign];
501+
UIManager.AndroidTextInput.Constants.TextAlign[this.props.textAlign];
502502
var textAlignVertical =
503-
RCTUIManager.AndroidTextInput.Constants.TextAlignVertical[this.props.textAlignVertical];
503+
UIManager.AndroidTextInput.Constants.TextAlignVertical[this.props.textAlignVertical];
504504
var children = this.props.children;
505505
var childCount = 0;
506506
ReactChildren.forEach(children, () => ++childCount);

Libraries/Components/TextInput/TextInputState.js

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
'use strict';
1717

1818
var Platform = require('Platform');
19-
var RCTUIManager = require('NativeModules').UIManager;
19+
var UIManager = require('UIManager');
2020

2121
var TextInputState = {
2222
/**
@@ -41,11 +41,11 @@ var TextInputState = {
4141
if (this._currentlyFocusedID !== textFieldID && textFieldID !== null) {
4242
this._currentlyFocusedID = textFieldID;
4343
if (Platform.OS === 'ios') {
44-
RCTUIManager.focus(textFieldID);
44+
UIManager.focus(textFieldID);
4545
} else if (Platform.OS === 'android') {
46-
RCTUIManager.dispatchViewManagerCommand(
46+
UIManager.dispatchViewManagerCommand(
4747
textFieldID,
48-
RCTUIManager.AndroidTextInput.Commands.focusTextInput,
48+
UIManager.AndroidTextInput.Commands.focusTextInput,
4949
null
5050
);
5151
}
@@ -61,11 +61,11 @@ var TextInputState = {
6161
if (this._currentlyFocusedID === textFieldID && textFieldID !== null) {
6262
this._currentlyFocusedID = null;
6363
if (Platform.OS === 'ios') {
64-
RCTUIManager.blur(textFieldID);
64+
UIManager.blur(textFieldID);
6565
} else if (Platform.OS === 'android') {
66-
RCTUIManager.dispatchViewManagerCommand(
66+
UIManager.dispatchViewManagerCommand(
6767
textFieldID,
68-
RCTUIManager.AndroidTextInput.Commands.blurTextInput,
68+
UIManager.AndroidTextInput.Commands.blurTextInput,
6969
null
7070
);
7171
}

Libraries/Components/ToolbarAndroid/ToolbarAndroid.android.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,10 +13,10 @@
1313

1414
var Image = require('Image');
1515
var NativeMethodsMixin = require('NativeMethodsMixin');
16-
var RCTUIManager = require('NativeModules').UIManager;
1716
var React = require('React');
1817
var ReactNativeViewAttributes = require('ReactNativeViewAttributes');
1918
var ReactPropTypes = require('ReactPropTypes');
19+
var UIManager = require('UIManager');
2020
var View = require('View');
2121

2222
var requireNativeComponent = require('requireNativeComponent');
@@ -154,7 +154,7 @@ var ToolbarAndroid = React.createClass({
154154
action.icon = resolveAssetSource(action.icon);
155155
}
156156
if (action.show) {
157-
action.show = RCTUIManager.ToolbarAndroid.Constants.ShowAsAction[action.show];
157+
action.show = UIManager.ToolbarAndroid.Constants.ShowAsAction[action.show];
158158
}
159159
nativeActions.push(action);
160160
}

Libraries/Components/Touchable/TouchableNativeFeedback.android.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -11,11 +11,11 @@
1111
'use strict';
1212

1313
var PropTypes = require('ReactPropTypes');
14-
var RCTUIManager = require('NativeModules').UIManager;
1514
var React = require('React');
1615
var ReactNativeViewAttributes = require('ReactNativeViewAttributes');
1716
var Touchable = require('Touchable');
1817
var TouchableWithoutFeedback = require('TouchableWithoutFeedback');
18+
var UIManager = require('UIManager');
1919

2020
var createStrictShapeTypeChecker = require('createStrictShapeTypeChecker');
2121
var ensurePositiveDelayProps = require('ensurePositiveDelayProps');
@@ -181,17 +181,17 @@ var TouchableNativeFeedback = React.createClass({
181181
},
182182

183183
_dispatchHotspotUpdate: function(destX, destY) {
184-
RCTUIManager.dispatchViewManagerCommand(
184+
UIManager.dispatchViewManagerCommand(
185185
React.findNodeHandle(this),
186-
RCTUIManager.RCTView.Commands.hotspotUpdate,
186+
UIManager.RCTView.Commands.hotspotUpdate,
187187
[destX || 0, destY || 0]
188188
);
189189
},
190190

191191
_dispatchPressedStateChange: function(pressed) {
192-
RCTUIManager.dispatchViewManagerCommand(
192+
UIManager.dispatchViewManagerCommand(
193193
React.findNodeHandle(this),
194-
RCTUIManager.RCTView.Commands.setPressed,
194+
UIManager.RCTView.Commands.setPressed,
195195
[pressed]
196196
);
197197
},

Libraries/Components/View/View.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,11 +13,11 @@
1313

1414
var NativeMethodsMixin = require('NativeMethodsMixin');
1515
var PropTypes = require('ReactPropTypes');
16-
var RCTUIManager = require('NativeModules').UIManager;
1716
var React = require('React');
1817
var ReactNativeStyleAttributes = require('ReactNativeStyleAttributes');
1918
var ReactNativeViewAttributes = require('ReactNativeViewAttributes');
2019
var StyleSheetPropType = require('StyleSheetPropType');
20+
var UIManager = require('UIManager');
2121
var ViewStylePropTypes = require('ViewStylePropTypes');
2222

2323
var requireNativeComponent = require('requireNativeComponent');
@@ -327,7 +327,7 @@ var RCTView = requireNativeComponent('RCTView', View, {
327327
});
328328

329329
if (__DEV__) {
330-
var viewConfig = RCTUIManager.viewConfigs && RCTUIManager.viewConfigs.RCTView || {};
330+
var viewConfig = UIManager.viewConfigs && UIManager.viewConfigs.RCTView || {};
331331
for (var prop in viewConfig.nativeProps) {
332332
var viewAny: any = View; // Appease flow
333333
if (!viewAny.propTypes[prop] && !ReactNativeStyleAttributes[prop]) {

Libraries/Components/ViewPager/ViewPagerAndroid.android.js

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -7,15 +7,13 @@
77
'use strict';
88

99
var NativeMethodsMixin = require('NativeMethodsMixin');
10-
var NativeModules = require('NativeModules');
1110
var React = require('React');
1211
var ReactElement = require('ReactElement');
1312
var ReactNativeViewAttributes = require('ReactNativeViewAttributes');
1413
var ReactPropTypes = require('ReactPropTypes');
14+
var UIManager = require('UIManager');
1515
var View = require('View');
1616

17-
var RCTUIManager = NativeModules.UIManager;
18-
1917
var dismissKeyboard = require('dismissKeyboard');
2018
var requireNativeComponent = require('requireNativeComponent');
2119

@@ -157,9 +155,9 @@ var ViewPagerAndroid = React.createClass({
157155
* The transition between pages will be animated.
158156
*/
159157
setPage: function(selectedPage: number) {
160-
RCTUIManager.dispatchViewManagerCommand(
158+
UIManager.dispatchViewManagerCommand(
161159
React.findNodeHandle(this),
162-
RCTUIManager.AndroidViewPager.Commands.setPage,
160+
UIManager.AndroidViewPager.Commands.setPage,
163161
[selectedPage],
164162
);
165163
},
@@ -169,9 +167,9 @@ var ViewPagerAndroid = React.createClass({
169167
* The transition between pages will be *not* be animated.
170168
*/
171169
setPageWithoutAnimation: function(selectedPage: number) {
172-
RCTUIManager.dispatchViewManagerCommand(
170+
UIManager.dispatchViewManagerCommand(
173171
React.findNodeHandle(this),
174-
RCTUIManager.AndroidViewPager.Commands.setPageWithoutAnimation,
172+
UIManager.AndroidViewPager.Commands.setPageWithoutAnimation,
175173
[selectedPage],
176174
);
177175
},

Libraries/Components/WebView/WebView.android.js

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -14,14 +14,14 @@ var EdgeInsetsPropType = require('EdgeInsetsPropType');
1414
var React = require('React');
1515
var ReactNativeViewAttributes = require('ReactNativeViewAttributes');
1616
var StyleSheet = require('StyleSheet');
17+
var UIManager = require('UIManager');
1718
var View = require('View');
1819

1920
var keyMirror = require('keyMirror');
2021
var merge = require('merge');
2122
var requireNativeComponent = require('requireNativeComponent');
2223

2324
var PropTypes = React.PropTypes;
24-
var RCTUIManager = require('NativeModules').UIManager;
2525

2626
var RCT_WEBVIEW_REF = 'webview';
2727

@@ -129,25 +129,25 @@ var WebView = React.createClass({
129129
},
130130

131131
goForward: function() {
132-
RCTUIManager.dispatchViewManagerCommand(
132+
UIManager.dispatchViewManagerCommand(
133133
this.getWebWiewHandle(),
134-
RCTUIManager.RCTWebView.Commands.goForward,
134+
UIManager.RCTWebView.Commands.goForward,
135135
null
136136
);
137137
},
138138

139139
goBack: function() {
140-
RCTUIManager.dispatchViewManagerCommand(
140+
UIManager.dispatchViewManagerCommand(
141141
this.getWebWiewHandle(),
142-
RCTUIManager.RCTWebView.Commands.goBack,
142+
UIManager.RCTWebView.Commands.goBack,
143143
null
144144
);
145145
},
146146

147147
reload: function() {
148-
RCTUIManager.dispatchViewManagerCommand(
148+
UIManager.dispatchViewManagerCommand(
149149
this.getWebWiewHandle(),
150-
RCTUIManager.RCTWebView.Commands.reload,
150+
UIManager.RCTWebView.Commands.reload,
151151
null
152152
);
153153
},

Libraries/CustomComponents/ListView/ListView.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,6 @@
2828

2929
var ListViewDataSource = require('ListViewDataSource');
3030
var React = require('React');
31-
var RCTUIManager = require('NativeModules').UIManager;
3231
var RCTScrollViewManager = require('NativeModules').ScrollViewManager;
3332
var ScrollView = require('ScrollView');
3433
var ScrollResponder = require('ScrollResponder');

0 commit comments

Comments
 (0)