Open MegazeroMZ opened 6 years ago
I'm not sure if there is a better way, but I did it by giving the <ModalDropdown>
a <View>
as a child.
<ModalDropdown options={options} onSelect={() => function()}>
<View style={styles.dropdown}>
<Text>Select</Text>
<Icon name={'expand-more'} iconStyle={{ marginRight: 5 }}/>
</View>
</ModalDropdown>
Of course you can then apply your own styles for the view then. For example:
const styles = StyleSheet.create({
dropdown: {
width: 80,
justifyContent: 'center',
flexDirection: 'row',
backgroundColor: 'white',
padding: 5,
margin: 10
}
});
And this is the result:
I guess it make sense to do it manually like that, I just wonder if the library have it by default or not lol. Oh well
How do I make the arrow show up at the end of the dropdown list button? I want to make it clear that this component is a dropdownlist and in both the example and when I try it out myself there's no arrow at the end of the button so it kinda look just like any other text input field or text field