web-dev-qa-db-fra.com

Ionic 3 - taille de l'écran de démarrage

Je dois générer un écran de démarrage pour mon application ionique 3. Certains des sites ont indiqué que la taille correcte de l'image de l'écran de démarrage devrait être 2732 * 2732 et d'autres sites ont indiqué que la taille de l'écran de démarrage devait être de 2208 * 2208. Lequel est correct? Cependant, nous avons essayé avec 2732 * 2732, mais après avoir généré un écran de démarrage, l’image n’est pas adaptée aux appareils et l’écran de démarrage est trop grand lors de l’affichage dans les appareils. Tout corps a une idée à ce sujet?

La taille de l'icône de l'application doit être de 1024 * 1024 et tout fonctionne correctement.

Nous exécutons la commande suivante pour générer les icônes et l'écran de démarrage pour différentes tailles de périphériques pour les périphériques Android et iOS.

ionic cordova resources

Merci

ionic3splash-screenappicon
2
Anantha krishnan

Nous avons changé l'image de démarrage et maintenant la nouvelle image (2732 * 2732), l'icône a été centrée. Ainsi, lors du rognage de l'image, l'icône centrale ne sera pas coupée et, dans tous les périphériques, elle fonctionne correctement maintenant.

Dans certains sites, ils ont mentionné la taille 2208 * 2208. C'est ce qui est confus.

Donc, le problème avec l'image de démarrage maintenant résolu.

Le seul problème pour l'écran de démarrage est que l'icône de l'écran de démarrage doit être centrée. Sinon, l'image sera recadrée lors de la création d'un écran de démarrage.

Merci

2
Anantha krishnan

Je pense que le meilleur moyen est d’utiliser l’écran de démarrage et le générateur d’icônes pour Ionic 3.

Cela fonctionne bien pour moi:

ICÔNE

  1. Créez votre icône icon.png ou icon.psd ou icon.ai . Pour moi, j'ai créé mon icône 1024x1024 avec extension png
  2. Enregistrez votre icône dans le répertoire resources (example: votre-projet/resources/icon.png)
  3. Et juste utiliser ressources ioniques cordova --icon

ÉCLABOUSSURE

  1. Créez votre splash splash.png ou splash.psd ou splash.ai . Pour moi, j'ai créé mon splash 4816x4816 avec une extension png
  2. Enregistrez votre splash dans le répertoire resources (example: votre-projet/resources/splash.png)
  3. Et juste utiliser ressources ioniques cordova --splash

Dans votre fichier config.xml, vous verrez le code généré comme ceci:

<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/[email protected]" width="114" />
    <icon height="40" src="resources/ios/icon/icon-40.png" width="40" />
    <icon height="80" src="resources/ios/icon/[email protected]" width="80" />
    <icon height="120" src="resources/ios/icon/[email protected]" width="120" />
    <icon height="50" src="resources/ios/icon/icon-50.png" width="50" />
    <icon height="100" src="resources/ios/icon/[email protected]" width="100" />
    <icon height="60" src="resources/ios/icon/icon-60.png" width="60" />
    <icon height="120" src="resources/ios/icon/[email protected]" width="120" />
    <icon height="180" src="resources/ios/icon/[email protected]" width="180" />
    <icon height="72" src="resources/ios/icon/icon-72.png" width="72" />
    <icon height="144" src="resources/ios/icon/[email protected]" width="144" />
    <icon height="76" src="resources/ios/icon/icon-76.png" width="76" />
    <icon height="152" src="resources/ios/icon/[email protected]" width="152" />
    <icon height="167" src="resources/ios/icon/[email protected]" width="167" />
    <icon height="29" src="resources/ios/icon/icon-small.png" width="29" />
    <icon height="58" src="resources/ios/icon/[email protected]" width="58" />
    <icon height="87" src="resources/ios/icon/[email protected]" 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>

Si cela ne fonctionne pas, vous devrez probablement générer les plates-formes avant.

0
XenoX

Lorsque vous ajoutez une plate-forme avec ionic cordova platform add, il génère un dossier nommé resources dans le dossier racine. Dans resources, vous trouverez les fichiers icon.png et splash.png générés avec les tailles correctes, à savoir 1024x1024 et 2732x2732. En ce qui me concerne, vous devriez utiliser ces dimensions exactes, pas plus petites ni plus grandes.

0
Rob

L'image source pour les écrans de démarrage doit idéalement être au moins 2732 × 2732px. Mais utilisez uniquement un écran de fond blanc de cette taille avec la position des icônes centralisée. N'utilisez pas d'icône de cette taille.

0
Mangesh Daundkar