react-native-safe-area-context icon indicating copy to clipboard operation
react-native-safe-area-context copied to clipboard

useSafeAreaInsets returns all insets value 0 on devices with notch using immersive mode

Open mauryaak15 opened this issue 4 years ago • 0 comments

Aim

I want my app to be full screen, no statusbar, no navigation bar, in case of single and double cutout (notches), I want to give padding having suitable background color

Current code in use for full screen immersive mode

private static final int UI_FLAG_IMMERSIVE = View.SYSTEM_UI_FLAG_LAYOUT_STABLE
            | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
            | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
            | View.SYSTEM_UI_FLAG_HIDE_NAVIGATION // hide nav bar
            | View.SYSTEM_UI_FLAG_FULLSCREEN // hide status bar
            | View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY;

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT && Build.VERSION.SDK_INT < 30) {
  hideSystemUI();
  getWindow().setFlags(WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS, WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS)
} else if (Build.VERSION.SDK_INT >= 30) {
  WindowCompat.setDecorFitsSystemWindows(getWindow(), false);
  WindowInsetsControllerCompat controller = WindowCompat.getInsetsController(getWindow(), getWindow().getDecorView());
  if (controller != null) {
      controller.hide(WindowInsetsCompat.Type.statusBars() | WindowInsetsCompat.Type.navigationBars());
      controller.setSystemBarsBehavior(WindowInsetsControllerCompat.BEHAVIOR_SHOW_TRANSIENT_BARS_BY_SWIPE);
  }
}

private void hideSystemUI() {
  View decorView = getWindow().getDecorView();
  decorView.setSystemUiVisibility(UI_FLAG_IMMERSIVE);
}


<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- Customize your theme here. -->
    <item name="android:textColor">#000000</item>
    <item name="android:windowDisablePreview">true</item>
    <item name="android:navigationBarColor">
        @android:color/transparent
    </item>
    <!-- change status bar color -->
    <item name="android:statusBarColor">
        @android:color/transparent
    </item>
    <item name="android:windowLayoutInDisplayCutoutMode">
        shortEdges <!-- default, shortEdges, never -->
    </item>
</style>
<style name="SplashScreenTheme" parent="SplashScreen_SplashTheme">
    <item name="colorPrimaryDark">@color/status_bar_color</item>
</style>
</resources>

Problem

I want get the inset of cutout area in android and when I am using const insets = useSafeAreaInsets(); it is returning all zero values.

Expected

PixelUtil.toDIPFromPixel(getWindow().getDecorView().getRootView().getDisplay().getCutout().getSafeInsetTop()) this code is returning correct value for all edges

mauryaak15 avatar Jun 21 '21 21:06 mauryaak15