Contenu du cours
Fondations de React Native
Fondations de React Native
Défi : Ajout de Styles
Temps de défi !
Maintenant, c'est à votre tour d'implémenter le style dans notre application actuelle. Suivez ces étapes :
Étapes
- Importez
StyleSheet
depuisreact-native
; - Initialisez les styles avec
StyleSheet.create()
; - Spécifiez les noms de classes suivants avec leurs propriétés et valeurs respectives :
- container:
flex: 1, justifyContent: "center", alignItems: "center", backgroundColor: "#00FFAB", flexDirection: "row",
; text
:fontSize: 18, color: "#913f92",
;image
:marginLeft: 10,
.
- container:
- Appliquez les noms de classes créés aux éléments d'interface utilisateur appropriés :
- Appliquez
container
auView
; - Appliquez
text
auText
; - Appliquez
image
à l'Image
.
- Appliquez
Nous devrions voir le résultat suivant après avoir implémenté ces changements.
Exécutez la commande dans le terminal pour copier le projet et commencer à travailler sur le défi.
Allez dans le dossier créé où se trouvent les fichiers du projet.
Installez les packages nécessaires.
Pour démarrer l'application et voir l'apparence initiale, exécutez la commande suivante dans le terminal :
Si vous rencontrez des difficultés lors de la mise en œuvre du défi, nous vous recommandons de consulter l'enregistrement suivant avec un guide étape par étape sur la façon de tout faire. Bonne chance!
En Pratique
Tout était clair ?
Merci pour vos commentaires !
Section 2. Chapitre 6