Reworking keyboardShouldPersistTaps to have a middle ground

Summary:
Right now, the ScrollView's keyboard hiding behavior is either all or nothing: Hide the keyboard on any tap, or do nothing ever. This PR introduces a third mode to keyboardShouldPersistTaps which is much closer to what I consider should be the default.

In the new behavior, the tap responding is done in the bubbling phase (instead of the capture phase like =true). As a result, a child can handle the tap. If no child does, then the ScrollView will receive the tap and will hide the keyboard. As a result, changing TextInput focus works as a user expects, with a single tap and without keyboard hiding. But taping on Text or on the empty part of the ScrollView hides the keyboard and removes the focus.

You can view the behavior in a monkey patched ScrollView demo on rnplay:
https://rnplay.org/apps/E90UYw
https://rnplay.org/apps/UGzhKA

In order to have a uniform props set, i added 3 values to the keyboardShouldPersistTaps:
'never' and 'always' are the same as false and true.
'handled' is the new behavior.

I don't
Closes https://github.com/facebook/react-native/pull/10628

Differential Revision: D4294945

Pulled By: ericvicenti

fbshipit-source-id: 1a753014156cac1a23fabfa8e1faa9a768868ef2
This commit is contained in:
Maxime Lapointe
2016-12-07 21:39:54 -08:00
committed by Facebook Github Bot
parent 4d5ef76b1a
commit d56530d7d5
5 changed files with 37 additions and 14 deletions

View File

@@ -82,7 +82,7 @@ class UIExplorerExampleList extends React.Component {
renderRow={this._renderExampleRow.bind(this)}
renderSectionHeader={this._renderSectionHeader}
enableEmptySections={true}
keyboardShouldPersistTaps={true}
keyboardShouldPersistTaps="handled"
automaticallyAdjustContentInsets={false}
keyboardDismissMode="on-drag"
/>