NativeBase: RNCAndroidDropdownPicker was not found in the UIManager

Hi Thanks contributor for a best library for react native.

In latest version i am getting following error in android platform: RNCAndroidDropdownPicker was not found in the UIManager

node: 10.15.0 react-native: 0.63.4 nativebase: 2.15.2

Expected behaviour

PIcker shoult also working in android platform.

Actual behaviour

Getting following error in Android: RNCAndroidDropdownPicker was not found in the UIManager

Steps to reproduce

Code snipped:

<Item picker>                 
                              <Picker
                                   mode="dropdown"
                                   iosIcon={<Icon name="arrow-down" />}
                                   selectedValue={this.state.domain}
                                   onValueChange={(text) => { this.onValueChangeUpdateState("domain", text); }}
                                   placeholder="Select Domain"
                                   iosHeader="Select Domain"
                               >
                                   <Picker.Item label="Select Domain" value="" />
                                   <Picker.Item label="DMT" value="dmt" />
                               </Picker>
</Item>
``

About this issue

  • Original URL
  • State: closed
  • Created 3 years ago
  • Reactions: 18
  • Comments: 24

Most upvoted comments

Hello, just installing @react-native-picker/picker@^1.9.7 fixes the issue for me.

yarn add @react-native-picker/picker@^1.9.7

That version matches that used by native-base. Its also imperative to keep importing from native-base as it applies the predefined styles to the picker component.

import { Picker } from 'native-base'; // use this as it will apply the predefined styles from native-base

I think this issue has to do with auto-linking of the @react-native-picker/picker package. When its a dependency of native-base alone, somehow its not linked, but when directly depended upon by your app, its linked properly.

Hope it helps you 🚀 Happy Coding…

I found in source code that picker depends from @react-native-picker/picker package, so i just installed it with npm install @react-native-picker/picker --save and this fixed error.

https://github.com/GeekyAnts/NativeBase/blob/02f5b23e19b3db594e5b5828f336fdac32cfb1fc/src/basic/Picker.js#L5

Not sure if this is somehow an accepted way to proceed (old style, maybe…so I think it’s not a resolution to the bug but a possible workaround), but I have manually edited settings.gradle and app/build.gradle together with a line added to MainApplication.java in order to make it work.

The first step was to install the package: npm install @react-native-community/picker --save

app/build.gradle

Added implementation project(path: ':@react-native-community-picker')

to the dependencies section.

settings.gradle

Added

+include ':@react-native-community-picker'
+project(':@react-native-community-picker').projectDir = new File(rootProject.projectDir,       '../node_modules/@react-native-community/picker/android')

MainApplication.java

+import `com.reactnativecommunity.picker.RNCPickerPackage;`
// ...
@Override
                protected List<ReactPackage> getPackages() {
                    // [...]
                    return Arrays.<ReactPackage>asList(
                           // [..]
                           new RNCPickerPackage()
                    );
               }

This is not a solution, but I wanted to add some steps that made the module work soon (very urgent for me).

I’m getting this same issue, installing @react-native-picker/picker did not resolve the issue for me.

Hello, just installing @react-native-picker/picker@^1.9.7 fixes the issue for me.

yarn add @react-native-picker/picker@^1.9.7

That version matches that used by native-base. Its also imperative to keep importing from native-base as it applies the predefined styles to the picker component.

import { Picker } from 'native-base'; // use this as it will apply the predefined styles from native-base

I think this issue has to do with auto-linking of the @react-native-picker/picker package. When its a dependency of native-base alone, somehow its not linked, but when directly depended upon by your app, its linked properly.

Hope it helps you Happy Coding…

i think this is true. that is why we have to install again react-native-picker into our dependencies.

but if we want to make both of them use the latest version, reinstall native-base so it would install latest version of react-native-picker. Then install react-native-picker. for me, now both of them using react-native-picker 1.15.0 and the error solved too.

thanks to @mernxl

I am not sure if this should be closed. Isn’t it still an issue because something about the dependencies is off?

I got a similar issue, but only downgrading to native-base <= 2.13.14 seems to resolve it.

Not sure if this is somehow an accepted way to proceed (old style, maybe…so I think it’s not a resolution to the bug but a possible workaround), but I have manually edited settings.gradle and app/build.gradle together with a line added to MainApplication.java in order to make it work.

The first step was to install the package: npm install @react-native-community/picker --save

app/build.gradle

Added implementation project(path: ':@react-native-community-picker')

to the dependencies section.

settings.gradle

Added

+include ':@react-native-community-picker'
+project(':@react-native-community-picker').projectDir = new File(rootProject.projectDir,       '../node_modules/@react-native-community/picker/android')

MainApplication.java

+import `com.reactnativecommunity.picker.RNCPickerPackage;`
// ...
@Override
                protected List<ReactPackage> getPackages() {
                    // [...]
                    return Arrays.<ReactPackage>asList(
                           // [..]
                           new RNCPickerPackage()
                    );
               }

This is not a solution, but I wanted to add some steps that made the module work soon (very urgent for me).

This solution working but we need to get a solution for @react-native-picker/picker because @react-native-community-picker This package has been deprecated. Can you please provide me a solution for this issue?

@gabrielhpugliese you are right. previously i was using native-base@2.13.14. now i install @react-native-picker/picker which resolved issue.

I saw nativebase importing from @react-native-picker/picker package.

native-base/src/basic/Picker.js

/* eslint-disable react/prefer-stateless-function */
/* eslint-disable react/prefer-es6-class */
import React, { Component } from 'react';
import createReactClass from 'create-react-class';
import { Picker } from '@react-native-picker/picker';
import { connectStyle } from 'native-base-shoutem-theme';

import mapPropsToStyleNames from '../utils/mapPropsToStyleNames';

export default class PickerNB extends Component {
  render() {
    return (
      <Picker ref={c => (this._root = c)} {...this.props}>
        {this.props.children}
      </Picker>
    );
  }
}

// eslint-disable-next-line react/no-multi-comp
PickerNB.Item = createReactClass({
  render() {
    return <Picker.Item {...this.props} />;
  }
});

PickerNB.propTypes = {
  ...Picker.propTypes
};

const StyledPickerNB = connectStyle(
  'NativeBase.PickerNB',
  {},
  mapPropsToStyleNames
)(PickerNB);

export { StyledPickerNB as PickerNB };

installing @react-native-picker/picker resolved the issue in my case

After install @react-native-picker/picker, we must build application again. ‘@’ packages must require building to implementation after install. This worked for me.

I could only solve it by downgrading native-base@2.13.14