Maintenant que vous avez une première idée du concept d'objet, nous allons pouvoir concevoir les objets de notre programme.
Découvrir le projet
Pour cela, je vous propose sans plus attendre de découvrir le projet sur lequel vous allez travailler. Le projet est disponible sur Github. Je vous invite à télécharger le projet sur votre Mac.
Une fois le projet téléchargé, vous pouvez ouvrir le fichier SchoolBusPlayground.playground. Et vous devriez arriver sur ceci :
Vous trouvez d'abord sur la droite une étendue de pelouse sur laquelle se trouve un bus. Cela c'est notre canevas. C'est sur ce canevas que nous allons dessiner notre route et déplacer notre bus.
Voyons maintenant ce qu'il se passe côté code. Tout d'abord nous avons quatre lignes de code que je vous invite à ignorer. Elles permettent seulement d'initialiser le canevas. Ensuite la documentation nous présente 5 fonctions réparties en 2 catégories :
3 qui concernent la route, ces fonctions permettent de dessiner des sections de route.
2 qui concernent le bus, ces fonctions permettent de faire avancer ou de faire marquer un stop au bus.
Je vous invite à essayer les fonctions proposées pour comprendre un peu leur fonctionnement. Par exemple, vous pouvez écrire :
canvas.createRoadSection()
canvas.createRoadSection()
canvas.createRoadSection()
canvas.createHomeRoadSection()
canvas.createRoadSection()
canvas.createSchoolRoadSection()
Dans ce code, nous créons sur le canevas trois sections de route normale puis une qui contient une maison, puis une normale et enfin une qui contient une école. Cet exemple couvre les trois exemples de création de route.
Le but de notre programme va être de déplacer le bus le long de la route en suivant 2 règles :
Il doit s’arrêter à chaque maison pour récupérer des enfants
Il doit s’arrêter à chaque école pour déposer tous les enfants dans le bus.
Le programme que nous allons construire doit pouvoir fonctionner, quelle que soit la route que nous allons dessiner.
Maintenant, à vous de jouer ! Essayer d'utiliser les deux fonctions restantes pour déplacer le bus. Il doit avancer jusqu'à l'école en marquant un arrêt à la maison pour récupérer les écoliers et à l'école pour les déposer.
// Ne regardez pas la correction !
canvas.moveBusForward()
canvas.moveBusForward()
canvas.moveBusForward()
canvas.stopBus()
canvas.moveBusForward()
canvas.moveBusForward()
canva.stopBus()
Et voilà ! Vous savez utiliser toutes les fonctionnalités du canevas. Nous allons construire tout notre programme à partir de ces 5 fonctions. N'hésitez pas à jouer un peu avec pour bien vous familiariser avec son fonctionnement.
Comprendre notre Playground
Si vous avez suivi le cours précédent comme suggéré, vous êtes déjà à l'aise avec un certain nombre de fonctionnalités du Playground, mais dans ce cours nous poussons plus loin les capacités du Playground. Laissez-moi en quelques mots vous en présenter les fonctionnalités dont nous allons profiter dans ce cours.
La documentation
Il est possible que dans le texte, vous voyiez plutôt ceci :
Les commentaires en vert qui commencent par /*: sont un moyen d'écrire de la documentation dans le Playground. Cela est utile notamment pour agrémenter le code d'instructions facilement lisibles ce qui est bien pratique dans notre cas. Si vous voulez en savoir plus sur le format de la documentation, vous pouvez aller ici.
Pour afficher correctement la documentation, vous pouvez cliquer dans le menu en haut sur Editor puis Show Rendered Markup.
Les live view
Les live view, c'est ce que vous voyez sur la droite en mode assistant. C'est notre canevas. En effet, c'est un objet vue, tel qu'il existe sur iOS dans lequel on peut glisser ce que l'on souhaite.
Ces vues permettent d'avoir un rendu visuel animé ou non de ce que l'on souhaite montrer. Cela pourra vous être utile lorsque vous souhaiterez créer des composants customisés dans iOS (comme des boutons, des switch, des listes, etc.). Vous pourrez les créer en utilisant une live view pour voir instantanément le rendu. Et lorsqu'ils sont prêts, vous n'aurez plus qu'à copier le code dans votre application.
Les sources et ressources
Si vous ouvrez le navigateur - le panneau de droite, vous trouverez les sources et ressources du projet.
Les sources
Les sources d'un projet permettent de cacher une implémentation à l'utilisateur du Playground. Par exemple, ici, j'ai mis l'ensemble de ce qui concerne le canevas et ces animations dans les sources.
L'autre avantage d'écrire du code dans les sources, c'est qu'il n'est évalué qu'une fois au lancement du Playground et non à chaque fois que le code dans le Playground est modifié. Cela permet de gagner en performance. Le Playground ne doit pas tout recalculer à chaque fois.
Les ressources
Dessous, vous trouverez les ressources, c'est ici que l'on enregistre les fichiers dont le Playground va avoir besoin pour s'exécuter. Dans notre cas, on y trouve les images qui permettent de dessiner notre canevas. Mais on aurait pu y mettre des pistes audios, des vidéos, des données, bref tout ce qui n'est pas du code !
De la même manière, ces ressources ne sont chargées qu'au lancement du Playground.
Concevoir nos objets
Maintenant que le décor est bien planté, nous allons commencer à réfléchir un peu. Comment allons-nous organiser notre code ?
Reprenons le même genre de raisonnement que pour le jeu "Qui-est-ce ?" et essayons de découper en plusieurs objets notre code.
Les propriétés
Tout d'abord, commençons par le plus évident : le bus. Nous allons donc avoir un objet Bus qui va avoir quelques propriétés comme :
le nombre de sièges
le nombre de sièges occupés
le nom du chauffeur
Ensuite nous allons avoir la route. La route c'est un peu plus subtil. Si on regarde les méthodes proposées par le canevas, on crée la route par section. Donc la route c'est la combinaison de plusieurs sections de route qui s'enchaînent. Certaines ayant une maison, d'autres une école et enfin d'autres rien.
On a donc un objet Route qui a une propriété :
un tableau de section de routes
Enfin, il existe un dernier objet qui est la Section De Route. Cet objet a donc 3 types différents. Et nous verrons comment les différentier avec l'héritage en partie 3 de ce cours.
Les méthodes
Mais un objet, comme vous le savez désormais, a des propriétés qui décrivent ce qu'il est, mais aussi des méthodes qui décrivent ce qu'il fait.
À première vue, une route ou une section de route, ça ne fait pas grand-chose... En revanche, un bus ça en fait !
Donc nous allons a priori avoir au moins 2 méthodes :
avance
marque un arrêt
L'analyse que nous venons de faire s'appelle un diagramme de classe.
En résumé
Le projet contient un Playground dans lequel est présenté un canevas. Ce canevas a 5 fonctions qui nous permettent de :
créer une section de route avec ou sans école ou maison
faire avancer le bus
faire marquer un arrêt au bus
Dans ce cours, nous découvrons 3 fonctionnalités avancées du Playground :
Les live view
La documentation
Les sources et ressources
Dans notre diagramme de classes, nous avons identifié 3 objets que nous allons créer :
Bus
Road
RoadSection
