'Input not clickable native base, image on top

I am using Input from native base with expo app.

I have an input button to select a date via datetimepicker react native library. Upon pressing the input button or as soon as it gains focus , I see the calendar pulled up and can do the required task of selecting date.

However, when I add a icon to display on top of the input element, the input element is clickable only 1 out of 10 times.

Here is my DOM code:

<Input ref={t} value={date.getDate()+"/"+(date.getMonth()+1)+"/"+date.getFullYear()} onChange={onChange}}/> 
 <AntDesign name="calendar" size={22} onPress={t.focus}/>)}

I tried setting focus explicitly with .focus on icon press but that does not work either.

Secondly, I tried using InputGroup from native base. That does not allow any styling to work and displays very tiny width input.

I want to display input with icon embedded inside the input to the right.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source