PWA - 设置 Android 设备的启动屏幕

问题描述 投票:0回答:3

我有一个响应式网站,我想将其用作渐进式网络应用程序。我已经初始化了基本的东西,比如设置图标、应用程序名称等。一切都工作正常,只是问题出在启动屏幕上。在 iOS 设备上,我可以使用以下代码更改启动屏幕。

<link rel="apple-touch-startup-image" media="(device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3)" href="<?= \yii\helpers\Url::to('@web/img/splash/iPhone-X.png') ?>">

但在 Android 设备上我无法这样做。我的实际要求是仅在启动屏幕上显示徽标。在 Android 上,它还会在启动屏幕上显示徽标和应用程序名称。

下面是我的

manifest.json
文件。 我在 Google 和 Stack Overflow 上进行了搜索,但没有一个结果对我有帮助,这就是为什么我必须在 Stack Overflow 上发布问题。

{
"short_name": "MyApp",
"name": "My Progressive App",
"icons": [
    {
        "src": "/img/splash/48x48.png",
        "type": "image/png",
        "sizes": "48x48"
    },
    {
        "src": "/img/splash/96x96.png",
        "type": "image/png",
        "sizes": "96x96"
    },
    {
        "src": "/img/splash/144x144.png",
        "type": "image/png",
        "sizes": "144x144"
    },
    {
        "src": "/img/splash/192x192.png",
        "type": "image/png",
        "sizes": "192x192"
    },
    {
        "src": "/img/splash/256x256.png",
        "type": "image/png",
        "sizes": "256x256"
    },
    {
        "src": "/img/splash/384x384.png",
        "type": "image/png",
        "sizes": "384x384"
    },
    {
        "src": "/img/splash/512x512.png",
        "type": "image/png",
        "sizes": "512x512"
    }
],
"background_color": "#FFFFFF",
"display": "standalone",
"theme_color": "#FFFFFF"
}
android css meta-tags progressive-web-apps
3个回答
0
投票

如果您的问题是在 Android 上仅显示图标而不显示应用程序名称,则很遗憾,这是不可能的,抱歉。


0
投票

要在您

Add to homescreen
时显示应用程序图标,只需确保在模板中提供以下链接:

<link rel="icon" sizes="192x192" href="nice-highres.png"> (recommended)
<link rel="icon" sizes="128x128" href="niceicon.png">
<link rel="apple-touch-icon" sizes="128x128" href="niceicon.png">
<link rel="apple-touch-icon-precomposed" sizes="128x128" href="niceicon.png">

您的

manifest.json
看起来不错,只需在其中添加
192x192
图标即可,因为它是建议的图标大小。


0
投票

Ты нашел решение? Я прекрасно понял о чем речь, чтобы не иконку приложения на андроиде отображало, а как на айфонах именно экран заста вка,что есть картинка

© www.soinside.com 2019 - 2024. All rights reserved.