search

AdelRedaa97 / react-native-select-dropdown

react-native-select-dropdown is a highly customized dropdown | select | picker | menu for react native that works for andriod and iOS platforms.
MIT License
324 stars 140 forks source link

Android Dropdown gap #52

Closed jorge-o-murillo closed 2 years ago

jorge-o-murillo commented 2 years ago

Hi @AdelRedaa97, thanks for this great repo.

I have an issue on Android where the Dropdown displays a gap between the button and the dropdown items. I copy/pasted the exact code provided in the demo1.js file on a reproducible snack: link

Screen Shot 2022-04-12 at 1 01 00 PM

iOS does not have this issue. Any help on this? Thanks.

AdelRedaa97 commented 2 years ago

It's about android's StatusBar try to use this prop in Dropdown <SelectDropdown statusBarTranslucent={true} https://github.com/AdelRedaa97/react-native-select-dropdown#statusBarTranslucent

or make <StatusBar translucent={false} />

jorge-o-murillo commented 2 years ago

Thanks, adding <StatusBar translucent={false} /> worked.

AdelRedaa97 commented 2 years ago

You can add this prop statusBarTranslucent={true} in will work too if you want to make android's StatusBar translucent is true

jorge-o-murillo commented 2 years ago

Hi there @AdelRedaa97, unfortunately on Android devices with a top notch the statusBarTranslucent={true} doesn't work properly. For example, if you try running this same code on a Samsung S10+ (link), it will turn out like this:

Screen Shot 2022-04-26 at 6 05 07 PM

Any Android device with a top notch has this issue (Pixel 4A, Samsung S10+, etc.). May be related to previous RN bugs: link

LuizHGodoy commented 2 years ago

already try use SafeAreaView? works fine for me here with statusBarTranslucent={true} inside the SafeAreaView