React-native-picker-select: Android: Not working with Parent View {flexDirection:'row'}

Created on 4 Nov 2019 · 1Comment · Source: lawnstarter/react-native-picker-select

YOU MUST FILL OUT EVERY SECTION. INCOMPLETE BUG REPORTS WILL BE CLOSED.

Describe the bug

I want to use with in a single row. So, when I make the Parent flexDirection: row, I see only the arrow and no text. Even if I remove the I don't see any text.

To Reproduce

Steps to reproduce the behavior:

Below is the code to reproduce this on Android

import React, { Component } from 'react';
import {
    StyleSheet,
   View,
} from 'react-native';
import RNPickerSelect from 'react-native-picker-select';

type Props = {}

const countryCode = [
{
label: '+91',
value: '+91',
},
{
 label: '+1',
 value: '+1',
}
];

export default class PickerTest extends Component<Props> {

    constructor() {
  super()
  this.state = {
      phoneNumber: "",
      countryCode: ""
   }
   }

render() {
return (
    <View style={{flexDirection:'row'}}>
        <View paddingVertical={5}>
        {/* and hiding the InputAccessoryView on iOS */}
        <RNPickerSelect
        placeholder={{}}
        items={countryCode}
        style={pickerSelectStyles}
        onValueChange={value => {
          this.setState({
            countryCode: value,
          });
        }}
        InputAccessoryView={() => null}
        style={pickerSelectStyles}
        value={this.state.countryCode}
        />
        </View>
    </View>
 );
}
}

const pickerSelectStyles = StyleSheet.create({
inputIOS: {
fontSize: 16,
paddingVertical: 12,
paddingHorizontal: 10,
borderWidth: 1,
borderColor: 'gray',
borderRadius: 4,
color: 'black',
paddingRight: 30, // to ensure the text is never behind the icon
},
inputAndroid: {
fontSize: 16,
paddingHorizontal: 10,
paddingVertical: 8,
borderWidth: 0.5,
borderColor: 'purple',
borderRadius: 8,
color: 'black',
paddingRight: 30, // to ensure the text is never behind the icon
},
});

Expected behavior

I want the text to be seen when I change flexDirection to 'row'

Screenshots