You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
47 lines
1.3 KiB
47 lines
1.3 KiB
3 years ago
|
import React from 'react';
|
||
|
|
import {Image, Dimensions} from 'react-native';
|
||
|
|
import SelectDropdown from 'react-native-select-dropdown';
|
||
|
|
import dropdownIcon from '../assets/icons/dropdown.png';
|
||
|
|
import tw from 'tailwind-react-native-classnames';
|
||
|
|
|
||
|
|
function Select({iconPosition, options, onChange, value, width, defaultValue}) {
|
||
|
|
return (
|
||
|
|
<SelectDropdown
|
||
|
|
data={options}
|
||
|
|
buttonStyle={{
|
||
|
|
width: width,
|
||
|
|
borderWidth: 1,
|
||
|
|
borderColor: '#DBDBDB',
|
||
|
|
borderRadius: 6,
|
||
|
|
height: 36,
|
||
|
|
backgroundColor: '#F9F9F9',
|
||
|
|
}}
|
||
|
|
rowTextStyle={{fontSize: Dimensions.get('window').width / 30}}
|
||
|
|
defaultButtonText={defaultValue}
|
||
|
|
statusBarTranslucent={true}
|
||
|
|
buttonTextStyle={{
|
||
|
|
textAlign: 'center',
|
||
|
|
justifyContent: 'flex-end',
|
||
|
|
flex: 0,
|
||
|
|
fontSize: Dimensions.get('window').width / 30,
|
||
|
|
color: '#707070',
|
||
|
|
// display: 'inline'
|
||
|
|
}}
|
||
|
|
dropdownIconPosition={iconPosition}
|
||
|
|
onSelect={selectedItem => {
|
||
|
|
onChange(selectedItem);
|
||
|
|
}}
|
||
|
|
renderDropdownIcon={() => (
|
||
|
|
<Image source={dropdownIcon} style={{width: 12, height: 8}} />
|
||
|
|
)}
|
||
|
|
/>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
export default Select;
|
||
|
|
|
||
|
|
Select.defaultProps = {
|
||
|
|
options: ['1', '2', '3'],
|
||
|
|
iconPosition: 'left',
|
||
|
|
};
|