Forums Développement Multimédia

Aller au contenu

- - - - -

[Tuto Débuter] Lier des informations à des Clips (ou autre objets)

TUTO

7 réponses à ce sujet

#1 Billyben

    KlouChiPonshoñistäs

  • Moderateur
  • PipPipPipPipPipPipPipPip
  • 2597 messages

Posté 20 July 2011 - 15:04 PM

Bonjour, petit tuto avec quelques méthodes pour lier des informations à des clips (ou d'autres objets au demeurant).


Il est très courant de vouloir lier des informations à des objets, et notamment à des objets avec lesquels l'utilisateur peut interagir. Il existe de nombreuses manières de résoudre ce problème, et tout dépend des objets et de votre projet (notamment de la version du player). Nous allons donc voir quelques façons d'y parvenir.

Nous avons régulièrement besoin de conserver et de retrouver différentes informations (à prendre au sens large) correspondant à un objet précis. Par exemple, vous chargez un fichier xml dont les nœuds contiennent l'url d'une image, avec un titre, un texte informatif sur l'image et une adresse d'une page vers laquelle il faut diriger votre visiteur au clic sur cette image. Dans un autre cas, ces informations proviennent d'une base de données. Bref, vous pouvez imaginer beaucoup de situations où vous devez créer un lien entre des informations et un objet. Or, comment retrouver ces informations à partir du clip (de la miniature ?) que vous affichez ?

2 approches :
  • Classique - avec des MovieClip - avec un/des Array(s) - avec un Dictionary
  • POO - une classe perso pour les bouton - une classe gestionnaire des liens info/bouton

........lire la suite.........

#2 Nataly

    Community Jane

  • Moderateur
  • PipPipPipPipPipPipPipPip
  • 5783 messages

Posté 23 July 2011 - 14:09 PM

Selon le bon vieux principe "je ne menace jamais en vain", me voilà avec mon retour de ronchonneuse.



Autant être franche (vu que je ne sais pas faire autrement) la première impression a été mitigée, à la fois une sensation de grande confusion et le sentiment que tu devais traiter là d'un sujet bien utile, puisque se proposant de répondre à une question récurrente, précises-tu en intro.

Sûr que le premier écueil c'est le titre.
Et une fois dit ça on n'est pas avancé, étant moi même très pas douée du tout du titre, je n'ai pas de proposition à faire.
D'hab c'est Lilive qui proposait la reformulation magique. A l'impossible… j'avais prévenu ;)

N'empêche que le propre d'une communauté c'est d'être plusieurs, alors "avisss à la population", Si quelqu'un trouve le titre qui tue, qu'il n'hésite pas à proposer (à considérer que celui-ci ne convienne pas, ce n'est somme toute que mon point de vue)



En ce qui concerne le tuto lui même, en première lecture je n'ai pas compris où tu voulais en venir. C'était très confus pour moi, et j'ai du procéder à l'envers : lire et comprendre le code pour suivre les explications.
A ta décharge je suis harassée ces derniers temps et ça me rend con (si, il faut appeler choses par leur nom).

Néanmoins, profitons de ce grand moment d'indigence intellectuelle pour décortiquer le pourquoi de ce sentiment, et commençons par les arguments les plus sujets à cautions.
Que tu ne les partages pas et ne les prennes pas en considération serait de bonne guerre, mais analogie pour analogie, ce n'est pas pcq une bataille est perdue qu'il faut abandonner la cause.
Je pense donc qu'une des premières (discutables) raisons de la difficulté à entrer dans ton raisonnement est le jargouinage anglophnonisant. Remplacer un substantif sur deux par sa traduction anglaise génère une espèce de porridge vaguement signifiant qui entrave considérablement les facultés cognitives, en tous cas les miennes.

Pour moi un tableau est un tableau et la classe qu'on utilise c'est Array.
Dire qu'on référence dans un array n'est pas plus signifiant que dire qu'on référence dans un tableau. Mélanger dans la même phrase les substantifs un coup anglais en coup français, laisse une sensation brouillée, d'autant que quelquefois tu parles d'object et quelquefois d'objet, une chaine est toujours une string, mais un chiffre ne devient pas Number…
Bon, je descends de ma Rossinante perso.

