Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix Android navigation mode detection #6053

Merged
merged 5 commits into from
Aug 30, 2024
Merged
Show file tree
Hide file tree
Changes from 4 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions android/app/src/main/java/me/rainbow/MainApplication.kt
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ import me.rainbow.NativeModules.RNStartTime.RNStartTimePackage
import me.rainbow.NativeModules.RNTextAnimatorPackage.RNTextAnimatorPackage
import me.rainbow.NativeModules.RNZoomableButton.RNZoomableButtonPackage
import me.rainbow.NativeModules.SystemNavigationBar.SystemNavigationBarPackage
import me.rainbow.NativeModules.NavbarHeight.NavbarHeightPackage

class MainApplication : Application(), ReactApplication {
override val reactNativeHost: ReactNativeHost = object : DefaultReactNativeHost(this) {
Expand All @@ -41,6 +42,7 @@ class MainApplication : Application(), ReactApplication {
packages.add(KeychainPackage(KeychainModuleBuilder().withoutWarmUp()))
packages.add(RNStartTimePackage(START_MARK))
packages.add(RNHapticsPackage())
packages.add(NavbarHeightPackage())
return packages
}

Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,91 @@
package me.rainbow.NativeModules.NavbarHeight;

import androidx.annotation.NonNull;

import com.facebook.react.bridge.Promise;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.bridge.ReactContextBaseJavaModule;
import com.facebook.react.bridge.ReactMethod;
import com.facebook.react.module.annotations.ReactModule;
import android.graphics.Point;
import android.view.WindowManager;
import android.view.Display;
import java.lang.IllegalAccessException;
import java.lang.reflect.InvocationTargetException;
import java.lang.NoSuchMethodException;
import android.view.WindowInsets;
import android.os.Build;
import android.content.Context;

@ReactModule(name = NavbarHeightModule.NAME)
public class NavbarHeightModule extends ReactContextBaseJavaModule {
public static final String NAME = "NavbarHeight";

public NavbarHeightModule(ReactApplicationContext reactContext) {
super(reactContext);
}

@Override
@NonNull
public String getName() {
return NAME;
}

// Example method
// See https://reactnative.dev/docs/native-modules-android
@ReactMethod
public double getNavigationBarHeightSync() {
Context context = getReactApplicationContext();
WindowManager windowManager = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
if (Build.VERSION.SDK_INT >= 30) {
return windowManager
.getCurrentWindowMetrics()
.getWindowInsets()
.getInsets(WindowInsets.Type.navigationBars())
.bottom;
} else {
Point appUsableSize = getAppUsableScreenSize(context);
Point realScreenSize = getRealScreenSize(context);

// navigation bar on the side
if (appUsableSize.x < realScreenSize.x) {
return appUsableSize.y;
}

// navigation bar at the bottom
if (appUsableSize.y < realScreenSize.y) {
return realScreenSize.y - appUsableSize.y;
}

// navigation bar is not present
return 0;
}
}
public Point getAppUsableScreenSize(Context context) {
WindowManager windowManager = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
Display display = windowManager.getDefaultDisplay();
Point size = new Point();
display.getSize(size);
return size;
}
public Point getRealScreenSize(Context context) {
WindowManager windowManager = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
Display display = windowManager.getDefaultDisplay();
Point size = new Point();

if (Build.VERSION.SDK_INT >= 17) {
display.getRealSize(size);
} else if (Build.VERSION.SDK_INT >= 14) {
try {
size.x = (Integer) Display.class.getMethod("getRawWidth").invoke(display);
size.y = (Integer) Display.class.getMethod("getRawHeight").invoke(display);
} catch (IllegalAccessException e) {} catch (InvocationTargetException e) {} catch (NoSuchMethodException e) {}
}

return size;
}
@ReactMethod(isBlockingSynchronousMethod = true)
public double getNavigationBarHeight() {
return getNavigationBarHeightSync();
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
package me.rainbow.NativeModules.NavbarHeight;

import androidx.annotation.NonNull;

import com.facebook.react.ReactPackage;
import com.facebook.react.bridge.NativeModule;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.uimanager.ViewManager;

import java.util.ArrayList;
import java.util.Collections;
import java.util.List;

public class NavbarHeightPackage implements ReactPackage {
@NonNull
@Override
public List<NativeModule> createNativeModules(@NonNull ReactApplicationContext reactContext) {
List<NativeModule> modules = new ArrayList<>();
modules.add(new NavbarHeightModule(reactContext));
return modules;
}

@NonNull
@Override
public List<ViewManager> createViewManagers(@NonNull ReactApplicationContext reactContext) {
return Collections.emptyList();
}
}
4 changes: 2 additions & 2 deletions src/components/DappBrowser/Dimensions.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,11 @@ import { IS_ANDROID, IS_IOS } from '@/env';
import { TAB_BAR_HEIGHT } from '@/navigation/SwipeNavigator';
import { deviceUtils, safeAreaInsetValues } from '@/utils';
import { StatusBar } from 'react-native';
import { isUsingButtonNavigation } from '@/helpers/statusBarHelper';
import { NAVIGATION_BAR_HEIGHT } from '@/utils/deviceUtils';

export const BOTTOM_BAR_HEIGHT = 88;
export const TOP_INSET = IS_IOS ? safeAreaInsetValues.top : StatusBar.currentHeight ?? 40;
export const BOTTOM_INSET = IS_ANDROID ? (isUsingButtonNavigation() ? 32 : 12) : BOTTOM_BAR_HEIGHT;
export const BOTTOM_INSET = IS_ANDROID ? NAVIGATION_BAR_HEIGHT - 8 : BOTTOM_BAR_HEIGHT;
export const WEBVIEW_HEIGHT = deviceUtils.dimensions.height - TOP_INSET - TAB_BAR_HEIGHT - BOTTOM_INSET;
export const COLLAPSED_WEBVIEW_ASPECT_RATIO = 4 / 3;
export const COLLAPSED_WEBVIEW_HEIGHT_UNSCALED = Math.min(WEBVIEW_HEIGHT, deviceUtils.dimensions.width * COLLAPSED_WEBVIEW_ASPECT_RATIO);
Expand Down
2 changes: 1 addition & 1 deletion src/handlers/localstorage/theme.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import { IS_ANDROID } from '@/env';
import { getGlobal, saveGlobal } from './common';
import { NativeModules } from 'react-native';
import { colors } from '@/styles';
import { isUsingButtonNavigation } from '@/helpers/statusBarHelper';
import { isUsingButtonNavigation } from '@/utils/deviceUtils';
import { Themes, ThemesType } from '@/theme';

const { NavigationBar } = NativeModules;
Expand Down
5 changes: 0 additions & 5 deletions src/helpers/statusBarHelper.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import { ColorValue, StatusBar, StatusBarAnimation } from 'react-native';
import { getSoftMenuBarHeight } from 'react-native-extra-dimensions-android';

export const setTranslucent = (translucent: boolean): void => {
StatusBar.setTranslucent(translucent);
Expand Down Expand Up @@ -30,7 +29,3 @@ export const setDarkContent = (isAnimated = true) => {
barStyle: 'dark-content',
});
};

export const isUsingButtonNavigation = () => {
return getSoftMenuBarHeight() > 95;
};
4 changes: 2 additions & 2 deletions src/navigation/SwipeNavigator.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { TestnetToast } from '@/components/toasts';
import { DAPP_BROWSER, POINTS, useExperimentalFlag } from '@/config';
import { Box, Columns, globalColors, Stack, useForegroundColor, Text, Cover, useColorMode } from '@/design-system';
import { IS_ANDROID, IS_IOS, IS_TEST } from '@/env';
import { isUsingButtonNavigation } from '@/helpers/statusBarHelper';
import { isUsingButtonNavigation } from '@/utils/deviceUtils';
import { useAccountAccentColor, useAccountSettings, useCoinListEdited, useDimensions, usePendingTransactions } from '@/hooks';
import { useRemoteConfig } from '@/model/remoteConfig';
import RecyclerListViewScrollToTopProvider, {
Expand Down Expand Up @@ -51,7 +51,7 @@ function getTabBarHeight() {
return 82;
}
if (!isUsingButtonNavigation()) {
return 72;
return 82;
}
return 48;
}
Expand Down
13 changes: 10 additions & 3 deletions src/utils/deviceUtils.ts
Original file line number Diff line number Diff line change
@@ -1,8 +1,10 @@
import { Dimensions, PixelRatio, Platform } from 'react-native';
import { Dimensions, PixelRatio, Platform, NativeModules } from 'react-native';
const { NavbarHeight } = NativeModules;

import { IS_IOS } from '@/env';
import { IS_ANDROID, IS_IOS } from '@/env';

const { height, width } = Dimensions.get('window');
const scale = Dimensions.get('screen').scale;

const deviceUtils = (function () {
const iPhone15ProHeight = 852,
Expand Down Expand Up @@ -39,5 +41,10 @@ const deviceUtils = (function () {
export const DEVICE_WIDTH = deviceUtils.dimensions.width;
export const DEVICE_HEIGHT = deviceUtils.dimensions.height;
export const PIXEL_RATIO = PixelRatio.get();

export const NAVIGATION_BAR_HEIGHT = NavbarHeight.getNavigationBarHeight() / scale;
export default deviceUtils;

export const isUsingButtonNavigation = () => {
if (!IS_ANDROID) return false;
return NAVIGATION_BAR_HEIGHT > 40;
};
Loading