From d54113d8c4bcd0e0c7a09acca60819724eb69926 Mon Sep 17 00:00:00 2001 From: Manvir Singh Date: Sun, 10 May 2020 23:44:18 -0700 Subject: [PATCH] implemented showSoftInputOnFocus for iOS (#28834) Summary: `showSoftInputOnFocus` was added in https://github.com/facebook/react-native/issues/25028, but it was only added for Android. There was a lot of discussion on the original issue being addressed (https://github.com/facebook/react-native/issues/14045), that there is a need for this on iOS as well. The issue with iOS was brought up again on https://github.com/facebook/react-native/issues/27243. On a related note, when searching this repo's issues for `showSoftInputOnFocus`, it appears that there are several closed issues that claim that the Android implementation doesn't work (https://github.com/facebook/react-native/issues/25685, https://github.com/facebook/react-native/issues/25687, https://github.com/facebook/react-native/issues/26643). So perhaps the Android implementation needs to be looked at as well (I myself have not gotten around to confirming whether it works or not) ## Changelog [iOS] [Added] - Add showSoftInputOnFocus to TextInput Pull Request resolved: https://github.com/facebook/react-native/pull/28834 Test Plan: You'd use this just like you would in the Android implementation: ```jsx ``` ## GIFs ### Before change ![May-04-2020 20-52-49](https://user-images.githubusercontent.com/4932784/81034028-9d89cf80-8e4a-11ea-906c-64f62504f80c.gif) ### After change ![May-04-2020 20-54-27](https://user-images.githubusercontent.com/4932784/81034035-a11d5680-8e4a-11ea-918e-119a1c9e2a19.gif) Differential Revision: D21418763 Pulled By: shergin fbshipit-source-id: 561e72fc2cf16b30446132f6b96b8aa2b4a92daf --- .../TextInput/AndroidTextInputNativeComponent.js | 1 - Libraries/Components/TextInput/TextInput.js | 1 - .../DeprecatedTextInputPropTypes.js | 1 - .../Text/TextInput/RCTBackedTextInputViewProtocol.h | 1 + Libraries/Text/TextInput/RCTBaseTextInputView.h | 1 + Libraries/Text/TextInput/RCTBaseTextInputView.m | 11 +++++++++++ .../Text/TextInput/RCTBaseTextInputViewManager.m | 1 + .../js/examples/TextInput/TextInputExample.ios.js | 12 ++++++++++++ .../components/textinput/iostextinput/primitives.h | 6 ++++++ .../textinput/iostextinput/propsConversions.h | 5 +++++ 10 files changed, 37 insertions(+), 3 deletions(-) diff --git a/Libraries/Components/TextInput/AndroidTextInputNativeComponent.js b/Libraries/Components/TextInput/AndroidTextInputNativeComponent.js index 61e37c54bea434..27f7abbe7d1c2f 100644 --- a/Libraries/Components/TextInput/AndroidTextInputNativeComponent.js +++ b/Libraries/Components/TextInput/AndroidTextInputNativeComponent.js @@ -183,7 +183,6 @@ export type NativeProps = $ReadOnly<{| /** * When `false`, it will prevent the soft keyboard from showing when the field is focused. * Defaults to `true`. - * @platform android */ showSoftInputOnFocus?: ?boolean, diff --git a/Libraries/Components/TextInput/TextInput.js b/Libraries/Components/TextInput/TextInput.js index da0e0bd77b3fb6..75a7c417d5c7a3 100644 --- a/Libraries/Components/TextInput/TextInput.js +++ b/Libraries/Components/TextInput/TextInput.js @@ -408,7 +408,6 @@ type AndroidProps = $ReadOnly<{| /** * When `false`, it will prevent the soft keyboard from showing when the field is focused. * Defaults to `true`. - * @platform android */ showSoftInputOnFocus?: ?boolean, |}>; diff --git a/Libraries/DeprecatedPropTypes/DeprecatedTextInputPropTypes.js b/Libraries/DeprecatedPropTypes/DeprecatedTextInputPropTypes.js index 275d607b94821d..52a4714d84e914 100644 --- a/Libraries/DeprecatedPropTypes/DeprecatedTextInputPropTypes.js +++ b/Libraries/DeprecatedPropTypes/DeprecatedTextInputPropTypes.js @@ -616,7 +616,6 @@ module.exports = { /** * When `false`, it will prevent the soft keyboard from showing when the field is focused. * Defaults to `true`. - * @platform android */ showSoftInputOnFocus: PropTypes.bool, }; diff --git a/Libraries/Text/TextInput/RCTBackedTextInputViewProtocol.h b/Libraries/Text/TextInput/RCTBackedTextInputViewProtocol.h index 5c4c28de02732a..2fd80897eb840c 100644 --- a/Libraries/Text/TextInput/RCTBackedTextInputViewProtocol.h +++ b/Libraries/Text/TextInput/RCTBackedTextInputViewProtocol.h @@ -20,6 +20,7 @@ NS_ASSUME_NONNULL_BEGIN @property (nonatomic, assign, readonly) BOOL textWasPasted; @property (nonatomic, assign) UIEdgeInsets textContainerInset; @property (nonatomic, strong, nullable) UIView *inputAccessoryView; +@property (nonatomic, strong, nullable) UIView *inputView; @property (nonatomic, weak, nullable) id textInputDelegate; @property (nonatomic, readonly) CGSize contentSize; @property (nonatomic, strong, nullable) NSDictionary *defaultTextAttributes; diff --git a/Libraries/Text/TextInput/RCTBaseTextInputView.h b/Libraries/Text/TextInput/RCTBaseTextInputView.h index fb5f02ec5ad48b..d7fc54bed85dab 100644 --- a/Libraries/Text/TextInput/RCTBaseTextInputView.h +++ b/Libraries/Text/TextInput/RCTBaseTextInputView.h @@ -51,6 +51,7 @@ NS_ASSUME_NONNULL_BEGIN @property (nonatomic, copy, nullable) NSAttributedString *attributedText; @property (nonatomic, copy) NSString *inputAccessoryViewID; @property (nonatomic, assign) UIKeyboardType keyboardType; +@property (nonatomic, assign) BOOL showSoftInputOnFocus; /** Sets selection intext input if both start and end are within range of the text input. diff --git a/Libraries/Text/TextInput/RCTBaseTextInputView.m b/Libraries/Text/TextInput/RCTBaseTextInputView.m index aa69593f68fa25..37b849c2776dd2 100644 --- a/Libraries/Text/TextInput/RCTBaseTextInputView.m +++ b/Libraries/Text/TextInput/RCTBaseTextInputView.m @@ -302,6 +302,17 @@ - (void)setKeyboardType:(UIKeyboardType)keyboardType } } +- (void)setShowSoftInputOnFocus:(BOOL)showSoftInputOnFocus +{ + if (showSoftInputOnFocus) { + // Resets to default keyboard. + self.backedTextInputView.inputView = nil; + } else { + // Hides keyboard, but keeps blinking cursor. + self.backedTextInputView.inputView = [[UIView alloc] init]; + } +} + #pragma mark - RCTBackedTextInputDelegate - (BOOL)textInputShouldBeginEditing diff --git a/Libraries/Text/TextInput/RCTBaseTextInputViewManager.m b/Libraries/Text/TextInput/RCTBaseTextInputViewManager.m index dca143760a11a0..34994ca4fd115c 100644 --- a/Libraries/Text/TextInput/RCTBaseTextInputViewManager.m +++ b/Libraries/Text/TextInput/RCTBaseTextInputViewManager.m @@ -52,6 +52,7 @@ @implementation RCTBaseTextInputViewManager RCT_EXPORT_VIEW_PROPERTY(blurOnSubmit, BOOL) RCT_EXPORT_VIEW_PROPERTY(clearTextOnFocus, BOOL) RCT_EXPORT_VIEW_PROPERTY(keyboardType, UIKeyboardType) +RCT_EXPORT_VIEW_PROPERTY(showSoftInputOnFocus, BOOL) RCT_EXPORT_VIEW_PROPERTY(maxLength, NSNumber) RCT_EXPORT_VIEW_PROPERTY(selectTextOnFocus, BOOL) RCT_EXPORT_VIEW_PROPERTY(selection, RCTTextSelection) diff --git a/RNTester/js/examples/TextInput/TextInputExample.ios.js b/RNTester/js/examples/TextInput/TextInputExample.ios.js index 7e1673070e0109..311efa1179b066 100644 --- a/RNTester/js/examples/TextInput/TextInputExample.ios.js +++ b/RNTester/js/examples/TextInput/TextInputExample.ios.js @@ -707,4 +707,16 @@ exports.examples = ([ ); }, }, + { + title: 'showSoftInputOnFocus', + render: function(): React.Node { + return ( + + + + + + ); + }, + }, ]: Array); diff --git a/ReactCommon/fabric/components/textinput/iostextinput/primitives.h b/ReactCommon/fabric/components/textinput/iostextinput/primitives.h index 1bd7caa9386bd3..f10fa2b42e368b 100644 --- a/ReactCommon/fabric/components/textinput/iostextinput/primitives.h +++ b/ReactCommon/fabric/components/textinput/iostextinput/primitives.h @@ -180,6 +180,12 @@ class TextInputTraits final { */ KeyboardType keyboardType{KeyboardType::Default}; + /* + * iOS & Android + * Default value: `true`. + */ + bool showSoftInputOnFocus{true}; + /* * Some values iOS- or Android-only (inherently particular-OS-specific) * Default value: `Default`. diff --git a/ReactCommon/fabric/components/textinput/iostextinput/propsConversions.h b/ReactCommon/fabric/components/textinput/iostextinput/propsConversions.h index 6c12a5716a15ab..6b5150d0aae095 100644 --- a/ReactCommon/fabric/components/textinput/iostextinput/propsConversions.h +++ b/ReactCommon/fabric/components/textinput/iostextinput/propsConversions.h @@ -88,6 +88,11 @@ static TextInputTraits convertRawProp( "keyboardType", sourceTraits.keyboardType, defaultTraits.keyboardType); + traits.showSoftInputOnFocus = convertRawProp( + rawProps, + "showSoftInputOnFocus", + sourceTraits.showSoftInputOnFocus, + defaultTraits.showSoftInputOnFocus); traits.returnKeyType = convertRawProp( rawProps, "returnKeyType",