Introduction à la Stylisation avec StyleSheet
Objectifs
Les objectifs de cette vidéo sont de :
- Comprendre comment importer et utiliser StyleSheet dans React Native.
- Apprendre à définir et appliquer des styles à des composants React.
- Maîtriser l'utilisation de flexbox pour le layout des applications mobiles.
- Apprendre à centrer du texte et d'autres éléments visuels dans une vue.
Résumé
Dans cette leçon, vous allez apprendre à utiliser StyleSheet de React Native pour donner du style à vos composants, améliorer l'alignement de texte, et utiliser des propriétés comme flex1 et backgroundColor.
Description
Cette leçon traite de l'utilisation de StyleSheet dans React Native pour styliser vos composants de manière efficace. Nous allons explorer comment créer une feuille de style, définir des clés de style, et appliquer ces styles à vos composants. Enfin, nous discuterons de certaines propriétés importantes comme flex1 et backgroundColor, ainsi que des méthodes pour centrer du texte à l'intérieur de vos vues.
Nous commencerons par importer le module StyleSheet de React Native et définirons une constante contenant nos styles. Ensuite, nous appliquerons ces styles aux composants via l'attribut style. Par la suite, nous verrons comment utiliser les propriétés de flexbox telles que justifyContent et alignItems pour aligner notre contenu de manière cohérente et professionnelle.
Enfin, cette leçon met en évidence certaines limitations de React Native en termes de styles comparativement au CSS traditionnel, et fournit des astuces pour contourner ces limitations dans vos projets de développement mobile.
Questions - réponses
Programme détaillé
Module 1 - Intro React Native
Module 2 - Environnement de travail
Module 3 - Environnement de travail
Module 4 - Mon premier composant réutilisable en React Native
Module 5 - Mon premier composant stateful
Module 6 - Créer un menu de navigation
Module 7 - Aller plus loin
Module 8 - Déployer son application
Dommage parce le contenu semble etre de qualité