As2 - calage automatique des clips en mode noscale

Soyez le premier à donner votre avis sur cette source.

Vue 7 910 fois - Téléchargée 634 fois

Description

Voici une fonction de calage de clips lors d'un redimensionnement en mode "noScale".

J'ai développé cette source pour un site full-Flash sur lequel je travaille en ce moment.
J'espère qu'elle pourra faciliter la tâche de certains d'entre vous.

Et désolé pour l'AS2, je ne me suis pas encore mis dans l'AS3 ^^

Source / Exemple :


/*

EXPLICATION DE LA FONCTION :

function caler(clip,pacX,pasX,margeX,pacY,pasY,margeY);

- clip :	Le clip cible évidemment.

- pacX :	Le point d'alignement du clip sur l'axe horizontal.
			Valeurs possibles :
				G = bord gauche
				C = centre
				D = bord droit
				A = ancre du clip

- pasX :	Le point d'alignement sur la scène sur l'axe horizontal.
			Valeurs possibles :
				G = bord gauche
				C = centre
				D = bord droit

- margeX :	Décalage supplémentaire sur l'axe horizontal (voir exemples plus bas).

- pacY :	Le point d'alignement du clip sur l'axe vertical.
			Valeurs possibles :
				H = bord supérieur
				M = milieu
				B = bord inférieur
				A = ancre du clip

- pasY :	Le point d'alignement sur la scène sur l'axe vertical.
			Valeurs possibles :
				H = bord supérieur
				M = milieu
				B = bord inférieur

- margeY :	Décalage supplémentaire sur l'axe vertical (voir exemples plus bas).

  • /
// Réglage du mode d'affichage Stage.scaleMode = "noScale"; // Initialisation de l'objet s (scène) var s = new Object(); s.oWi = 800; // largeur originale de la scène s.oHe = 600; // hauteur originale de la scène // Il est nécessaire de rentrer manuellement les dimensions originales de la scène, // afin de pouvoir calculer correctement tout le reste. // La voilà... function caler(clip,pacX,pasX,margeX,pacY,pasY,margeY){ //---------------------------------------- // Objet Scène //---------------------------------------- s.Wi = Stage.width; // largeur actuelle de la scène s.He = Stage.height; // hauteur actuelle de la scène //---------------------------------------- s.G = (s.oWi-s.Wi)/2; // position x du bord gauche de la scène s.C = s.oWi/2; // position x du centre de la scène s.D = s.oWi-(s.oWi-s.Wi)/2; // position x du bord droit de la scène //---------------------------------------- s.H = (s.oHe-s.He)/2; // position y du bord supérieur de la scène s.M = s.oHe/2; // position y du milieu de la scène s.B = s.oHe-(s.oHe-s.He)/2; // position y du bord inférieur de la scène //---------------------------------------- // Objet Clip //---------------------------------------- var c = new Object(); c.A = 0; // si l'ancre est choisie comme point d'alignement, pas de décalage c.aX = clip._x; // position x de l'ancre du clip c.aY = clip._y; // position y de l'ancre du clip c.l = clip.getBounds(_root); // limites du clip /*---------------------------------------- Comme l'ancre d'un clip n'est pas toujours le point que l'on veut utiliser pour le placement, j'utilise getBounds afin de pouvoir calculer les coordonnées réelles des coins du clip. Ainsi, peut importe où vous placez l'ancre de vos clips, le calage se fera en fonction des paramètres choisis (regardez par exemple le clip bleu). ----------------------------------------*/ c.G = c.aX-c.l.xMin; // décalage sur x entre le bord gauche du clip et son ancre c.D = c.aX-c.l.xMax; // décalage sur x entre le bord droit du clip et son ancre c.C = (c.G+c.D)/2; // décalage sur x entre le centre du clip et son ancre //---------------------------------------- c.H = c.aY-c.l.yMin; // décalage sur y entre le bord supérieur du clip et son ancre c.B = c.aY-c.l.yMax; // décalage sur y entre le bord inférieur du clip et son ancre c.M = (c.B+c.H)/2; // décalage sur y entre le milieu du clip et son ancre //---------------------------------------- // Placement du clip //---------------------------------------- // Récupération des valeurs demandées en paramètres referenceSceneX = s[pasX]; referenceSceneY = s[pasY]; decalageClipX = c[pacX]; decalageClipY = c[pacY]; // Et enfin, placement du clip clip._x = referenceSceneX+decalageClipX+margeX; clip._y = referenceSceneY+decalageClipY+margeY; } // Création du tableau contenant les clips devant être recalés listeClips = new Array(); listeClips.push([joe,"A","G",10,"A","H",10]); listeClips.push([jack,"D","D",-10,"H","M",0]); listeClips.push([william,"C","C",0,"M","M",0]); /* J'ai opté pour cette technique afin de pouvoir facilement rajouter et/ou soustraire des clips à la liste. EXEMPLES concernant les valeurs passées en paramètres : Pour joe, cela aura pour effet de caler l'ancre du clip dans le coin supérieur gauche de la scène, avec une marge de 10px sur les côtés. Quant à jack, il sera calé à 10px du bord droit avec le haut du clip aligné au milieu de la scène. La fonction suivante va donc appeler la fonction caler() pour chaque clip enregistré dans le tableau listeClips.
  • /
