# react-native-country-picker

> React Native Country Picker

Latest version **1.0.2** (published 2016-02-27) · MIT license · 0 weekly downloads

## Install

```sh
npm install react-native-country-picker
pnpm add react-native-country-picker
yarn add react-native-country-picker
bun add react-native-country-picker
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.2 |
| Published | 2016-02-27 |
| First published | 2016-02-27 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 10 |
| Maintainers | tofugear |
| Keywords | react-native, android, react-component, country-picker |

## Links

- npm: https://www.npmjs.com/package/react-native-country-picker
- Repository: https://github.com/tofugear/react-native-country-picker
- Homepage: https://github.com/tofugear/react-native-country-picker#readme
- Issues: https://github.com/tofugear/react-native-country-picker/issues
- npm.io page: https://npm.io/package/react-native-country-picker

## Alternatives

- [@sindresorhus/slugify](https://npm.io/package/@sindresorhus/slugify.md) — 3.7M weekly downloads
- [solid-js](https://npm.io/package/solid-js.md) — 2.7M weekly downloads
- [expo-glass-effect](https://npm.io/package/expo-glass-effect.md) — 2.5M weekly downloads
- [nanoassert](https://npm.io/package/nanoassert.md) — 780.8K weekly downloads
- [@ffmpeg/ffmpeg](https://npm.io/package/@ffmpeg/ffmpeg.md) — 529.5K weekly downloads

## Recent versions

- 1.0.2 (latest) — 2016-02-27

## README

# React Native Country Picker
A country picker for react-native support for android

## Installation
```sh
npm install react-native-country-picker --save
```

### Installation (Android)
```gradle
...
include ':react-native-country-picker'
project(':react-native-country-picker').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-country-picker/android')
```

* In `android/app/build.gradle`

```gradle
...
dependencies {
    ...
    compile project(':react-native-country-picker')
}
```

* register module (in MainActivity.java)

```java
import com.tofugear.countrypicker.*;  // <--- import

public class MainActivity extends Activity implements DefaultHardwareBackBtnHandler {
  ......
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    mReactRootView = new ReactRootView(this);

    mReactInstanceManager = ReactInstanceManager.builder()
      .setApplication(getApplication())
      .setBundleAssetName("index.android.bundle")
      .setJSMainModuleName("index.android")
      .addPackage(new MainReactPackage())
      .addPackage(new CountryPickerPackage())              // <------ add here
      .setUseDeveloperSupport(BuildConfig.DEBUG)
      .setInitialLifecycleState(LifecycleState.RESUMED)
      .build();

    mReactRootView.startReactApplication(mReactInstanceManager, "ExampleRN", null);

    setContentView(mReactRootView);
  }

  ......
}
```

### Screencasts
See [AndroidCountryPicker](https://github.com/roomorama/AndroidCountryPicker)

## Usage

### Example
```js
var React = require('react-native');
var {
    StyleSheet,
    View,
    Image
} = React;

var CountryPicker = require('react-native-country-picker');
var Button = require('react-native-simple-button');

module.exports = React.createClass({
    getInitialState() {
        return { code: null };
    },

    getSelectedCountry() {
        var _this = this;
        CountryPicker.show(function(country){
            _this.setState({ code: country.code });
        });
    },

    render() {
        return (
            <View style={styles.container}>
                <Text>{this.state.code}</Text>
                <Button onPress={this.getSelectedCountry.bind(this)}>
                    Launch Country Picker
                </Button>
            </View>
        );
    },
});


var styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'space-around',
        alignItems: 'center',
        backgroundColor: 'transparent',
        paddingVertical:150,
    }
});
```

### thanks
* Thanks to [roomorama](https://github.com/roomorama) for the [AndroidCountryPicker](https://github.com/roomorama/AndroidCountryPicker) Java Fragment code.

---
_Source: https://npm.io/package/react-native-country-picker · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._