Animation interactive sous flash

Animation interactive sous flash - Flash/ActionScript - Programmation

Marsh Posté le 01-10-2007 à 20:53:56    

Bonjour à tous !  
 
Je suis actuellement en classe de 1ere S et me voilà soudain confronté aux TPE (je suis sûr que tout le monde est passé par là ^^).  
Considérant mes bases en HTML, CSS, et Flash suffisante je me suis lancé dans le projet de présenter mon TPE sous forme de site web.  
D'autre part, j'ai choisi un format un peu spécial, puisque je souhaite réaliser ce site sous forme d'un trajet de tram/train, jusque là rien d'exceptionnnel.  
Les difficultés ont commencé lorsque j'ai entrepris de réaliser le plan de cette fameuse ligne (Premier arrêt : Introduction, etc).  
Je me suis alors rendu compte que mes "bases" en Flash étaient complétement inutiles quand il s'agit de réaliser quelquechose d'intéractif et non pas une simple interpolation de mouvement.  
Le principe est simple en réalité : J'ai réalisé une ligne représentant le trajet, puis différent arrêts sous forme de clips au cours de cette ligne, le otut sur un même calque. Un autre objet (une sphère) représente le véhicule. Dès lors je suis incapable de faire en sorte que lorsqu'on appuie sur un arrêt, l'objet en question se déplace jusqu'à cet arrêt, et ainsi de suite pour chacun des autres arrêts.  
Une chose simple mais qui m'a fait passer des nuits blanches sur mon PC ^^.  
De plus, les tutoriaux proposent en général des explications pour des choses plus générales, mon projet étant spécifique je n'ai pas réussi à trouver la moindre aide sur le net.  
C'est pourquoi je m'en remet à vous, qui vous vous débrouillez certainement beaucoup mieux que moi.  
Merci d'avance, tout ce que vous pourrez répondre m'apportera plus que mes recherches certainement inutiles et sans fin.


---------------
Être ou ne pas être, peu m'importe du moment que je suis ...
Reply

Marsh Posté le 01-10-2007 à 20:53:56   

Reply

Marsh Posté le 02-10-2007 à 03:17:57    

En supposant que ton objet se deplace sur l'axe des x, il faut jouer sur la propriété "_x" de ton clip.
Donc tu commences par transformer ta sphere en MovieClip (F8) et tu lui donnes un nom d'occurence (dans les propriétés).
Tu fais pareil avec le clip qui représente l'arret.
Ensuite sur le calque 1 de l'image 1 de ton scenar tu places ce code en remplacant les noms par tes valeurs

Code :
  1. onEnterFrame = function () {// un code qui te permet de lancer une action a l'affichage de ta page
  2. if (nomDoccurenceVehicule._x >= nomDoccurenceStation._x){
  3. this.onEnterFrame = null;// on arrete le enterframe quand le vehicule arrive au niveau de ta station
  4. }else{ //sinon on deplace le vehicule
  5. nomDoccurenceVehicule._x +=1;
  6. }
  7. }


C'est un peu crade comme code et c'est pas complet bien sur. Mais si t'arrives déjà à faire ça, ça sera bien.
 :hello:


Message édité par Zedlefou le 02-10-2007 à 03:18:38

---------------
Jeu de simulation Boursière - Version BETA - https://www.facebook.com/wildstocks
Reply

Marsh Posté le 02-10-2007 à 07:29:03    

En effet, "_x" semble être adéquat, cependant, j'ai du faireun truc pas comme il faut puisque l'effet attendu est loin d'être obtenu.  
Petit descriptif : Mon train se déplace bien sur l'axe des abscisses (x). J'ai donc un premier calque (Calque 1) avec ma ligne horizontale et sur le même calque et la même image les différents clips qui constituent les différents arrêts (à savoir que chacun de ces clips est de forme carrée et contient un texte en diagonale ; les limites du clips ne correspondent donc pas tout à fait aux délimitations réelles des arrêts).
Le second calque (Calque 2)contient le clip "tram".
J'ai donc deux calques, tous les deux constitués d'une seule image.
J'applique ensuite le code que tu m'as donné à la frame 1 du calque 1 ; ce qui me donne :
[cpp]onEnterFrame = function () {
if (tram._x >= sommaire._x){
this.onEnterFrame = null;
}else{
tram._x +=1;
}
}[/ccp]
 
Le résultat : lors de la prévisualisation, le train se déplace de son point de départ à un place proche du clip sommaire mais pas réellement précise, et le tout sans que je lui ait demandé la quelconque action !
 
Peut-ête ais-je mal compris quelquechose ....  :??:


Message édité par ChebaM le 02-10-2007 à 07:32:10

---------------
Être ou ne pas être, peu m'importe du moment que je suis ...
Reply

Marsh Posté le 02-10-2007 à 17:27:50    

Pour la précision c'est à toi de faire les ajustements. Par exemple, que le point de "registration" (en anglais, je sais pas comment on dit en fr) de ton clip soit bien au centre de celui-ci.
Tu le vois quand tu crées ton clip :
http://www.oman3d.com/tutorials/flash/cursor_bc/select_cursor_convert_symbol.gif
Sinon tu fais la méthode de barbare :
if (tram._x >= sommaire._x+10){

 

Enfin pour demarrer l'action quand il faut, tu dois mettre tout le code que je t'ai donné dans une fonction
function maFonct(){
...BLABLABLA
}

 

Ensuite tu ajoutes un evenement de clic sur ton bouton :
sommaire.onRelease = function (){
   maFonct();
}
Tu peux aussi faire :
sommaire.onRelease = maFonct;

 

les 2 fonctionnent


Message édité par Zedlefou le 02-10-2007 à 17:29:04

---------------
Jeu de simulation Boursière - Version BETA - https://www.facebook.com/wildstocks
Reply

Marsh Posté le 02-10-2007 à 17:41:31    

Ok, je ne connaissais pas toutes ces petites subtilités, merci beaucoup, j'essaye tout ça ^^


Message édité par ChebaM le 02-10-2007 à 21:01:48

---------------
Être ou ne pas être, peu m'importe du moment que je suis ...
Reply

Marsh Posté le 02-10-2007 à 21:08:37    

=> Le code marche très bien avec tout ce qui faut, et l'animation bouge parfaitement en ce qui concerne le clip "sommaire".
Cependant j'ai essayé d'appliquer le même code aux autres clips constituant les autres arrêts et ça marche moins bien.
 
Faut-il préciser quelquechose dans le code ?
 
=> Je pense avoir ciblé le problème : Le "tram" n'est pas en mesure de faire marche arrière, autrement dit il n'avance que de gauche à droite.
 
Est-ce normal ?


---------------
Être ou ne pas être, peu m'importe du moment que je suis ...
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed