[Tuto] Le pattern MVC et la POO avec AutoIt

Espace contenant des tutoriels divers concernant AutoIt.
Règles du forum
.

Tutoriel "La programmation avec Autoit" : https://openclassrooms.com/fr/courses/1 ... vec-autoit
Répondre
Avatar du membre
Docteur
Niveau 2
Niveau 2
Messages : 15
Enregistré le : jeu. 23 juin 2011 09:55
Status : Hors ligne

[Tuto] Le pattern MVC et la POO avec AutoIt

#1

Message par Docteur » dim. 26 juin 2011 19:58

Avant propos
Design pattern MVC
Ce tutoriel présente le pattern MVC (Model-View-Controler) et une de ses applications possibles dans AutoIt.

Le pattern MVC répond à une problématique d'organisation du code et de maintenabilité. Le principe est de découper le logiciel en trois couches :
  • Le modèle : couche permettant de stocker/récupérer les données.
  • La vue : couche permettant d'afficher les données et d'intéragir avec l'utilisateur.
  • Le contrôleur : couche permettant de traiter les données.
Le modèle n'intéragit pas directement avec la vue. Toutes les interactions entre les données stockées et les données affichées sont traitées par le contrôleur.

Cette présentation succinte suffira pour le reste du tutoriel. Pour des informations complémentaires sur le pattern MVC, vous pouvez lire l'article wikipédia correspondant.

Programmation orientée objet
AutoIt n'étant pas un langage orienté objet, seul le principe de la programmation orientée objet nous intéressera ici. Si vous ne connaissez pas la POO, consultez l'article wikipédia correspondant.

Architecture AutoIt
Exemple avec la gestion d'une bibliothèque

Nous allons utiliser comme exemple, une gestion de bibliothèque. Nous pourrons lister les livres présents dans notre bibliothèque et afficher les informations sur ces livres.

I - Création du projet

Une des applications possibles en AutoIt, pour le pattern MVC, est de séparer votre répertoire de projet en 3 sous-dossiers :

Code : Tout sélectionner

D:\Projects\AutoIt\Library>dir

[...]
25/06/2011  11:57    <DIR>          .
25/06/2011  11:57    <DIR>          ..
25/06/2011  11:57    <DIR>          controler
25/06/2011  11:57    <DIR>          model
25/06/2011  11:57    <DIR>          view
               0 File(s)              0 bytes
               5 Dir(s)  277 588 176 896 bytes free
 
Ce découpage vous permettra d'ores et déjà de réfléchir à la position qu'occupent les fonctions que vous codez. Toutes les fonctions commençant par GUI devront, logiquement, se trouver dans le dossier "view". Tous les accès aux fichiers, aux bases de données, etc. se trouveront dans le dossier "model". Le reste se trouvera alors dans le dossier "controler"

Dans le cadre du projet, et ceci sera vrai pour la plupart de vos projets, vous aurez besoin de deux répertoires supplémentaires :
- Un répertoire "lib" à la racine du projet, pour y déposer vos UDF.
- Un répertoire "db" à la racine du projet, pour assurer la persistance de vos données.


II - Point d'entrée de l'application

Vous aurez besoin de créer un point d'entrée de votre application. C'est le script principal, que vous devrez exécuter et compiler pour que votre application fonctionne. Nous allons donc créer un fichier "main.au3" à la racine du projet.
► Afficher le textemain.au3
On peut constater qu'il n'y a, dans ce fichier, que les imports des fichiers. Aucune logique métier ni aucun algorithme. Ce point d'entrée sert juste à rediriger vers l'action à effectuer par défaut. Ici, la méthode "controler_book_list()" est appelée au lancement du script.

III - Création des modèles
Les modèles doivent gérer indépendamment la persistance des données. Ils doivent offrir une interface complète permettant de gérer les cas d'utilisation.

Dans le cadre du projet, nous utiliserons un fichier CSV pour stocker nos données.

