PixelProgress (Exo)

PixelProgress (Exo)

Consigne

Dans cet exercice, tu vas créer une classe observable possédant une propriété @Published représentant la progression (en pourcentage). Sur la vue parente, tu vas créer une instance de cette classe observable à l’aide d’un @StateObject afin de pouvoir lire et afficher cette progression à l’écran (dans un cercle de progression). Ensuite, tu vas créer une vue enfant qui observera cette même instance avec un @ObservedObject. Sur cette vue enfant, tu ajouteras un Slider dont la valeur sera directement liée à la propriété de progression, allant de 0 à 100.

Lorsque tu modifies la valeur du slider dans la vue enfant, la progression doit être immédiatement répercutée sur le remplissage du cercle en revenant sur la vue parente.

Maquette

 Tips

Cet exercice va te faire retravailler un objet observé, tu sais déjà faire, on l’a vu dans l’exo précédent.
Cette fois, on ajoute une couche supplémentaire en utilisant @ObservedObject dans une vue enfant pour manipuler l’instance de cette classe observée.
Quelques conseils pour t’aider :

→ Pour le cercle, pourn’en afficher qu’une partie, tu peux utiliser le modificateur .trim().

→ Ensuite, tu peux également utiliser .stroke(), qui permet de colorer uniquement le contour d’une Shape.

→ Et pour rappel, le SF Symbol du logo Swift est tout simplement « swift« .

Lien utile

→ @ObservedObject

→ Objet observable

→ Slider

Correction

→ Correction