React-native-elements: Error while updating property 'selectionColor' of a view managed by: AndroidTextInput

[eliasturbay]

When using this component (only in Android)

<SearchBar
          lightTheme
          placeholder='Search...' 
          containerStyle={{backgroundColor: Colors.tintColor, borderTopWidth: 0, borderBottomWidth: 1}}
          inputStyle={{backgroundColor: 'white'}}
        />

Version: "react-native-elements": "^0.11.1"

Complete dependecies list:

  "dependencies": {
    "@expo/react-native-navigator": "^0.4.1",
    "@expo/react-native-read-more-text": "^1.1.0",
    "@expo/vector-icons": "~4.0.0",
    "expo": "^16.0.0",
    "hoist-non-react-statics": "^1.2.0",
    "moment": "^2.18.1",
    "react": "16.0.0-alpha.6",
    "react-addons-shallow-compare": "^15.5.2",
    "react-native": "https://github.com/exponent/react-native/archive/sdk-16.0.0.tar.gz",
    "react-native-app-intro": "~1.1.5",
    "react-native-button": "~1.8.2",
    "react-native-communications": "^2.2.1",
    "react-native-dropdownalert": "^2.7.1",
    "react-native-elements": "^0.11.1",
    "react-native-grid-component": "^1.0.6",
    "react-native-i18n": "^1.0.0",
    "react-native-textinput-effects": "^0.3.0",
    "react-navigation": "^1.0.0-beta.7",
    "react-navigation-addons": "git://github.com/satya164/react-navigation-addons.git#master"
  }

This issue happened when upgrading to expo 16

[tarang9211]

Hey @eliasturbay thanks for providing detailed information regarding the issue! When you get a chance, have a look at https://github.com/react-native-training/react-native-elements/issues/319 and let me know if that helps.

[eliasturbay]

Hey @tarang9211 thanks for your quick response. I checked that issue and the others related. Correct me if I'm wrong... I'll have to wait for an update in React Native code base to have a fix for this issue?

[tarang9211]

@eliasturbay Yup, I think that's what will have to happen. @bozzmob Does that sound about right?

[martinezguillaume]

Hey ! Any workaround here ? I'm using expo ! Thanks !

EDIT: If you're using expo, you need to wait for the release of next update sdk 17 (ref)

[RyszardRzepa]

I updated to react-native -v 0.44 , but still having this Error "Error while updating property 'selectionColor' of a view managed by: AndroidTextInput"

[RyszardRzepa]

I found this error related to { searchBar }. After removing this component, error disappear.

[naveenkonduru]

it didn't work even in Exp 17

[itsashis4u]

Same as @naveenkonduru

[martinezguillaume]

Same here... With RN 0.44

[Monte9]

We are looking into this. Sorry about that.

We will fix this asap and push a fix for it soon.
/cc @binoy14

[vthu]

@Monte9
Thanks for taking a look at this issue...
Hoping to get a solution soon :)

[vthu]

@binoy14 @Monte9 Any update on this bug?

[vthu]

Thanks @binoy14 :)

[hskb10]

Hi @binoy14!, @Monte9, @vthu update on the bug? Thanks!

[binoy14]

I can confirm this only happens if you are using Expo in any way, either the expo client or create-react-native-app. To solve this issue immediately, I am removing the default selectionColor. It can always be added by passing it as a prop to FormInput and SearchBar. Can someone confirm this works? Change the react-native-elements in package.json to following

"react-native-elements": "git://github.com/react-native-training/react-native-elements.git#next"

[rafaelmhp]

@binoy14 I was having the same problem but I can confirm the fix worked after the update. Thanks!

[xavier-villelegier]

@binoy14 Same here, fixed ! Thanks

[Monte9]

Thanks for the fix @binoy14!

Closing this issue as this fix will be released in v0.12.3

[NunoCardoso]

I am having this issue, and I am with the 0.17 version.
Had to remove references of selectionColor from source code so I could run my app.

[lejoss]

@Monte9 hi, i'm having the same issue, i'm using expo too. I detached my app, opened it on Android Studio and got the error.

"expo": "^21.0.0"
"react-native-elements": "^0.17.0"
"react": "16.0.0-alpha.12"

{
  "expo": {
    "name": "mobile",
    "description": "No description",
    "slug": "mobile",
    "privacy": "public",
    "sdkVersion": "21.0.0",
    "androidStatusBar": {
      "barStyle": "dark-content",
      "backgroundColor": "#0D4969"
    },
    "loading": {
      "backgroundImage": "./assets/images/marmon.png",
      "hideExponentText": true
    },
    "version": "1.0.0",
    "orientation": "portrait",
    "primaryColor": "#cccccc",
    "icon": "./assets/icons/app-icon.png",
    "notification": {
      "icon": "./assets/icons/notification-icon.png",
      "color": "#000000"
    },
    "packagerOpts": {
      "assetExts": ["ttf"]
    },
    "ios": {
      "bundleIdentifier": "com.sk3vy.new-project-template",
      "supportsTablet": true
    }
  }
}

how can i debug the source of the issue? I'm not using selectionColor

[iRoachie]

Hey all, a fix was made in https://github.com/react-native-training/react-native-elements/pull/666 to fix this problem. However the version hasn't been released as yet. You can use the next branch of react-native-elements in the mean time until 0.18 is released.

[lejoss]

@iRoachie @Monte9 i was trying the next version on RNE, to avoid the selectionColor issue, but i got this instead

these are my dependencies

git+https://github.com/react-native-training/react-native-elements.git#next

"expo": "^22.0.0",
    "react": "16.0.0-beta.5",
    "react-native": "https://github.com/expo/react-native/archive/sdk-22.0.1.tar.gz",
    "react-native-elements": "git+https://github.com/react-native-training/react-native-elements.git#next"

[xavier-villelegier]

@lejoss What if you run npm install @expo/vector-icons --save-dev ?

[lejoss]

@xavier-villelegier yes you were right, i missed the module, thanks. FormInput is working now.

    "@expo/vector-icons": "^6.1.0",
    "expo": "^22.0.0",
    "react": "16.0.0-beta.5",
    "react-native": "https://github.com/expo/react-native/archive/sdk-22.0.1.tar.gz",
    "react-native-elements": "git+https://github.com/react-native-training/react-native-elements.git#next"

[titkov5]

Got the same issue with TextField, but the problem was inside tintColor of TextInput of RN (0.49.3) i found my problem in AndroidManifest.xml this is my lines http://prntscr.com/h48lwb

[iRoachie]

Fixed in v18.0.0

[mikeumus]

@lilymGoh's solution worked for me here:

Remove selectionColor={...} on line 484 in src/components/field/index.js should fix it.