3

我需要为我的 ionic 3 应用程序生成启动画面。有的网站说闪屏图片的正确尺寸应该是2732*2732，有的网站说闪屏尺寸应该是2208*2208，哪个是正确的？但是我们尝试使用 2732*2732，但是在生成闪屏后，图像不适合设备，并且在设备中显示时闪屏太大。任何机构对此有任何想法？

应用程序图标大小应为 1024*1024 并且工作正常。

我们执行以下命令来为 android 和 iOS 设备的不同大小的设备生成图标和启动画面。

ionic cordova resources

谢谢

4

4 回答 4

4

我们更改了初始图像，现在新图像 (2732*2732) 图标已居中。因此，在裁剪图像时，中心图标不会被裁剪，并且在所有设备中它现在都可以正常工作。

在某些站点中，他们提到大小为 2208*2208。这就是困惑。

所以现在解决了启动图像的问题。

启动画面的唯一问题是启动画面的图标应该居中。否则生成启动画面时图像将被裁剪。

谢谢

于 2018-07-24T10:17:57.647 回答
2

我认为最好的方法是使用 Ionic 3 的启动画面和图标生成器。

这对我来说很好：

图标

  1. 创建您的图标icon.png或icon.psd或icon.ai。对我来说，我创建了带有 png 扩展名的 1024x1024 图标
  2. 将您的图标保存到资源目录（例如：your-project/resources/icon.png）
  3. 并且只需使用ionic cordova 资源 --icon

溅

  1. 创建您的 splash splash.png或splash.psd或splash.ai。对我来说，我创建了带有 png 扩展名的启动画面 4816x4816
  2. 将您的启动画面保存到资源目录（例如：your-project/resources/splash.png）
  3. 只需使用ionic cordova 资源 --splash

在您的 config.xml 文件中，您将看到生成的代码如下：

<platform name="ios">
    <allow-intent href="itms:*" />
    <allow-intent href="itms-apps:*" />
    <icon height="57" src="resources/ios/icon/icon.png" width="57" />
    <icon height="114" src="resources/ios/icon/icon@2x.png" width="114" />
    <icon height="40" src="resources/ios/icon/icon-40.png" width="40" />
    <icon height="80" src="resources/ios/icon/icon-40@2x.png" width="80" />
    <icon height="120" src="resources/ios/icon/icon-40@3x.png" width="120" />
    <icon height="50" src="resources/ios/icon/icon-50.png" width="50" />
    <icon height="100" src="resources/ios/icon/icon-50@2x.png" width="100" />
    <icon height="60" src="resources/ios/icon/icon-60.png" width="60" />
    <icon height="120" src="resources/ios/icon/icon-60@2x.png" width="120" />
    <icon height="180" src="resources/ios/icon/icon-60@3x.png" width="180" />
    <icon height="72" src="resources/ios/icon/icon-72.png" width="72" />
    <icon height="144" src="resources/ios/icon/icon-72@2x.png" width="144" />
    <icon height="76" src="resources/ios/icon/icon-76.png" width="76" />
    <icon height="152" src="resources/ios/icon/icon-76@2x.png" width="152" />
    <icon height="167" src="resources/ios/icon/icon-83.5@2x.png" width="167" />
    <icon height="29" src="resources/ios/icon/icon-small.png" width="29" />
    <icon height="58" src="resources/ios/icon/icon-small@2x.png" width="58" />
    <icon height="87" src="resources/ios/icon/icon-small@3x.png" width="87" />
    <splash height="1136" src="resources/ios/splash/Default-568h@2x~iphone.png" width="640" />
    <splash height="1334" src="resources/ios/splash/Default-667h.png" width="750" />
    <splash height="2208" src="resources/ios/splash/Default-736h.png" width="1242" />
    <splash height="1242" src="resources/ios/splash/Default-Landscape-736h.png" width="2208" />
    <splash height="1536" src="resources/ios/splash/Default-Landscape@2x~ipad.png" width="2048" />
    <splash height="2048" src="resources/ios/splash/Default-Landscape@~ipadpro.png" width="2732" />
    <splash height="768" src="resources/ios/splash/Default-Landscape~ipad.png" width="1024" />
    <splash height="2048" src="resources/ios/splash/Default-Portrait@2x~ipad.png" width="1536" />
    <splash height="2732" src="resources/ios/splash/Default-Portrait@~ipadpro.png" width="2048" />
    <splash height="1024" src="resources/ios/splash/Default-Portrait~ipad.png" width="768" />
    <splash height="960" src="resources/ios/splash/Default@2x~iphone.png" width="640" />
    <splash height="480" src="resources/ios/splash/Default~iphone.png" width="320" />
</platform>

如果这不起作用，您可能需要先生成平台。

于 2018-07-24T08:46:14.957 回答
1

当您添加一个平台时，ionic cordova platform add它会生成一个resources在根文件夹中命名的文件夹。在里面resources你会发现生成的icon.png和splash.png具有正确大小的文件，即1024x1024和2732x2732。就我而言，您应该使用确切的尺寸，而不是更小，而不是更大。

于 2018-07-17T11:49:53.220 回答
0

初始屏幕的源图像理想情况下应至少为 2732×2732px。但是只使用这种大小的背景白色屏幕，图标位置集中。不要使用这种大小的图标。

于 2018-07-17T06:26:18.217 回答