Is there any way to style individual Picker.Items? Other than the text color?
Also, somewhat related, What props will a Picker.Item take? I know they'll take "key", "value", "label" and "color". But are there any others?
I'm trying to style one of the Picker.Item's in my Picker component a different way than the rest of the Picker.Items in that Picker.
Specifically I'm trying to modify the fontWeight, but I haven't been able to change any of the styling except for the color of the text with that color property.
I know you can use itemStyle as a prop for the Picker component to style all of the items, but what if you want one of them to look a little different than the others? Is there a way to do that?
<Picker
style={{height: 130, width: 130}}
selectedValue={this.state.day}
itemStyle={{height: 130, fontFamily: 'Rubik-Regular'}}
onValueChange={(itemValue, itemIndex) => this.setState({day: itemValue})}
>
<Picker.Item label="Day" value={-1} color='red'/>
{ validDays.map((i) => ( <Picker.Item key={i} label={i.toString()} value={i} /> )) }
</Picker>
Trying to change what that first Picker.Item (label="Day") looks like. I tried messing with style prop with no success:
<Picker.Item label="Day" value={-1} style={{ color: 'red'}}/>
Also tried messing with giving label a Text component like this:
<Picker.Item label={(<Text>Hello</Text>)} value={-1}/>
That wouldn't render at all. Threw an error.
Also tried:
<Picker.Item label="" value={-1} color='red'><Text>Hello</Text></Picker.Item>
The only props that you can use for the Picker.Item
are mentioned here in Picker.ios.js and PickerAndroid.android.js
static propTypes = {
value: PropTypes.any, // string or integer basically
label: PropTypes.string,
color: PropTypes.string,
};
Therefore you cannot supply any other values to it.