umhan35 / react-native-search-bar

The high-quality iOS native search bar for react native.
MIT License
861 stars 207 forks source link

Remove underline on Android #165

Open dan-fein opened 4 years ago

dan-fein commented 4 years ago

Is it possible to remove the underline that appears on Android?

I see the native TextInput has a prop called underlineColorAndroid="transparent" but checking the TS file I don't see anything for this, any work arounds to achieve it?

Screenshot 2019-10-23 23 32 50
iRoachie commented 4 years ago

@alpha0010 How hard would it be to add this?

alpha0010 commented 4 years ago

Hmm. Surprisingly difficult unfortunately. This is implemented via a SearchView, not a TextInput. As such, in order to modify unexposed styles, one must parse the element for the appropriate base widget to modify. The "underline" is not (on most platforms) implemented as an actual underline. Automatically determining the underline would be hard to confidently implement for all targeted SDKs.

The only solid option I can think of would be re-implementing the entire widget (off of primitive components), which rather feels like it defeats the goal of being completely native.

RodolfoGS commented 4 years ago

Same issue

Noitidart commented 4 years ago

I'm thinking of use a view to overlap the underline to hide it.

Noitidart commented 4 years ago

Oh gosh my overlaid view covers hanging part of characters, that was silly of me.

alpha0010 commented 4 years ago

Did some searching around. You may be able to adapt this solution: https://stackoverflow.com/a/27687155

Also, grep for search_plate and mSearchPlate in the Android sdk source.

If you are trying your hand at this, be aware the hard part with react native style properties is to correctly (re)apply the native styles when the JS code does not explicitly set a value.

Ainias commented 2 years ago

Is there any update on this?

YogaSulistiyoWidodo commented 10 months ago

set query backround to transparant