Problems with App Icon

MIT App Inventor Help
35

And I'm not sure what exactly your statement means.

36

Hello all
Can you please test if the artefacts persist with this APK?

Thanks

1 Like
37

Pixel 2XL (Android 11):

grafik
grafik1909×810 52.8 KB

Great!

1 Like
38

Ok, the launcher icon is 512x512px and has a black background. The actual picture is only 360x360px and is exactly in the middle.

39

Awesome!

Based on my experiments with the system, I see three plausible solutions to the problem

  1. Use the solution I've shared above. The user's app icon is set as the adaptive icon's background layer.
    Pros: No white patches along the edges
    Cons: The wiggle/parallax/spring motion that comes with adaptive icons is lost; the icon is stationary.

  2. Set the background layer of the icon from #FFFFFF (white) to #00FFFFFF (transparent). This will get rid of the artefacts while retaining the parallax motion.
    Pros: Motion is retained
    Cons: Motion is applied to the entire icon (this is not an issue introduced by this solution, rather a limitation of the system currently implemented in App Inventor). It is not possible to have, say in the other two icons @Anke shared above , the "k" ligature maintain motion while the background art stay stationary.

  3. Add a new property called AppIconBackground. This will let the user set a special background for their app's icon that will remain stationary. The AppIcon property will retain its parallax. If the AppIconBackground image property is not set, the system can default to a solid background colour (either white, transparent, or the app's primary colour property; I'm unsure which one is best suited here)
    Pros: Provides granular control over what part of the icon should move and what shouldn't.
    Cons: The user will have to take care to make the AppIcon image transparent. For example, the AppIcon and AppIconBackground properties will have to be

    companion_icon
    companion_icon512×512 1.74 KB

    image
    image798×312 7.38 KB

Note that they are of the same dimensions.

It's a single image of size 512x512

test_logo
test_logo512×512 29.2 KB

1 Like
40

Dark mode off:

grafik
grafik401×1081 32 KB

1 Like
41

Yeah, I just wanted to point it out.

grafik
grafik515×630 65.5 KB

1 Like
42

Lots of effort for a few tiny artifacts. :wink:

1 Like
43

I personally like this solution the most as it's the closest we'll get to the implementation Android requires us to have. It'd be great to have some insight from the team

2 Likes
44

Yes! Option 3 you have given is exactly what I've been looking for in AI and closest to the proper Android spec for icons moving forward! I would love to have another property for the background and foreground icon images or be able to set to a solid background so the foreground icon could be transparent.

1 Like
45

What does this all mean to/for mere mortals who just want to upload an image for their app icon?

1 Like
46

Now that I think about this, it might be better to have the new property be called AppIconForeground. AppIcon, the currently provided property, will serve as the background layer of the icon. This layer will be stationary, as most users would expect it to be.

If the user sets the optional AppIconForeground property, the system can render it as the sliding/parallax foreground layer of the adaptive icon.

This way, only those users who wish to leverage the full feature-set of adaptive icons will have to deal with the AppIconForeground property and ensuring transparency in the foreground layer.

@TIMAI2 to answer your question, if we are to go with updated solution #3, nothing will change for you as an AI user. The issue with the white areas will be fixed and your icon will be sans motion, as one would expect. If you wish to add a foreground layer to your icon that has parallax animations, you will be able to set the AppIconForeground property to an image of your choosing.

1 Like
47

I've created an issue here:


Thanks @Anke for the images. I hope you don't mind that I used them in the issue.

@ewpatton what are your thoughts on the ideal way to fix the bug (I've attached three possible fixes in the issue). I'll see if I can find some time to work on this during the weekend.

3 Likes
48

Thanks @vishwas, I'll take a look.

3 Likes
49

What was the outcome? Once the adaptive icon set is produced, can the 512 x 512 (or 1024 x 1024 or 576 x 576) icon be deleted by the Build Server to avoid bloating of the APK/AAB?

50

Unless someone is embedding the icon as a Bitmap, the icon actually adds very little extra size to the app. Uncompressed, a 1024x1024 icon (which is needed for the Apple App Store, btw) is 4 MB. The 1024x1024 icon we use for the iOS companion app, stored as a PNG, is only 87 KB. Unfortunately, for older versions of Android we still need to leave the non-adaptive icons in so that they can be used. The AAB format for publishing in the Play Store mitigates this since Google can build variations of the APK for newer Android that drop the unnecessary resources (however, the AAB still needs to contain every possible version).

51

... does the Build now avoid the artefacts (discussed here) automatically or is there a specific icon size that should be defined for best results?

52

Unfortunately, I don't think we ever came up with a solution for the edge artifacts...

2 Likes
53

Indeed - and there are truly more important problems to solve.

2 Likes
54

How do I add this new property?