Le modèle "Livre" contient :
- un identifiant,
- un titre,
- un auteur,
- une description courte.

Nous allons donc créer un fichier "database.csv" dans le dossier "db/". Il contiendra 4 livres :

Code : Tout sélectionner

1;Stupeurs et tremblements;Amélie Nothomb;Amélie, fille de Belges qui vécut sa petite enfance au Japon, a toujours admiré le raffinement et l’art de vivre du pays.
2;Le Rouge et le Noir;Stendhal;Le roman compte deux parties : la première retrace le parcours de Julien Sorel dans la petite ville de Verrières et plus particulièrement son entrée chez les Rênal.
3;Les Misérables;Victor Hugo;L'action se déroule en France au début du XIXe siècle encadrée par les deux grands combats que sont la Bataille de Waterloo (1815) et les émeutes de juin 1832.
4;Candide;Voltaire;Candide est un jeune garçon vivant au château du baron de Thunder-ten-tronckh. Il a pour maître Pangloss, philosophe qui enseigne la « métaphysico-théologo-cosmolo-nigologie »
Ensuite, il nous faut construire l'objet associé au livre. L'objet "Book" ne doit s'occuper que de la récupération et l'enregistrement de livres. Il doit gérer une interface claire pour être ensuite utilisé dans les contrôleurs. Nous allons donc créer l'interface "IBook.au3" dans le dossier "model/".

Tout d'abord, voici la liste des fonctions dont nous aurons besoin :
- Récupérer un livre en fonction de son titre.
- Récupérer un livre en fonction de son identifiant.
- Lister tous les livres.
- Gérer les attributs d'un livre.
► Afficher le texteIBook.au3
Une fois cette interface définie, il faut l'implémenter. Copiez votre interface et créez le fichier "Book.au3". Ce fichier sera l'implémentation de votre interface. L'interface ne sera pas compilée, elle servira uniquement de documentation pour votre code.
► Afficher le texteBook.au3
Voici une implémentation de l'interface IBook. Les variables ne sont pas réutilisées à l'extérieur de ce fichier. Seules les méthodes présentes dans l'interface doivent être utilisées.

L'implémentation utilise la méthode _ArrayInsertAndRedim(), qui se trouve dans le fichier "lib/UDF_ArrayUtils.au3".
► Afficher le texteUDF_ArrayUtils.au3
Nous avons construit le modèle, nous pouvons maintenant créer les vues et le contrôleur.

IV - Création des vues

Nous avons deux vues : "list.au3" et "show.au3". Ces deux fichiers sont placés dans le dossier "view/book/".

Gestion de l'affichage de la liste :
► Afficher le textelist.au3
Gestion de l'affichage des informations d'un livre :
► Afficher le texteshow.au3
Les vues ont 4 méthodes publiques :
- prepare(), qui permet de créer la fenêtre.
- setData(), qui permet de renseigner les données dynamiques de la fenêtre.
- show(), qui permet d'afficher la fenêtre.
- close(), qui permet de fermer la fenêtre.

Ces 4 méthodes devraient permettre au contrôleur de gérer l'ensemble de vos fenêtres.

V - Création du contrôleur
Nous arrivons au dernier élément de l'application : le contrôleur. Il fera le lien entre la vue et le modèle. Nous devons créer un contrôleur "book.au3" dans le dossier "controler/".
► Afficher le textebook.au3
Le contrôleur possède deux méthodes, qui correspondent à nos deux vues. Ces deux méthodes permettent de gérer l'affichage de nos vues.

VI - Conclusion
Voilà, le projet est terminé. Vous trouverez ci-joint à ce post le schéma de l'architecture finale et le code source de l'application.

Merci de laisser un commentaire pour donner votre avis sur les méthodologies que vous utilisez pour la programmation, ainsi que pour améliorer le contenu de ce tutoriel.



Cordialement,

