Android standalone app uses wrong size app icon (2)

We are experiencing an issue with the standalone app icon on Android. There are other posts on this forum from folks who have had the identical issue, however these are now closed with no resolution that I can see. I’m sure there is a simple workaround to this issue that perhaps I’m overlooking.

The issue can be seen from the image below. The icon appears to have been incorrectly resized such that it has been cropped.

The icon itself is a 700x700 PNG with a transparent background. The adaptiveIcon configuration for Android can be seen below.

app.json

{
  "expo": {
    "name": <SNIPPED>
    "slug": <SNIPPED>
    "sdkVersion": "32.0.0",
    "icon": "./app/assets/app-icons/app-icon.png",
    "orientation": "portrait",
    "loading": {
      "icon": "./app/assets/app-icons/icon_rounded.png"
    },
    "version": "0.0.3",
    "entryPoint": "./app/app.js",
    "ios": {
      "bundleIdentifier": <SNIPPED>
      "buildNumber": "0.0.3",
      "supportsTablet": true,
      }
    },
    "android": {
      "package": <SNIPPED>
      "googleServicesFile": "./google-services.json",
      "versionCode": 18,
      "adaptiveIcon": {
        "backgroundColor": "#ffffff",
        "foregroundImage": "./app/assets/app-icons/app-icon-android.png"
      },

Everything is fine on iOS.

Build using expo build:android on Expo SDK v32.0.0

Hi @eddyoc, not sure if the is definitely the cause, but in the docs:

We recommend that you use a 1024x1024 png file,
leaving at least the outer 1/6 transparent on each side.
If specified, this overrides the top-level “icon” and the “android.icon” keys.
This icon will appear on the home screen.

Thanks for your reply. Changed the icon to 1024x1024 png as per suggestion. Interestingly it did make a (slight) difference with the truncation occurring a little bit further out.

However alas, we still have the same issue of the truncated icon

new-ply-icon-truncd
Android OS 8 (Oreo) exhibits icon truncation

This is occurring on an Android 8 device. I should have mentioned on the original post that on our Android 7 test device the icon is appearing perfectly with no truncation exhibited.

android-7-icon-ok
Android OS 7 (Nougat) appears ok

Hey @eddyoc,

The icon looks fine on an Android 7 device because adaptive icons are supported starting in Android 8 (https://developer.android.com/guide/practices/ui_guidelines/icon_design_adaptive).
My guess is the icon doesn’t look fine on Android 8, because you didn’t leave enough transparent space on each side of the icon, I’m quoting the same excerpt from the docs again:

We recommend that you use a 1024x1024 png file,
leaving at least the outer 1/6 transparent on each side.

1 Like

Following the suggestion I performed the following steps

  1. Reduced the icon down to 2/3s of 1024px
  2. Pasted it dead centre into a transparent 1024px square and exported as png

This indeed fixed the issues on Android 8/9 using adaptive icons. My concern was always that doing so would result in an icon with massive padding on Android 7 and below, however infact these icons are also adapting correctly.

This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.