Vous devez connaître l'utilisation des variables, quelques
notions de mathématiques et les guides de déplacement.
Principe :
Comme vous avez pu le remarquer avec des logiciels de graphisme
tel que Photoshop où cet effet est très souvent
présent ; tous les cercles qui composent ce halo appartiennent
a une même droite. Le but vas donc être de trouver
la fonction mathématique qui va permettre à flash
de calculer la position des éléments de ce halo
en fonction de deux paramètres : le centre de rotation
du halo et le point de lumière.
Rappels mathématiques :
Les coordonnées des points d'une droite peuvent être
résumées avec une équation du type : y=m*x+p
(x et y sont les coordonnées d'un point, m et p sont deux
valeurs qui caractérisent la droite).
Pour simplifier nous allons considérer que un des points
de cette droite est l'origine du repère (x=0, y=0). L'équation
de la droite est alors y=m*x. En ouvrant ses vieux livres de Math
de 3e que la valeur de m est donnée par la relation :
x1 et y1 étant les coordonnées d'un
point et x2 et y2 les coordonnÈes d'un autre point. Nous
connaissons les coordonnées d'un point : l'origine (x=0,
y=0) dont tous les points devront répondre a la formule
suivante :
xorg, yorg : coordonnées du point de centre
de la lumière
x, y : coordonnées d'un autre point.
Nous allons donc prendre 2 points : l'un est définit
par la position de la souris ou par un guide de déplacement
et l'autre est calculé grâce à cette formule
ce sont les deux points extrêmes de l'effet les autres points
sont définis en les disposant sur cette droite.
En Pratique ...
Dans l'explication ci-dessus je me place dans un
repère mathématique ou le point (x=0, y=0) se trouve
généralement au centre mais sous flash ce point
se trouve en haut à gauche de la scène c'est pour
cela que lors du calcul nous devrons faire une translation pour
cela nous devons définir 2 variables sur la scène
(définies sur la première image clé) qui
seront appelé plus tard :
Set Variable: "larg" = "320"
Set Variable: "haut" = "240"
Nous devons placer également sur la scène le point
de lumière : c'est un movie clip dont l'instance porte
le nom : org
Le moteur de l'animation est un movie clip dont le centre est
en x=0, y=0 (en haut à gauche) de la scène. dans
ce movie clip on positionne n movies clips qui constitueront les
éléments du halo. Les instances de ces movies clips
ont pour nom une valeur numérique allant de 1 à
n.
Dans ce movie clip on doit rajouter un layer avec 2 images clé
(on doit également ajouter 1 image au layer contenant les
éléments du halo pour qu'ils soient toujours visible)
Dans la deuxième image clé on met
le code suivant : Go to and Play (1)
Dans la première on met le code suivant :
Set Variable: "a" = "0"
Set Variable: "x" = GetProperty ("/org", _x )
Set Variable: "y" = GetProperty ("/org", _y )
Set Variable: "nr" = "9"
Loop While (a<nr)
Set Variable: "a" = a+1
Set Property (a, X Position) = (((/:larg/2)-x)*((a-2)/((nr+1)/3)))+x
Set Property (a, Y Position) = (((/:haut/2)-y)*((a-2)/((nr+1)/4)))+y
End Loop
Voici les explications :
Initialisation de la variable de comptage Set Variable: "a" = "0"
On récupère les coordonnées x et y du point de lumière
Set Variable: "x" = GetProperty ("/org", _x )
Set Variable: "y" = GetProperty ("/org", _y )
On initialise une variable nr prenant le nombre d'éléments
Set Variable: "nr" = "9"
On commence une boucle qui comptera de 1 a nr
Loop While (a<nr)
Set Variable: "a" = a+1
Positionnement de l'élément portant le nom de la valeur de a
Set Property (a, X Position) = (((/:larg/2)-x)*((a-2)/((nr+1)/3)))+xSet Property (a, Y Position) = (((/:haut/2)-y)*((a-2)/((nr+1)/4)))+y
Ce dernier calcul nécessite quelques explications :
((/:larg/2)-x) : donne la coordonnée x du
point opposé au point de lumière en partant du centre
de l'écran
((/:haut/2)-y) : donne la coordonnée y du
point opposé au point de lumière en partant du centre
de l'écran
((a-2)/((nr+1)/3)) : permet de disposer les éléments
en fonction de leur numéro ( le a-2 permet de placer 1
élément derrière le point de lumière).
BRAVO !! Vous avez réussi a suivre jusque là
!! je vous l'accorde ce n'est pas très évident mais
pour réaliser ce genre d'animation il faut toujours commencer
par faire simple : je n'ai pas "pondu" cette fonction
comme ça !!