Pour en finir avec le chapitre expression écrite : t'inquiète, je viendrai passer le coup de plumeau qui va bien sur les inévitables coquilles, mais fais gaffe tout de même à l'accord des participes, pcq pour le coup ça génère des confusions :
Quand je lis : "des informations propres à un bouton que j'ai référencé dans des objets" : je comprends que c'est le bouton que tu as référencé dans des objets… Ce qui forcément flanque le bronks dans ma pov tête, un bouton référencé dans des objets… O.O , alors je reprends la phrase, j'en appelle à mon bon sens, je vérifie ds le code…
Tu vois, ce genre de détail n'est pas si anodin ;)







Une fois ces écueils dépassés quid du corps de la bête ?

Bonne idée, je le maintiens, de dédier un petit texte à cette problématique.

Dans l'ordre de lecture maintenant les quelques réflexions qui me viennent

Un bouton sur la scène

Le titre parle de bouton et tu attaques par un objet de type MovieClip ;)
Il n'empêche que la ruse d'utiliser la caractéristique dynamique de la classe me semble toujours aussi bonne sur de petits projets.

du coup :
• Peut-être peux tu raconter la ruse de la propriété buttonMode pour faire d'un clip un bouton et vices inversés ? Ou renvoyer au chapitre l'expliquant par le menu du tuto addEventListener ?
• Pourquoi compliquer tant le code ? Dans ce contexte un bête code de ce type (juste dessous) me semble plus défendable : pas plus de lignes, moins d'objets, facile à lire, aussi maintenable et évolutif, et pas de confusion entre nom (prop inventée par toi) et name (prop native)

b1.valeur=0
b1.valeur=5
b1.valeur=10

for (var i:int=1; i<4; i++) {
        this["b"+i].addEventListener(MouseEvent.CLICK, clicHandler);
}

function clicHandler(ev:MouseEvent):void {
        var leBouton:MovieClip = MovieClip(ev.currentTarget);
        monTextField.text= "je suis " +leBouton.name + " de valeur :" + leBouton.valeur;
}

pour comparaison, ce que tu proposes :

var boutonArray:Array=[b1, b2, b3];
var infoArray:Array=[{nom:"bouton 1", valeur:0},
                     {nom:"bouton 2", valeur:5},
                     {nom:"bouton 3", valeur:10}]
 
for (var i:int=0; i<boutonArray.length; i++){
        boutonArray[i].info=infoArray[i];
        boutonArray[i].addEventListener(MouseEvent.CLICK, clicHandler);
}
 
function clicHandler(ev:MouseEvent):void{
        var info:Object=ev.currentTarget.info
        monTextField.text="je suis "+info.nom+" de valeur :"+info.valeur;
}


Du coup le sous chapitre suivant (Si vous avez posé sur la scène un objet qui n'hérite pas de MovieClip) prendrait toute sa valeur, là on est bien obligé de passer par du tableau…

[edit]
cette phrase me reste obscure :

Citation

J'ai créé un symbole de type Clip, ce qui en fait des objets de type “MovieClip”

Est-ce que tu dirais "j'ai peint une fleur sur un papier ce qui en fait des dessins" ?
peut-être voulais tu dire que créer un symbole en choisissant clip dans la liste "type" revient à créer un objet de type MovieClip ? :roll:
[pas taper :?]


Utilisation de test conditionnels
(au passage je ne vois pas bien comment un test peut être autre chose que conditionnel…)

Là que fais tu ? tu colles les boutons dans un tableau et tu en crée un deuxième (de tableau) dans le quel tu références des objets (Objects) dont les propriétés seront celles qu'on souhaite récupérer sur les boutons.
Dit autrement, les caractéristiques associées au bouton d'indice 1 sont stockées dans l'objet de même indice du deuxième tableau…

toi tu dis :
"On teste une des propriétés de l'objet qui émet l'évènement et on va chercher la bonne info"
Euhhh… on ne teste pas une des propriétés, on teste La propriété name.
Et comme tu n'as pas expliqué comment tu as construit les deux tableaux, sauf à lire le code on ne comprend pas le rapport…

'suis d'accord avec toi, c'est pas enthousiasmant comme façon de faire, et j'adore ton commentaire :)



Utilisation des 2 array précédents
Ah ah je rigole (mauvais fond mauvais fond :mrgreen: ) du coup, t'es bien emmer… embêté pour l'accord : deux array avec ou sans "s" ? Evidemment si t'avais écrit deux tableaux, ça aurait fait un souci de moins :P

