Expo Android Adaptive Icon Not Appearing

Question

I am using Expo with my React Native application and have reached the point of building the app and deploying it on the Play Store. However, I am having an issue with setting Android Adaptive Icon (foreground/background) fields in the app.json file. I followed the Expo documentation https://docs.expo.io/guides/app-icons/ however the app icon is just surrounded by a white circle.

{
  "name": "ChowTime",
  "displayName": "ChowTime",
  "expo": {
    "name": "ChowTime",
    "slug": "ChowTime",
    "version": "3.0.0",
    "icon":"./assets/icon.png",
    "android": {
      "package": "com.yourcompany.chowtime",
      "versionCode": 2,
      "icon": "./assets/icon.png",
      "adaptiveIcon": { 
        "foregroundImage": "./assets/icon.png",
        "backgroundColor": "#000000" 
      }
    },
    "splash": {
      "image": "./assets/splashScreen.png",
      "resizeMode": "cover"
    },
    "platforms": ["ios", "android", "web"],
    "assetBundlePatterns": ["**/*"]
  }
}

This is an image of the icon, it seems to ignore android.adaptiveIcon settings and reflects the expo.icon image

Answer 1

You may need to clean out the watchman, metro and expo caches before re-building. Cleaning out node_modules is probably unnecessary here but no harm in cleaning the whole house!

If using yarn:

watchman watch-del-all
rm -rf /tmp/metro-*
rm -rf node_modules/ && yarn && expo r -c

or for npm:

watchman watch-del-all
rm -rf /tmp/metro-*
rm -rf node_modules/ && npm i && expo r -c

UPDATE:

It seems like some platform specific app.json settings are overwritten by the Expo dev environment. Try using expo build:android -t apk (https://docs.expo.io/distribution/building-standalone-apps/#if-you-choose-to-build-for-android) and see if the new build has the intended icon!