ActionScript Facile Chapitre 1 Pourquoi créer des composants graphiques ?

Pourquoi créer des composants graphiques ? Après tout, ce qui est graphique est censé revenir de droit aux graphistes non ? Alors pourquoi un développeur irait s'ennuyer avec cela ?

En vérité, il existe une multitude de bonnes raisons et je vais vous montrer l'utilité de développer des composants graphiques génériques et réutilisables.

Pour commencer, nous allons aborder le thème de la réutilisation du code source, chose qui devient essentielle dès que l'on commence à vouloir développer des applications avec interfaces utilisateur.

Avant tout et pour commencer, nous allons définir clairement ce qu'est un composant graphique.

Un composant graphique est un morceau de code source qui va nous permettre d'offrir à l'utilisateur une information ou une interaction sous forme graphique. Cela peut aller de l'infobulle à la barre de défilement (scrollbar). Ce code source se veut réutilisable et en général skinnable, c'est-à-dire que l'on peut personnaliser son apparence et donc changer le côté graphique autant de fois qu'on le désire.

Maintenant que nous avons fixé les limites de ce qu'est un composant graphique, nous pouvons nous intéresser à ce qui fait qu'ils sont si utiles.

Pour cela nous allons nous figurer une scène classique de début de projet : Tom est développeur, il doit mettre en place un formulaire permettant à ses utilisateurs de créer leur CV en ligne. Son chef de projet vient le voir et lui demande de commencer le développement de l'application tout de suite. Le problème c'est qu'aucune charte graphique n'a été fournie et que le code qui permet d'enregistrer les CV en base de données est déjà prêt. Il se demande donc à juste titre ce qu'il va pouvoir faire, car il a pris l'habitude de reprendre les chartes des graphistes et développer ses fonctionnalités en mélangeant le fond et la forme.

Voilà un problème que rencontre tout programmeur débutant, en effet, il n'est pas naturel de dissocier les éléments graphiques du code. Cela demande une certaine pratique de raisonnement dans l'abstrait, or raisonner dans l'abstrait c'est comme tout, ça se travaille.

Voyons comment Tom peut se sortir de ce pétrin et avancer le développement sans charte graphique, et ce, de manière intelligente.

Il a obtenu une liste des fonctionnalités de ce formulaire, il prend donc une feuille et un crayon et remarque qu'il va devoir coder au moins trois ou quatre boutons, d'aspects différents certes, mais les fonctionnalités resteront les mêmes.

Il se rend compte également que toutes les informations doivent tenir sur une page, mais que si l'on est un peu pointilleux, les champs de texte libre peuvent prendre énormément de place. Il va donc falloir masquer le contenu qui sort des limites et le faire défiler à l'aide d'une barre.

Tom va donc coder les fonctionnalités, comme le défilement et les différents états d'un bouton, toutefois son code ne devra dépendre d'aucun graphisme tout en laissant une possibilité de personnaliser l'apparence du composant. Ainsi, quelle que soit la charte graphique qu'on lui fournira, il aura juste à l'intégrer sur chaque bouton et sur chaque scrollbar.

Voici donc le premier intérêt des composants graphiques, la possibilité de les réutiliser. Ils permettent de gagner du temps, car une fois créés, il n'y a plus matière à revenir dessus. Cela demande du temps et de l'expérience pour créer des composants efficaces réutilisables partout.

En général, les composants sont efficaces lorsque vous arrivez à les utiliser sur 3 ou 4 projets différents sans aucune retouche à réaliser.

Nous allons maintenant aborder brièvement la deuxième bonne raison de créer des composants graphiques qui découle inévitablement de la première, la facilité de développement des applications avec interfaces utilisateur.

Les interfaces utilisateur sont parmi les choses les plus pénibles à réaliser pour un développeur et ce pour plusieurs raisons en voici une liste non exhaustive :

• en général il nous est souvent demandé de changer telle ou telle chose à la dernière minute, et ce, de façon répétée ;
• le rendu fonctionnel, de manière générale, n'est pas aussi bon que ce à quoi l'on s'attendait ce qui entraîne des ajustements de bouts de chandelles. Nous avons tous vécu la scène du graphiste qui vient se poser à côté de vous « pour 5 min » et qui repart une heure après, tout content d'avoir bataillé sur chaque pixel. Notez cependant que cela ne l'empêchera pas de reprendre entièrement le concept visuel, et ce, dès le lendemain ;
• il y a clairement un manque de défi technique dans les interfaces utilisateur, en général quand on en a fait deux ou trois on les a toutes faites et les suivantes nous paraissent insipides. Raison de plus pour y passer le moins de temps possible et occuper son esprit avec des choses plus motivantes.

Nous avons déjà vu qu'une fois correctement développés, les composants graphiques peuvent être réutilisés à l'infini et personnalisés à souhait. Ce qui résulte en un gain de temps considérable dans le développement d'une application.

Pour reprendre l'exemple de Tom, admettons qu'il ait déjà créé ses composants « scrollbar » et « boutons » lors d'un projet précédent, il pourra raisonnablement répondre à son responsable : « écoute, j'ai déjà une liste de composants graphiques prêts à l'emploi, je vais plutôt passer du temps sur autre chose ».

Et voilà, Tom a gagné du temps, son responsable est content et lui aussi.

En conclusion, nous pouvons affirmer qu'il y a énormément d'avantages à créer des composants graphiques, et ce, quel que soit le type de projet pour lequel nous sommes amenés à travailler.

Nous avons vu que les composants représentent une manière élégante et astucieuse de développer des interfaces utilisateur, et que, de par leur nature réutilisable, ils permettent de gagner du temps de développement considérable.

Dans les prochains chapitres, nous verrons ensemble comment créer des composants et comment penser leur organisation.

Ensuite, nous enchainerons avec une liste d'articles à thème, chaque article traitant de la création d'un composant spécifique, et avec le code source bien évidemment.

À bientôt.

Je tiens ici à remercier La Rédactrice Kalyparker pour la mise au gabarit de l'article original au format Developpez.com.

Merci beaucoup à l'équipe Developpez.com de contribuer à la diffusion du Framework ActionScript-Facile.