I have created SearchableDropdown where you can select and find(via text search) specific item from dropdown.On iOS is working perfectly alright, but when I tested on Android I am getting problem to select item from SearchableDropdown.That is because when I click on SearchableDropdown it focuses it and show the items but, on android whenever I try to click anywhere except the keyboard it automatically dismiss focus from SearchableDropdown and the items are hidden (because they are shown when the field is on focus).So I am not able to select the item.Is there some value or property which I can add to disable that behaviour
This is my code:
const [selectedItemNames, setSelectedItemNames] = useState('');
// Value of how much fields should be created
const [selectTags, setSelectTags] = useState([]);
const handleItemNameSelect = (index, value) => {
console.log(value);
const newSelectTags = [...selectTags];
newSelectTags[index].itemName = value;
setSelectTags(newSelectTags);
const newSelectedItemNames = [...selectedExerciseNames];
newSelectedItemNames[index] = value;
setSelectedItemNames(newSelectedItemNames);
setSelectedDropdownIndex(index);
itemHistory(newSelectedItemNames, index);
};
const handleItemNameChange = (index, value) => {
console.log("handleItemNameChange - value:", value);
const newSelectTags = [...selectTags];
newSelectTags[index] = {
...newSelectTags[index],
itemName: value,
};
setSelectTags(newSelectTags);
};
<SearchableDropdown
onTextChange={(text) => handleItemNameChange(index, text)}
onItemSelect={(item) => handleItemNameSelect(index, item.name)}
textInputStyle={{ color: '#fff', fontSize: dynamicFontSize(4),}}
itemTextStyle={{ color: '#fff', fontSize: dynamicFontSize(4), paddingTop: 10 }}
items={exerciseData} // dropdown items from itemData.js file
textInputProps={{
placeholder: "Select An Example",
placeholderTextColor: "grey",
underlineColorAndroid: "transparent",
style: {
padding: 12,
fontSize:dynamicFontSize(4),
borderWidth: 1,
borderColor: '#ccc',
borderRadius: 5,
color: '#fff',
marginBottom: dynamicFontSize(5),
backgroundColor: 'transparent',
},
value: selectedItemNames[index],
}}
resetValue={false}
selectedItem={selectedItemNames[index]}
/>