function calerTout(){ for(i=0;i<listeClips.length;i++){ caler(listeClips[i][0], listeClips[i][1], listeClips[i][2], listeClips[i][3], listeClips[i][4], listeClips[i][5], listeClips[i][6]); } } // On ajoute l'écouteur qui va appeler la fonction calerTout // en cas de redimensionnement de la fenêtre var stageListener:Object = new Object(); stageListener.onResize = function(){ calerTout(); } Stage.addListener(stageListener); // Ici, en cliquant sur jack, on va ajouter sur la scène une occurence de averell // qui va être ajoutée au tableau listeClips avec ses propres paramètres de placement jack.onRelease = function(){ _root.attachMovie("averell","averell",_root.getNextHighestDepth()); listeClips.push([averell,"C","C",0,"B","B",-5]); calerTout(); } // Pour finir, on initialise les placements des clips // en appelant manuellement la fonction calerTout();

Conclusion :


Voilà, j'espère que j'ai été assez clair...

N'hésitez pas à me faire part de vos questions et de vos améliorations.
Merci ^^

Codes Sources

A voir également

Ajouter un commentaire

Commentaires

Messages postés
3
Date d'inscription
samedi 7 mars 2009
Statut
Membre
Dernière intervention
4 février 2010

C'est bon ça marche en préchargeant les swf avec un écouteur ! encore merci A+
Messages postés
209
Date d'inscription
mercredi 4 août 2004
Statut
Membre
Dernière intervention
6 avril 2009
1
Es-tu sûr d'appeler une première fois ta fonction de calage une fois que tous tes éléments sont chargés ? Si oui, je ne vois pas pourquoi ça fonctionnerait seulement lors du redimensionnement, puisque c'est la même fonction qui est appelée...
Messages postés
3
Date d'inscription
samedi 7 mars 2009
Statut
Membre
Dernière intervention
4 février 2010

Merci pour ta réponse rapide mais ça ne fonctionne pas. J'ai preloader mes swf et du coup c'est le calage qui ne fonctionne plus. J'ai également essayé de mettre un clip sur la scene (donc avec une taille connu) et d'importer un swf dedans mais il faut encore bouger la fenetre pour que le calage se fasse. Si tu vois une autre solution ?
Merci d'avance.
Messages postés
209
Date d'inscription
mercredi 4 août 2004
Statut
Membre
Dernière intervention
6 avril 2009
1
Si tes clips sont vides au départ, le calage ne peut pas se faire correctement car les dimensions finales du clip ne sont pas encore connues.
Il faut que tu appelles la fonction de calage après le chargement de tes clips, ou encore mieux, après le chargement de chaque clip si tu peux les écouter indépendamment.
Messages postés
3
Date d'inscription
samedi 7 mars 2009
Statut
Membre
Dernière intervention
4 février 2010

Salut et merci pour ce travail très utile.
Toutefois je voulais utiliser des empty movie clip pour charger des swf dans la page principale, et ça fonctionne mais uniquement après redimension de la page.
J'ai beau chercher je ne comprend pas pourquoi ?
Si quelqu'un a une idée !
Encore merci
Afficher les 10 commentaires

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.