Bug: Android 12

[jelllyam]

Not working with top notch. The status bar blank space still exist even I added in style Flex:1

[kadiraydinli]

Hi @jelllyam, can you share sample code and screenshot so I can better understand the problem?

[jelllyam]

This is the https://github.com/kadiraydinli/react-native-system-navigation-bar/tree/master/example that i'm using.

https://user-images.githubusercontent.com/11318868/233749903-373172c0-dbe5-429a-b6f1-42bea9a2f997.mp4

[kadiraydinli]

I think your phone has a notch. If so, I think the problem will be solved when you add the code below to /android/app/src/main/res/values/styles.xml and try again.

<item name="android:windowLayoutInDisplayCutoutMode">shortEdges</item>

After adding the code, the estimated image of the file will look like this.

<resources>
    <style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
        <item name="android:editTextBackground">@drawable/rn_edit_text_material</item>
        <item name="android:windowLayoutInDisplayCutoutMode">shortEdges</item>
    </style>
</resources>

Check out the link below for more information on this code; https://developer.android.com/develop/ui/views/layout/display-cutout

I recommend that you be careful when using this code. I am not sure if it will cause the content to shift out of the safe area on some screens. But I don't think there will be a problem if you use SafeAreaView on all the screens in your application.

[jelllyam]

I think your phone has a notch. If so, I think the problem will be solved when you add the code below to /android/app/src/main/res/values/styles.xml and try again.

<item name="android:windowLayoutInDisplayCutoutMode">shortEdges</item>

After adding the code, the estimated image of the file will look like this.

<resources>
    <style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
        <item name="android:editTextBackground">@drawable/rn_edit_text_material</item>
        <item name="android:windowLayoutInDisplayCutoutMode">shortEdges</item>
    </style>
</resources>

Check out the link below for more information on this code; https://developer.android.com/develop/ui/views/layout/display-cutout

I recommend that you be careful when using this code. I am not sure if it will cause the content to shift out of the safe area on some screens. But I don't think there will be a problem if you use SafeAreaView on all the screens in your application.

It's working but the problem is when I rotate to landscape, the side still has blank space.

[kadiraydinli]

@jelllyam I have released a new version that fixes this issue. Can you check again on the latest version?

[kadiraydinli]

I think your problem is solved. That's why I'm closing this issue. If your problem persists, feel free to reopen the issue.

[testkil]

@kadiraydinli I still have the issue :/ (red is just hidden) On latest RN version with the latest version of this lib. (using stickyimersive + added shortEdges)

adding fullscreen(true) kinda works as a hack to fix this but then the app doesn't react to the keyboard anymore.