Avant de poursuivre le processus de génération ou de publication et donc de le transférer dans les magasins
d'applications, continuons de le configurer.
Maintenant, pour un, il y a des blancs ici comme la description qui manque que vous
pourriez ajouter en
ajoutant une clé de description ici avec du texte et ce serait la description qui apparaît ici.
Important, ce n'est pas une description qui apparaît dans
les magasins d'applications, c'est vraiment juste une description qui s'affiche ici et vous pouvez
en apprendre plus sur la description, toutes les autres clés que vous pouvez définir ici dans cette page.
Il y a beaucoup de paramètres que vous pouvez définir après tout.
Maintenant, ce qui m'intéresse en ce moment, c'est la partie icône et écran de démarrage car c'est l'icône que les gens
verront sur l'écran d'accueil, bien sûr
pas encore parce que pour le moment nous ne publions pas les applications sur l'App Store, mais cela va changer
et l'écran de
démarrage, eh bien, c'est ce que les utilisateurs voient
lorsque notre application se charge et les deux sont généralement des éléments que vous souhaitez personnaliser.
Maintenant, expo vous donne une icône et un écran de démarrage hors de la boîte, mais les deux ne sont que des espaces réservés vides, à droite,
donc
ce n'est pas trop étonnant, au lieu de cela,
nous voulons fournir notre propre icône, notre propre image de l'écran de démarrage ici.
Maintenant, vous êtes vraiment flexible quant à ce que vous fournissez ici, mais en général, c'est
une bonne idée de fournir une icône dans la résolution 1024 x 1024, donc une
icône carrée comme entrée et pour l'écran de démarrage, vous pouvez créer un écran de démarrage comme décrit dans la documentation officielle où vous
pouvez en savoir plus sur la façon dont vous pouvez créer un tel écran
de démarrage, comment vous pouvez le structurer, etc.
Maintenant, j'ai préparé quelque chose pour vous que vous pouvez utiliser pour suivre maintenant que vous ne devriez pas utiliser pour un déploiement réel parce
que ces actifs sont juste pour ce cours, pas pour que vous les utilisiez dans votre application que vous prévoyez de déployer
et pour celle jointe que vous trouvez les icônes. fichier zip.
Maintenant, si vous décompressez cela, là-dedans, vous trouverez des endroits. fichier png que vous pouvez bien sûr glisser-déposer dans le
dossier des actifs,
vous pouvez également supprimer l'icône. fichier png si vous le souhaitez.
Vous pouvez également supprimer le splash. fichier png, car dans ce dossier joint, vous trouverez
également cette icône de démarrage. fichier png que vous pouvez bien sûr aussi glisser-déposer ici.
Maintenant, ce ne sont que quelques icônes que j'ai créées que nous pouvons utiliser maintenant
et de retour dans l'application. fichier json, nous pouvons maintenant pointer sur les icônes personnalisées. Important, vous devez fournir des
fichiers png comme je le fais ici.
Alors maintenant, pour l'icône, nous pouvons pointer sur les actifs / lieux. png et pour le splash, on peut
pointer que assets / splash_icon. png. Maintenant, comme couleur de fond, nous pouvons utiliser une
couleur noir foncé
comme le code hexadécimal # 171717, cela devrait être une couleur de code hexadécimal comme celle-ci et le mode de redimensionnement ici peut
être défini pour contenir ou couvrir, la couverture étirera essentiellement l'icône à prendre la largeur et la
hauteur entièrement disponibles, contiennent conservera la taille de l'icône, la centrera et aura cette couleur d'arrière-plan derrière l'icône.
Maintenant, si nous le faisons, nous pouvons déjà voir le résultat de
cela si nous commençons juste par npm, donc le serveur comme nous l'avons fait plusieurs fois dans ce cours ou l'expo démarre et nous le lançons ensuite sur
un émulateur, Android ou iOS comme je je le fais ici. Maintenant, cela le lance là-bas et maintenant vous voyez, c'est l'écran de démarrage
qui en prend déjà un nouveau, avec l'image là-dedans qui est notre grand mais c'est exprès pour que nous
puissions le voir clairement et la couleur d'arrière-plan qui est légèrement différente afin que vous avez
également une chance de voir cela, bien sûr, vous pouvez choisir la même couleur pour
avoir un écran de démarrage transparent ici.
Donc, cela fonctionne et attendons que cela se termine et
voici l'application en cours d'exécution et maintenant vous voyez votre icône ici aussi si
vous allez dans le sélecteur de tâches. Vous voyez, ça n'a pas l'air génial avec l'arrière-plan, mais
c'est quelque chose que nous pouvons
améliorer, mais voici l'icône en général, donc cela fonctionne, nous voyons à la fois l'écran de démarrage et l'icône et sur iOS, ce
serait la même chose. Maintenant, comme vous pouvez
le constater, l'icône n'est pas si belle sur Android.
La raison en est qu'Android, selon la version d'Android que vous utilisez sur
votre appareil, utilise différentes icônes, les versions plus récentes d'Android utilisent ces icônes dites adaptatives qui sont ces
icônes arrondies où vous avez votre icône au milieu puis une couleur d'arrière-plan ou une
image d'arrière-plan même derrière eux,
les anciennes versions utilisaient des icônes carrées.
Maintenant, vous pouvez répondre à cela en fournissant une configuration plus détaillée pour Android et également
pour iOS si vous le souhaitez. Au lieu d'avoir cette clé d'icône générale ici, vous pouvez configurer des paramètres spécifiques à la plate-forme
et c'est aussi quelque chose que vous avez appris dans les documents officiels bien sûr.
Là, vous pouvez trouver des informations sur la façon dont vous pouvez configurer le splash d'icônes,
c'est bien, mais aussi sur la façon dont vous pouvez configurer iOS d'une manière
spécifique et là, vous pouvez configurer une icône spécifique pour iOS si vous souhaitez l'utiliser.
Bien sûr, la même chose est vraie pour l'écran de démarrage, vous pouvez donc essentiellement ajouter un nœud iOS
à votre configuration, nous l'avons déjà ici même et là-bas, vous pouvez également ajouter une icône, puis également une configuration de démarrage qui ressemble
exactement ou qui ressemblerait exactement à la configuration racine que nous avons ici, mais maintenant vous
pouvez essentiellement remplacer ces paramètres généraux de niveau racine et avoir une icône spécifique pour iOS et un
écran de démarrage spécifique pour iOS.
C'est donc quelque chose que vous pourriez faire et la même chose est vraie pour Android et vous le trouverez bien sûr également
dans les documents officiels.
Vous pouvez ajouter une clé Android ici à votre application. fichier json, puis cela contient un objet pour ainsi
dire, là, vous pouvez également mettre en place une icône et une configuration de démarrage comme je l'ai expliqué pour
iOS et maintenant ces paramètres seraient pris pour Android,
iOS car il n'a pas de paramètres spécifiques dans mon exemple ici utiliserait toujours les
paramètres généraux là-haut.
Maintenant, la chose intéressante est pour Android, vous ne pouvez pas simplement définir un écran de
démarrage d'icônes spécifique, vous pouvez également définir une icône adaptative ici avec la configuration des icônes adaptatives, qui n'est pas disponible pour iOS
car les icônes adaptatives sont exclusives à Android.
L'icône adaptative prend un objet Javascript pour ainsi dire comme une valeur de configuration, pas une chaîne et cet objet peut
avoir trois clés - une image de premier plan, une couleur d'arrière-plan ou une image d'arrière-plan.
Vous avez maintenant une couleur d'arrière-plan ou une image d'arrière-plan, mais vous devez toujours avoir une image
de premier plan.
Maintenant, ici, nous pouvons ajouter une image de premier plan, donc cette clé ici
et la couleur d'arrière-plan qui devrait être un code hexadécimal à six chiffres comme vous pouvez le voir et faisons
rapidement cela ici et maintenant nous pouvons définir la couleur d'arrière-plan pour dire que le code # 171717
et le l'image de premier plan peut maintenant être définie sur notre icône, bien que
pour cela, je vous recommande d'utiliser une icône spécifique
que vous trouverez également ci-jointe, les lieux adaptatifs. fichier png que vous pouvez faire glisser et déposer dans votre dossier d'actifs et qui place-adaptatif. Le fichier png peut maintenant être utilisé
ici comme image de premier plan, afin que nous puissions pointer sur les actifs, puis sur les
lieux adaptatifs. png.
Maintenant, cette icône, l'icône des lieux adaptatifs est transparente, c'est toujours l'icône mais elle a
un fond transparent, contrairement à l'autre icône et qui permettra donc à Android de
la placer devant cette couleur de fond ou image de fond que vous avez fournie
et automatiquement autour des coins pour vous et ainsi de suite.
Donc, si nous enregistrons maintenant ceci et cela reconstruit donc et pour être sûr qu'il en tient vraiment compte,
je redémarrerai mon serveur d'expo ici.
Si nous lançons maintenant cela sur Android et que je ferme également le client expo ici et que je
le réexécute sur Android, nous
devrions voir qu'une fois que cela a redémarré, nous avons
maintenant une icône plus agréable qui semble un peu meilleure.
Attendons donc que cela se lance,
c'est toujours l'écran de démarrage tel que nous l'avons configuré auparavant, je n'ai pas non plus défini d'écran de démarrage spécifique à Android que nous
pourrions bien sûr mais ici je ne l'ai pas
fait, nous avons donc bien sûr obtenu la même chose écran de démarrage comme précédemment dans ce module
et si vous regardez maintenant l'icône, vous pourriez malheureusement encore voir l'ancien. La nouvelle sera prise en compte une fois
que nous aurons créé cette application en tant qu'application autonome et que nous la distribuerons aux magasins d'applications.
En général, la recommandation est que pour Android, vous définissez une telle icône adaptative car vous couvrez plus de
versions Android, ce qui ne fait pas de mal, bien sûr. Définir une telle icône générale n'est pas non plus une mauvaise idée
et bien
sûr, nous pouvons utiliser une seule et même icône pour iOS et Android ou vous définir des icônes spécifiques
pour iOS et pour Android, comme mentionné pour Android éventuellement, l'icône adaptative. Si vous souhaitez en savoir plus sur le processus de
création et de gestion des icônes et des écrans de démarrage, vous trouverez ci-joint les documents d'exposition officiels
qui plongent profondément dans les différentes options que vous avez là-bas et ce que vous devez considérer.