J'aurais mis le "donc etc… " avant le code. Je veux dire, tant qu'à expliquer ce qui va se passer, autant le faire avant qu'on se soit décortiqué le code pour comprendre… ça se discute, pour le coup c'est un parti-pris.


[ tiens pendant que j'y pense, pour faire ma chieuse : c'est mal de mettre un calcul dans le deuxième paramètre d'un for (truc.length)]



utilisation d'un nouvel Array
j'aurais écrit "d'un troisième tableau"

là j'avoue que je n'ai pas compris l'explication.
Du code que je lis, tu fais un tableau associatif en fait ?
On est d'accord que la doc en déconseille l'emploi ? ;) (tu peux peut-être le dire ?)

Donc tant qu'à faire, l'idée suivante d'utiliser carrément un objet me semble plus défendable. Et là on sent que tu fatigues, tu torches l'explication encore plus vite.
En fait plus on avance plus tu perds ton public de vue. (j'y reviendrai)

Utilisation d'un Dictionary
Eh oui, bonne idée le dictionnaire, et bonne idée de faire un petit récap de ce que c'est que cet objet qui peut faire peur :Hola: Je dois dire que la doc n'est pas cool sur ce thème, la première fois que j'ai ouvert, j'ai refermé croyant que c'était trop compliqué pour moi, alors que c'est bête comme chou.
Donc bienvenue, le paragraphe de démystification (par parenthèse, dans ma tête le Dictionnaire tient plus de l'Objet que du Tableau…)

Et merci de la précision limpide sur weakKeys ;)






L'approche POO

L'idée, c'est donc de contourner le côté pas dynamique de la classe Simplebutton.
Genre : comment ça on ne peut pas ajouter des propriétés à un boutons ?! Ah ah ! regarde bien, je défouraille une classe de deux lignes pour étendre les possibilités et zou ! on n'en parle plus :D
Très bien, très bonne idée, et du coup même remarque qu'en intro avec un MovieClip dynamique, pourquoi passer par les deux tableaux ?

[mode tétra chieuse]Comment une classe peut-elle être interne ? Je dis ça à cause du titre : classe externe… [\]
Utiliser une classe qui va gérer le lien Bouton/info
Là j'avoue que j'ai abandonné. Pcq j'ai toute confiance en la qualité du code et que de ce que j'ai compris de l'intro tu es juste entrain de faire du MVC…
… et du coup il est où ton public ?
Débutants, tu dis en intro… Pff pour solutionner une pauvre histoire d'infos associées à des boutons je trouve qu'on sort le bazooka, non ?
Ce qui en soi n'est pas grave, c'est intéressant de faire le tour de problème et des approches diverses et variées pour parvenir au même résultat. J'ai peur néanmoins qu'un débutant qui tombe là-dessus pour résoudre une problématique précise, ne sache plus à quel saint se vouer.
Peut-être une conclusion synthétisant les choses (et proposant la solution qui te semble la plus adapté ) serait-elle bienvenue ?




Pour conclure à mon tour (si, si, je peux me taire) je retiens de ce tuto qu'il est très complet :Hola: et permet un excellent tour d'horizon pour qui est déjà bien à l'aise.

Je crains qu'un débutant qui ne s'y retrouve pas d'une problématique somme toute assez simple, se voit un rien noyé dans la masse d'infos et la désinvolture avec laquelle tu jongles avec des tableaux de tableaux d'objets.

On est bien d'accord qu'il s'agit, je pense, surtout d'une question de formulation des explications.
On est bien d'accord aussi que c'est chouette (expression de Lilive… si tu nous regarde…) de faire un tour d'horizon aussi complet, ça me fait penser au très bon tuto gestion des touches :)

Ce que j'aime dans ton approche des choses c'est son côté non péremptoire. Coder c'est beaucoup décider/évaluer/choisir et ce type de texte donne toutes les billes pour ce faire.
Mon côté Sartrien est ravi (L'homme est une liberté qui choisit…), mon goût pour les choses légères et ludiques comblé : tu fais partie de ceux qui savent faire sérieusement sans se prendre au sérieux (les mal embouchés outre atlantique prétendent que les français font tout le contraire. Ah ah ! preuve que non ;)) Et pour finir je suis toujours aussi fan de tes formules et analogies (souple comme un cailloux me réjouis encore).

Donc voilà pour mes impressions. Je me suis bien appliquée à être aussi intransigeante que le regretté qu'on ne cite plus… En gros si tu me trouves trop dure, sache bien que c'est la faute de l'absent !

++ :)
Le savoir est le seul bien qui s'accroit quand on le partage
une tartine de tutos

#3 Billyben

    KlouChiPonshoñistäs

  • Moderateur
  • PipPipPipPipPipPipPipPip
  • 2597 messages

Posté 23 July 2011 - 15:06 PM

Salut Nataly! Merci pour le long commentaire!!
J'ai voulu rester général dès le départ. Du coup j'ai choisit d'avoir des objet "Object" qui contiennent un peu d'info pour symboliser le fait qu'on puisse mettre à la place n'importe quoi. On voit souvent des personnes qui load chargent un xml et qui veulent conserver avec leur image la valeur de certain noeud, des personnes qui chargent des fichiers texte, d'autre des entrée de base de donnée.... bref à peu près n'importe quoi... du coup utiliser des objet "Object" me semblait rassembler au plus large... Pour ce qui est des info que j'ai référencé dans ces objets, j'aurais peut-être pas du mettre un genre de nom, histoire de ne pas être redondant avec la propriété "name".... mais c'est juste là pour l'exemple..

Sinon, je vais peut être virer purement et simplement l'emploi de 'Bouton', qui en fait n'est pas traité là... juste des objets, ici graphiques.... Ca simplifiera peut être le propos...

Par contre pour la peine, je devrais rajouter un pitit chapitre d'intro plus complet et explicatif sur ce qui va suivre, et notamment préciser que les objet "Object" ainsi que les 2 array tableaux ne sont là que comme source d'information, et qu'ils se substituent à tout le schmilblic de loader et autre joyeusetés que les lecteurs peuvent avoir mis en place.. Les array tableaux eux me permettent de travailler avec une boucle, pour reproduire le parcours d'un xml par exemple. En outre, le travail dans la boucle, abstrait, est en général plus difficile pour les débutant qu'une déclaration/valorisation directe.

Sinon, dans l'absolue, pour les test conditionnels, on peux tester n'importe quel propriété, pourquoi pas "X"? (on sait jamais......), bref le principe est juste d'avoir quelque chose de propre à l'objet testé......

Sinon, je vais nettoyer les abus d'anglicisation...!

Et array au pluriel, peut être avec un "x" : "des arrayx".... ça pèterais le score au scrabble ça!!! (ou alors des arraux....)


Donc je vais revoir tout ça:!!

@ pluche Lililivette!!

#4 Nataly

    Community Jane

  • Moderateur
  • PipPipPipPipPipPipPipPip
  • 5783 messages

Posté 23 July 2011 - 15:22 PM

Voir le messageBillyben, le 23 July 2011 - 15:06 PM, dit :

On voit souvent des personnes qui load chargent un xml et qui veulent conserver avec leur image la valeur de certain noeud, des personnes qui chargent des fichiers texte, d'autre des entrée de base de donnée.... bref à peu près n'importe quoi... du coup utiliser des objet "Object" me semblait rassembler au plus large...

[…]


Par contre pour la peine, je devrais rajouter un pitit chapitre d'intro plus complet et explicatif sur ce qui va suivre, et notamment préciser que les objet "Object" ainsi que les 2 array tableaux ne sont là que comme source d'information, et qu'ils se substituent à tout le schmilblic de loader et autre joyeusetés que les lecteurs peuvent avoir mis en place..


Et voilà ! Tu m'ôtes les mots du commentaire : c'est ça qu'il faut faire une intro qui contextualise… je voulais même te proposer (si tu les as en tête) de mettre un lien ou deux sur les sujets du forum qui t'ont donné l'idée…

Et du coup ça va faire un tuto plus adapté auquel renvoyer pour les histoires de faux boutons (ou trucs assez basiques) que le chapitre du toto commis par moi sur la gestion d'événement. :Hola: Ce n'est jamais très satisfaisant de renvoyer à un bout de truc sans début et sans fin. :?



Citation

Et array au pluriel, peut être avec un "x" : "des arrayx".... ça pèterais le score au scrabble ça!!! (ou alors des arraux....)

Banane Banana! :lol:
Le savoir est le seul bien qui s'accroit quand on le partage
une tartine de tutos

#5 Billyben

    KlouChiPonshoñistäs

  • Moderateur
  • PipPipPipPipPipPipPipPip
  • 2597 messages

Posté 24 July 2011 - 10:46 AM

Hop, mise à jour du tuto, et petit changement du titre!

#6 Nataly

    Community Jane

  • Moderateur
  • PipPipPipPipPipPipPipPip
  • 5783 messages

Posté 25 July 2011 - 10:16 AM

Yes ! Merci ! \o/

J'ai donc fait mamie torchon (mais une seule fois, donc sûr qu'une poignée de coquilles s'y trouve encore), et j'en ai profité au passage pour virer les quelques anglicismes qui avaient échappé à ta vigilance (je te suis infiniment reconnaissante d'avoir souscrit à mon combat d'arrière garde :P).

J'ai aussi ajouté les \\ nécessaires à marquer les sauts de lignes. Pense bien à l'avenir qu'il ne suffit pas de sauter une ligne dans l'éditeur pour que ce soit "répercuté". Tout est tout collé sans les fameux "doubles antislash" :?

J'ai fait la typo : espace entre point d'exclamation et le mot qui le précède, pareil pour point d'interrogation et pas de points de suspension après "etc." (c'est une abréviation qui se suffit à elle même. Points de suspension ET "etc." c'est un pléonasme en quelque sorte ;))
Ces commentaires, sont à titre informatif à l'attention des éventuels autres auteurs qui voudraient faire leur culture ;) (et publier de beaux tutos tous propres :cool: )

Et du coup je me suis permises quelques très rares reformulations (quand vraiment j'ai pas pu lutter, et par abus de pouvoir :mrgreen:).
Il s'entend que tu rétabliras ce que tu voudras :)

En tous cas merci du papier !
Je sens qu'on va avoir de nombreuses occasions d'y renvoyer depuis le forum - et j'hésite même à te faucher la classe LinkManager (que je rebaptiserais c'est sûr) à titre de TP, je trouve que ça illustre bien l'intérêt de toutes petites classes dans un paquetage perso d'outils en tous genres ;)

