Menu
how can I remove the name in the splash screen of my progressive web app?
The app name is already in the logo / icon. That's why I don't want to see the name in the bottom of the splash screen again.
example manifest.json:
{
"name": "HackerWeb",
"short_name": "HackerWeb",
"start_url": ".",
"display": "standalone",
"background_color": "#fff",
"description": "A simply readable Hacker News app.",
"icons": [{
"src": "images/touch/homescreen48.png",
"sizes": "48x48",
"type": "image/png"
}, {
"src": "images/touch/homescreen72.png",
"sizes": "72x72",
"type": "image/png"
}]
}
271
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.
By default, both Android and iOS show a plain white screen as the splash screen for web apps. It is always better to customize the splash screen to provide a complete app experience.
The default splash screen cannot be overridden with Dart/Flutter alone. They are controls shown by the native Android/iOS context while the Flutter runtime is initializing. As such, any splash screen widget you create inside Flutter will show after the default splash screen.
There is not a way to selectively display the app name on the splash screen. The recommended approach is to develop a logo that will work being displayed next to your application neame. Potentially you could try setting an empty string for the name but that could have unintended consequences including making browsers start ignoring the manifest altogether.
154
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
