APK icon off and not transparent background about cloudapk HOT 10 CLOSED

Thanks a lot @jgw96 and @andreban for your time on both two issues I submitted, really cool and appreciated 👍

from cloudapk.

I have also make some enhancement on our side to be "maskable" compatible and the result is really cool!

Thank you @jgw96 for the fix 👍

from cloudapk.

No problem at all, the icon is looking really good!

from cloudapk.

Hello peterpeterparker, thank you for opening an issue with us!

I have automatically added a "needs triage" label to help get things started. Our team will investigate the issue and help solve it ASAP. Other community members may also look into the issue and provide feedback 🙌

from cloudapk.

Hello peterpeterparker, thank you for opening an issue with us!

I have automatically added a "needs triage" label to help get things started. Our team will investigate the issue and help solve it ASAP. Other community members may also look into the issue and provide feedback 🙌

from cloudapk.

Hmm we are not doing anything special with icons so this might be an issue in bubblewrap itself. @andreban are you aware of any issues like this?

from cloudapk.

The problem is that CloudAPK is setting maskableIconUrl, but the icon is not maskable. Maskable icons need some gaps from their borders, More info on maskable icons here: https://web.dev/maskable-icon/ and Android specifics here: https://developer.android.com/guide/practices/ui_guidelines/icon_design_adaptive

Here's what the payload passed to generateSignedApkZip looks like:

{
    "packageId": "com.deckdeckgo.twa",
    "host": "deckdeckgo.com",
    "name": "DeckDeckGo",
    "themeColor": "#ffffff",
    "navigationColor": "#ffffff",
    "backgroundColor": "#ffffff",
    "startUrl": "/",
    "iconUrl": "https://deckdeckgo.com/assets/favicon/android-chrome-192x192.png",
    "maskableIconUrl": "https://deckdeckgo.com/assets/favicon/android-chrome-192x192.png",
    "appVersion": "1.0.0",
    "useBrowserOnChromeOS": true,
    "splashScreenFadeOutDuration": 300,
    "enableNotifications": false,
    "shortcuts": [],
    "signingInfo": {
        "fullName": "John Doe",
        "organization": "Contoso",
        "organizationalUnit": "Engineering Department",
        "countryCode": "US"
    }
}

But there's no maskable icon in the Web Manifest at https://deckdeckgo.com/manifest.json:

{
  "name": "DeckDeckGo",
  "short_name": "DeckDeckGo",
  "display": "standalone",
  "theme_color": "#ffffff",
  "background_color": "#ffffff",
  "scope": "/",
  "start_url": "/",
  "orientation": "portrait",
  "icons": [
    {
      "src": "/assets/favicon/android-chrome-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "/assets/favicon/android-chrome-512x512.png",
      "sizes": "512x512",
      "type": "image/png"
    }
  ]
}

So, the solution is to only set maskableIconUrl if there's a maskable icon in the Web Manifest.

from cloudapk.

Thanks again @andreban ! @peterpeterparker ill get this fixed up (:

from cloudapk.

Fixed pwa-builder/PWABuilder@59d6c89 . @peterpeterparker I am going to deploy this fix and the fix for #19 , let me know if you run into any other issues! Also, thanks @andreban for the help!

from cloudapk.

Fixes deployed, Thanks again @peterpeterparker (:

from cloudapk.