React-native-picker-select: placeholderTextColor not being set

[luizParreira]

Describe the bug
The placeholderTextColor is not being set whenever one wants to set a different placeholder text to the ones you want to display as values. Such as this:

To Reproduce

1. Create a Picker component
2. Change the placeholderTextColor
3. Change the default placeholder to be a different value than the one displayed on items

Expected behavior
The placeholder text color should change to red. However, because of this line: https://github.com/lawnstarter/react-native-picker-select/blob/master/src/index.js#L193 the color attribute is never set.

Screenshots

• Device: iOS Simulator
• OS: iOS 12
• react-native-picker-select version: 4.2.1
• react-native version: 0.55.4
• react version: 16.4.0

Reproduction and/or code sample
In order to reproduce the behaviour, just create the following component:

const placeholderTextColor = 'red';

const CustomPicker = () =>
  <Picker
    placeholderTextColor="red"
    placeholder={{label: 'Select an option', value: null}}
    doneText="Select"
    items={[{label: 'test 0', value: 0}, {label: 'test 1', value: 1}]}
    value={null}
    onValueChange={v => console.log(v)}
  />

[lfkwtz]

Maybe I'm not understanding the issue here.

See the first use of the component here: https://snack.expo.io/rk1XLLpjQ

I added a placeholderTextColor, the placeholder itself is different from the default, and it works as I'm expecting it to. Are you expecting something different?

[luizParreira]

@lfkwtz You are right. I was following the docs for version 5.0.0, but was using version 4.2.0, once I checked the releases, I notices that version 4.4.0 was when the placeholderTextColor got added. I updated the lib and it worked. My bad, sorry.

[lfkwtz]

All good. Glad it was an straightforward answer.

[Rajdeepc]

How to change placeholderTextColor in Android?

[NathanNovak]

@lfkwtz Changing the placeholderTextColor is still not working on iOS. Is there anything else that needs to be done since the info is not in the docs?

[lfkwtz]

look at the sample app

[noelq]

@NathanNovak I did this and it works :

<RNPickerSelect style={pickerStyle} ... />

const pickerStyle = {
    inputIOS: {
        color: 'white',
        paddingHorizontal: 10,
        backgroundColor: 'red',
        borderRadius: 5,
    },
    placeholder: {
        color: 'white',
      },
    inputAndroid: {
        color: 'white',
        paddingHorizontal: 10,
        backgroundColor: 'red',
        borderRadius: 5,
    },
};

[raouf-madani]

@NathanNovak I did this and it works :

<RNPickerSelect style={pickerStyle} ... />

const pickerStyle = {
    inputIOS: {
        color: 'white',
        paddingHorizontal: 10,
        backgroundColor: 'red',
        borderRadius: 5,
    },
    placeholder: {
        color: 'white',
      },
    inputAndroid: {
        color: 'white',
        paddingHorizontal: 10,
        backgroundColor: 'red',
        borderRadius: 5,
    },
};

The issue is still persisting.