:)
Le savoir est le seul bien qui s'accroit quand on le partage
une tartine de tutos

#7 Billyben

    KlouChiPonshoñistäs

  • Moderateur
  • PipPipPipPipPipPipPipPip
  • 2597 messages

Posté 25 July 2011 - 10:57 AM

Merki pour le ménage... j'en revient toujours pas de laisser passer certaines fôtes (tjrs fâché avec les "s"...), et le lien supplémentaire!
Et je ne me souviens jamais des doubles antislashs "\\" pour les saut de lignes...

#8 Nataly

    Community Jane

  • Moderateur
  • PipPipPipPipPipPipPipPip
  • 5783 messages

Posté 25 July 2011 - 11:13 AM

Voir le messageBillyben, le 25 July 2011 - 10:57 AM, dit :

Et je ne me souviens jamais des doubles antislashs "\\" pour les saut de lignes...

:lol: T'as qu'à te relire aussi ! Tu verrais bien que ça n'a pas la tête que tu attendais :lol:

blague dans le coin, je passais surtout pour ajouter les commentaires positifs et souligner que la ré-écriture de l'intro donne un vrai coup de vigueur au texte, du coup on comprend le pourquoi des boucles et autres trucs "compliqués" qui semblaient superfétatoires. Quant aux reformulations des explications (voire formulations tout court ;)) elles rendent le code bien plus accessible…

Et cette fois :jesors:
Le savoir est le seul bien qui s'accroit quand on le partage
une tartine de tutos



1 utilisateur(s) li(sen)t ce sujet

0 membre(s), 1 invité(s), 0 utilisateur(s) anonyme(s)

authorised training centre

Centre de Formation Mediabox - Adobe et Apple Authorised Training Center.

Déclaré auprès de la Direction du Travail et de la Formation Professionnelle

Mediabox : SARL au capital de 62.000€ - Numéro d'activité : 11 75 44555 75 - SIRET : 49371646800035

MEDIABOX, 23, rue de Bruxelles, 75009 PARIS

FFP