Le docteur.
Fichiers joints
Library.rar
Codes sources du projet
(5.49 Kio) Téléchargé 294 fois
Library.rar
Codes sources du projet
(5.49 Kio) Téléchargé 294 fois
Architecture finale
Architecture finale
Modifié en dernier par Docteur le lun. 27 juin 2011 08:02, modifié 1 fois.

Avatar du membre
matwachich
Membre émérite
Membre émérite
Messages : 985
Enregistré le : lun. 19 oct. 2009 03:04
Localisation : Algérie
Status : Hors ligne

Re: [Tuto] Le pattern MVC et la POO avec AutoIt

#2

Message par matwachich » dim. 26 juin 2011 20:33

Excellent tuto!
Je crois que je programme un peut de cette manière sans le savoir!

En tout cas, je suis sure que ca servira à beaucoup, à moi en premier, car je compte refaire de zéro certains de mes logiciels avec cette méthode.
Sortons VW du coté obscure! - La curiosité est un vilain défaut! Cliquez ici

GaRydelaMer
Modérateur
Modérateur
Messages : 450
Enregistré le : mer. 18 mars 2009 22:12
Localisation : Montpellier
Status : Hors ligne

Re: [Tuto] Le pattern MVC et la POO avec AutoIt

#3

Message par GaRydelaMer » lun. 27 juin 2011 01:05

Bonsoir Docteur


excellent tuto !!! bravo

Pour la POO, tu as maintenant une UDF AutoItObject http://autoitobject.origo.ethz.ch/.

Je suis entrain de faire un projet avec c'est très sympa et simple a utiliser.

Tu crées tes objets à la volets en AutoIt bien sur en définissant propriétés et méthodes, ensuite tu les utilises comme les objets COM.

J'ai plusieurs objets pour créer du JavaScript dans une page IE pour générer des graphiques http://www.highcharts.com/ à partir de données issue de ADO (la encore un objets AutoIt). Je posterai ici le tout quand se sera terminer, mais ça fonctionne déjà (avis au amateur).

Avatar du membre
TommyDDR
Modérateur
Modérateur
Messages : 1819
Enregistré le : mar. 22 juil. 2008 20:55
Localisation : Nantes
Status : Hors ligne

Re: [Tuto] Le pattern MVC et la POO avec AutoIt

#4

Message par TommyDDR » lun. 27 juin 2011 09:41

He beh, le docteur ne chôme pas !

Je ne regrette pas de t'avoir fait connaitre le forum :D

Excellent tuto !
3.1415926535897932384626433832795028841971693993751058209749445923078164062862089986280348253421170679

Avatar du membre
ZDS
Membre émérite
Membre émérite
Messages : 554
Enregistré le : jeu. 10 juin 2010 09:35
Localisation : 22300 Cul-d'chouette Langue-de-vache
Status : Hors ligne

Re: [Tuto] Le pattern MVC et la POO avec AutoIt

#5

Message par ZDS » lun. 27 juin 2011 14:12

Bonjour Docteur,

Avec un tuto pareil, j'espère que plus de gens auront la bonne volonté de prendre un peu de temps et un peu de rigueur à coder à la façon POO : tutoriel excellent dans le concept, facile à comprendre, avec un exemple accessible pour tous, et simple à mettre en oeuvre.

Même les interfaces (concept impossible à vraiment mettre en pratique ici) ont une certaine utilité, franchement chapeau Docteur !
Je termine juste sur un micro bémol, l'exemple fourni en pj comporte une erreur, ligne 23 de ton contrôleur, model_book_getAllBookIds() ne prend aucun paramètre normalement.

Très beau boulot, Géronimo et Allons-y en même temps ! (je dirai même : "bow ties are cool !")

A bientôt !

ZDS
ZDS : Chef de projet du nAiO (logiciel AutoIt gratuit sous licence CC 4.0 BY-NC-SA)
Tout problème a une solution, donc si il y a pas d'solution, c'est qu'il y a pas d'problème !

Répondre