Skip to content

Commit 6adba40

Browse files
janicduplessisfacebook-github-bot
authored andcommitted
Implement TextInput autoFocus natively on iOS (#27803)
Summary: This implement the autoFocus functionality natively instead of calling the focus method from JS on mount. This is needed to properly fix the issue described in #27217, where when using native navigation (UINavigationController) text input focus needs to happen in the same frame transition starts or it leads to an animation bug in UIKit. My previous attempt fixed the problem only partially and the bug could still happen since there is no guaranty code executed in useEffect will end up in the same frame as the native view being created and attached. To fix this I added an autoFocus prop to the native component on iOS and in didAttachToWindow we focus the input if it is set. This makes sure the focus is set in the same frame as the view hierarchy containing the input is created. ## Changelog [iOS] [Fixed] - Add native support for TextInput autoFocus on iOS Pull Request resolved: #27803 Test Plan: - Tested that the UI glitch when transitionning to a screen with an input with autofocus no longer happens in my app. - Tested that autofocus still works in RNTester - Made sure that onFocus does get called and TextInputState is updated properly Differential Revision: D19673369 Pulled By: TheSavior fbshipit-source-id: 14d8486ac635901622ca667c0e61c75fb446e493
1 parent facf5db commit 6adba40

File tree

3 files changed

+10
-1
lines changed

3 files changed

+10
-1
lines changed

Libraries/Text/TextInput/RCTBaseTextInputView.h

+1
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,7 @@ NS_ASSUME_NONNULL_BEGIN
4040
@property (nonatomic, copy, nullable) RCTDirectEventBlock onScroll;
4141

4242
@property (nonatomic, assign) NSInteger mostRecentEventCount;
43+
@property (nonatomic, assign) BOOL autoFocus;
4344
@property (nonatomic, assign) BOOL blurOnSubmit;
4445
@property (nonatomic, assign) BOOL selectTextOnFocus;
4546
@property (nonatomic, assign) BOOL clearTextOnFocus;

Libraries/Text/TextInput/RCTBaseTextInputView.m

+8-1
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ @implementation RCTBaseTextInputView {
2525
BOOL _hasInputAccesoryView;
2626
NSString *_Nullable _predictedText;
2727
NSInteger _nativeEventCount;
28+
BOOL _didMoveToWindow;
2829
}
2930

3031
- (instancetype)initWithBridge:(RCTBridge *)bridge
@@ -519,7 +520,13 @@ - (void)reactBlur
519520

520521
- (void)didMoveToWindow
521522
{
522-
[self.backedTextInputView reactFocusIfNeeded];
523+
if (self.autoFocus && !_didMoveToWindow) {
524+
[self.backedTextInputView reactFocus];
525+
} else {
526+
[self.backedTextInputView reactFocusIfNeeded];
527+
}
528+
529+
_didMoveToWindow = YES;
523530
}
524531

525532
#pragma mark - Custom Input Accessory View

Libraries/Text/TextInput/RCTBaseTextInputViewManager.m

+1
Original file line numberDiff line numberDiff line change
@@ -48,6 +48,7 @@ @implementation RCTBaseTextInputViewManager
4848
RCT_REMAP_VIEW_PROPERTY(clearButtonMode, backedTextInputView.clearButtonMode, UITextFieldViewMode)
4949
RCT_REMAP_VIEW_PROPERTY(scrollEnabled, backedTextInputView.scrollEnabled, BOOL)
5050
RCT_REMAP_VIEW_PROPERTY(secureTextEntry, backedTextInputView.secureTextEntry, BOOL)
51+
RCT_EXPORT_VIEW_PROPERTY(autoFocus, BOOL)
5152
RCT_EXPORT_VIEW_PROPERTY(blurOnSubmit, BOOL)
5253
RCT_EXPORT_VIEW_PROPERTY(clearTextOnFocus, BOOL)
5354
RCT_EXPORT_VIEW_PROPERTY(keyboardType, UIKeyboardType)

0 commit comments

Comments
 (0)