[Android] Fix non selectable Text in FlatList

ReactAndroid/src/main/java/com/facebook/react/views/text/ReactTextView.java

@@ -56,6 +56,7 @@ public class ReactTextView extends AppCompatTextView implements ReactCompoundVie
   private boolean mAdjustsFontSizeToFit = false;
   private int mLinkifyMaskType = 0;
   private boolean mNotifyOnInlineViewLayout;
+  private boolean mTextIsSelectable = false;
 
   private ReactViewBackgroundManager mReactBackgroundManager;
   private Spannable mSpanned;
@@ -433,9 +434,16 @@ public void onStartTemporaryDetach() {
     }
   }
 
+  @Override
+  public void setTextIsSelectable(boolean selectable) {
+    mTextIsSelectable = selectable;
+    super.setTextIsSelectable(selectable);
+  }
+
   @Override
   public void onAttachedToWindow() {
     super.onAttachedToWindow();
+    setTextIsSelectable(mTextIsSelectable);
     if (mContainsImages && getText() instanceof Spanned) {
       Spanned text = (Spanned) getText();
       TextInlineImageSpan[] spans = text.getSpans(0, text.length(), TextInlineImageSpan.class);

packages/rn-tester/js/components/ListExampleShared.js

@@ -57,13 +57,14 @@ class ItemComponent extends React.PureComponent<{
   onPress: (key: string) => void,
   onShowUnderlay?: () => void,
   onHideUnderlay?: () => void,
+  textSelectable?: ?boolean,
   ...
 }> {
   _onPress = () => {
     this.props.onPress(this.props.item.key);
   };
   render(): React.Node {
-    const {fixedHeight, horizontal, item} = this.props;
+    const {fixedHeight, horizontal, item, textSelectable} = this.props;
     const itemHash = Math.abs(hashCode(item.title));
     const imgSource = THUMB_URLS[itemHash % THUMB_URLS.length];
     return (
@@ -81,6 +82,7 @@ class ItemComponent extends React.PureComponent<{
           {!item.noImage && <Image style={styles.thumb} source={imgSource} />}
           <Text
             style={styles.text}
+            selectable={textSelectable}
             numberOfLines={horizontal || fixedHeight ? 3 : undefined}>
             {item.title} - {item.text}
           </Text>

packages/rn-tester/js/examples/FlatList/FlatListExample.js

@@ -59,6 +59,8 @@ type State = {|
   empty: boolean,
   useFlatListItemComponent: boolean,
   fadingEdgeLength: number,
+  onPressDisabled: boolean,
+  textSelectable: boolean,
 |};
 
 class FlatListExample extends React.PureComponent<Props, State> {
@@ -74,6 +76,8 @@ class FlatListExample extends React.PureComponent<Props, State> {
     empty: false,
     useFlatListItemComponent: false,
     fadingEdgeLength: 0,
+    onPressDisabled: false,
+    textSelectable: true,
   };
 
   _onChangeFilterText = filterText => {
@@ -161,6 +165,16 @@ class FlatListExample extends React.PureComponent<Props, State> {
                 this.state.debug,
                 this._setBooleanValue('debug'),
               )}
+              {renderSmallSwitchOption(
+                'onPress Disabled',
+                this.state.onPressDisabled,
+                this._setBooleanValue('onPressDisabled'),
+              )}
+              {renderSmallSwitchOption(
+                'Text Selectable',
+                this.state.textSelectable,
+                this._setBooleanValue('textSelectable'),
+              )}
               {renderSmallSwitchOption(
                 'Use FlatListItemComponent',
                 this.state.useFlatListItemComponent,
@@ -236,6 +250,12 @@ class FlatListExample extends React.PureComponent<Props, State> {
       data: state.data.concat(genItemData(100, state.data.length)),
     }));
   };
+  _onPressCallback = () => {
+    const {onPressDisabled} = this.state;
+    const warning = () => console.log('onPress disabled');
+    const onPressAction = onPressDisabled ? warning : this._pressItem;
+    return onPressAction;
+  };
   _onRefresh = () => Alert.alert('onRefresh: nothing to refresh :P');
   _renderItemComponent = () => {
     const flatListPropKey = this.state.useFlatListItemComponent
@@ -253,9 +273,10 @@ class FlatListExample extends React.PureComponent<Props, State> {
             item={item}
             horizontal={this.state.horizontal}
             fixedHeight={this.state.fixedHeight}
-            onPress={this._pressItem}
+            onPress={this._onPressCallback()}
             onShowUnderlay={separators.highlight}
             onHideUnderlay={separators.unhighlight}
+            textSelectable={this.state.textSelectable}
           />
         );
       },