Skip to content

Commit 0baacbe

Browse files
elicwhitefacebook-github-bot
authored andcommitted
Migrate scrollResponderScrollNativeHandleToKeyboard function to take nativeRef
Summary: We need to get rid of findNodeHandle calls so migrating scrollResponderScrollNativeHandleToKeyboard to take a ref to a host component. I made this change with Flow, and tested by rendering UserJobApplicationForm Reviewed By: mdvacca Differential Revision: D17099280 fbshipit-source-id: 96af692006aace2c206f268f5416984b00f8a438
1 parent 3e4c5c0 commit 0baacbe

File tree

3 files changed

+52
-13
lines changed

3 files changed

+52
-13
lines changed

Libraries/Components/ScrollResponder.js

Lines changed: 20 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010

1111
'use strict';
1212

13+
const React = require('react');
1314
const Dimensions = require('../Utilities/Dimensions');
1415
const FrameRateLogger = require('../Interaction/FrameRateLogger');
1516
const Keyboard = require('./Keyboard/Keyboard');
@@ -535,19 +536,30 @@ const ScrollResponderMixin = {
535536
* @param {bool} preventNegativeScrolling Whether to allow pulling the content
536537
* down to make it meet the keyboard's top. Default is false.
537538
*/
538-
scrollResponderScrollNativeHandleToKeyboard: function(
539-
nodeHandle: number,
539+
scrollResponderScrollNativeHandleToKeyboard: function<T>(
540+
nodeHandle:
541+
| number
542+
| React.ElementRef<Class<ReactNative.NativeComponent<T>>>,
540543
additionalOffset?: number,
541544
preventNegativeScrollOffset?: boolean,
542545
) {
543546
this.additionalScrollOffset = additionalOffset || 0;
544547
this.preventNegativeScrollOffset = !!preventNegativeScrollOffset;
545-
UIManager.measureLayout(
546-
nodeHandle,
547-
ReactNative.findNodeHandle(this.getInnerViewNode()),
548-
this.scrollResponderTextInputFocusError,
549-
this.scrollResponderInputMeasureAndScrollToKeyboard,
550-
);
548+
549+
if (typeof nodeHandle === 'number') {
550+
UIManager.measureLayout(
551+
nodeHandle,
552+
ReactNative.findNodeHandle(this.getInnerViewNode()),
553+
this.scrollResponderTextInputFocusError,
554+
this.scrollResponderInputMeasureAndScrollToKeyboard,
555+
);
556+
} else {
557+
nodeHandle.measureLayout(
558+
this.getInnerViewRef(),
559+
this.scrollResponderInputMeasureAndScrollToKeyboard,
560+
this.scrollResponderTextInputFocusError,
561+
);
562+
}
551563
},
552564

553565
/**

Libraries/Components/ScrollView/ScrollView.js

Lines changed: 22 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -69,6 +69,7 @@ export type ScrollResponderType = {
6969
// issue by specifying them manually.
7070
getScrollableNode: $PropertyType<ScrollView, 'getScrollableNode'>,
7171
getInnerViewNode: $PropertyType<ScrollView, 'getInnerViewNode'>,
72+
getInnerViewRef: $PropertyType<ScrollView, 'getInnerViewRef'>,
7273
getNativeScrollRef: $PropertyType<ScrollView, 'getNativeScrollRef'>,
7374

7475
setNativeProps: $PropertyType<ScrollView, 'setNativeProps'>,
@@ -779,7 +780,15 @@ class ScrollView extends React.Component<Props, State> {
779780
return ReactNative.findNodeHandle(this._innerViewRef);
780781
}
781782

782-
getNativeScrollRef(): ?ScrollView {
783+
getInnerViewRef(): ?React.ElementRef<
784+
Class<ReactNative.NativeComponent<mixed>>,
785+
> {
786+
return this._innerViewRef;
787+
}
788+
789+
getNativeScrollRef(): ?React.ElementRef<
790+
Class<ReactNative.NativeComponent<mixed>>,
791+
> {
783792
return this._scrollViewRef;
784793
}
785794

@@ -942,13 +951,21 @@ class ScrollView extends React.Component<Props, State> {
942951
this.props.onContentSizeChange(width, height);
943952
};
944953

945-
_scrollViewRef: ?ScrollView = null;
946-
_setScrollViewRef = (ref: ?ScrollView) => {
954+
_scrollViewRef: ?React.ElementRef<
955+
Class<ReactNative.NativeComponent<mixed>>,
956+
> = null;
957+
_setScrollViewRef = (
958+
ref: ?React.ElementRef<Class<ReactNative.NativeComponent<mixed>>>,
959+
) => {
947960
this._scrollViewRef = ref;
948961
};
949962

950-
_innerViewRef: ?NativeMethodsMixinType = null;
951-
_setInnerViewRef = (ref: ?NativeMethodsMixinType) => {
963+
_innerViewRef: ?React.ElementRef<
964+
Class<ReactNative.NativeComponent<mixed>>,
965+
> = null;
966+
_setInnerViewRef = (
967+
ref: ?React.ElementRef<Class<ReactNative.NativeComponent<mixed>>>,
968+
) => {
952969
this._innerViewRef = ref;
953970
};
954971

Libraries/Components/TextInput/TextInput.js

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -904,6 +904,12 @@ const TextInput = createReactClass({
904904
this._inputRef = ref;
905905
},
906906

907+
getNativeRef: function(): ?React.ElementRef<
908+
Class<ReactNative.NativeComponent<mixed>>,
909+
> {
910+
return this._inputRef;
911+
},
912+
907913
_renderIOSLegacy: function() {
908914
let textContainer;
909915

@@ -1224,6 +1230,10 @@ const TextInput = createReactClass({
12241230
class InternalTextInputType extends ReactNative.NativeComponent<Props> {
12251231
clear() {}
12261232

1233+
getNativeRef(): ?React.ElementRef<
1234+
Class<ReactNative.NativeComponent<mixed>>,
1235+
> {}
1236+
12271237
// $FlowFixMe
12281238
isFocused(): boolean {}
12291239
}

0 commit comments

Comments
 (0)