Théorie

Le composant ActivityIndicator est utilisé pour indiquer qu'une tâche est en cours, fournissant un retour visuel à l'utilisateur. Il apparaît généralement sous la forme d'une roue tournante ou d'un autre indicateur animé pour indiquer que l'application est occupée à effectuer une opération.

Pourquoi en avons-nous besoin ?

Indique que l'application travaille sur une tâche, empêchant l'utilisateur de supposer que l'application a gelé.

Comment travailler avec ActivityIndicator

• L'ActivityIndicator est simple à utiliser et ne nécessite pas de gestion d'état;
• Nous pouvons contrôler sa visibilité en le rendant conditionnellement en fonction de l'état d'une tâche.

Exemple

Explication

• Initialement, le composant affiche un message de bienvenue en utilisant le composant Text et un bouton en utilisant le composant TouchableOpacity;
• Lorsque le bouton est pressé, la fonction fetchData est appelée, ce qui définit isLoading à true pour afficher le ActivityIndicator;
• Après un délai de 3 secondes (simulant la récupération de données), la fonction fetchData remet isLoading à false et met à jour l'état additionalData avec du texte;
• Le ActivityIndicator est affiché tant que isLoading est true, et une fois que isLoading devient false, le additionalData est affiché en utilisant le composant Text.

Résultat

En Pratique