Search code examples
javascriptandroidreact-nativeexpoeas

Why does a green status bar appears when I build with eas?

Why when I compile my app the status bar suddenly appear? When I'm testing it in the expo go app or in a android emulator you can't see the status bar but as soon as I build it with eas to an apk it appears and moves my whole app design down:

App screenshots

Here is my eas.json

{
  "cli": {
    "version": ">= 2.1.0"
  },
  "build": {
    "development": {
      "developmentClient": true,
      "distribution": "internal"
    },
    "preview": {
      "channel": "preview",
      "distribution": "internal",
      "android": {
        "buildType": "apk"
      }
    },
    "production": {
      "channel": "production"
    }
  },
  "submit": {
    "production": {}
  }
}

.

And here is my app.config.js

export default
{
  expo: {
    name: "Campus Market",
    description: "",
    slug: "cmkt",
    scheme: "campusmarket",
    owner: "***",
    version: "1.0.0",
    orientation: "portrait",
    icon: "./assets/icon.png",
    userInterfaceStyle: "light",
    backgroundColor: "#f2f2f2",
    primaryColor: "#72e292",
    splash: {
      image: "./assets/splash.png",
      resizeMode: "contain",
      backgroundColor: "#72e292"
    },
    updates: {
      fallbackToCacheTimeout: 0,
      url: "https://u.expo.dev/***",
    },
    runTimeVersion: {
      policy: "sdkVersion",
    },
    jsEngine: "hermes",
    assetBundlePatterns: [
      "**/*"
    ],
    ios: {
      supportsTablet: false,
      bundleIdentifier: "***",
    },
    android: {
      package: "***",
      adaptiveIcon: {
        foregroundImage: "./assets/adaptive-icon.png",
        backgroundColor: "#72e292"
      },
      permissions: [],
    },
    extra: {
      eas: {
        projectId: "***",
      }
    },
  }
}

How do i get rid of it? :(

I'm using expo sdk 46, expo-cli 6.0.5 and eas 2.0.1

Solution

  • The problem was related with react navigation, not with expo nor eas.

    I fixed it using the statusbar component from expo-status-bar in the screens:

    <StatusBar translucent backgroundColor="transparent" />