Menu
From MDN:
In Chrome 47 and later, a splash screen is displayed for a web application launched from a home screen. This splashscreen is auto-generated using properties in the web app manifest, specifically:
name,background_color, and the icon in theicons arraythat is closest to 128dpi for the device.
I'm wondering if its possible to use a full screen background image instead of the generated background?
233
So, if you want to set a custom PWA splash screen and icons, the only way out is to add special HTML tags. For splash screens, it is the <link rel=”apple-touch-startup-image” /> meta tag. For icons, you should add one more HTML meta tag – <link rel=”apple-touch-icon” />. That done, your iOS headache isn't over.
The most straightforward way to create a simple splash screen was to create a dedicated theme overriding android:windowBackground with a drawable containing branding colors or a bitmap of a logo. The theme was set as an attribute of the launcher activity in AndroidManifest. xml.
Splash screen is a screen that loads when you launch an app.
On the Microsoft 365 navigation bar, select the Settings icon, and then choose Default PWA site. In the Change default PWA site dialog box, type your preferred PWA site URL and select Change site.
You may want to check the documentation about Adding a Splash Screen for Installed Web Apps in Chrome 47.
If you want to ensure that an icon will always be displayed consider that 48dp is the minimum image size we will display, which if you take the maximum density display currently supported (4x) then 48 * 4 = 192px. This is lucky because we need to 192px image for Add to Homescreen to work! Yay. Therefore, I would recommend always having 192px as the minimum sized icon and create 3 other versions at 256px, 384px and 512px. However, if you want to ensure that the user is not downloading too much data for the splash screen, especially on a low density device then you can go lower and Chrome will try to fetch the most appropriate image.
It stated that the maximum density display currently supported is 4x of 48dp.
You can file a feature request for this.
182
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
