Aller au menu - Aller au contenu

[Plan du site] Vous êtes ici --- > Le Site du Zéro > Les forums > Programmation > Autres langages > [Action Script 2.0] Réaliser un fondu enchainé > Lecture du sujet

[Action Script 2.0] Réaliser un fondu enchainé

Comment faut-il procéder ?

Vous devez être inscrit pour pouvoir poster des messages

RésoluLe problème de ce sujet a été résolu

Page : 1 
Auteur Message
1 visiteur sur ce sujet (1 anonyme)
Page : 1 
Hors ligne damienklotz # Posté le 06/07/2008 à 12:37:45
Avatar
Groupe : Membres
Bonjour,

Dans un spot publicitaire, je désire réaliser un fondu enchainé lorsque je clique sur un bouton pour me rendre sur une autre page (une autre image clé).

Ceci se réalise t'il dans la section Actions ou tout simplement au niveau du scénario ?

Damien
Hors ligne cgrard # Posté le 06/07/2008 à 20:39:34
Avatar
Groupe : Membres
Quand tu parles de fonfu enchainé ... tu parle d'interpolation de mouvement ? :-°

Enfin, une animation ?
Des objets ou des textes qui aparaise comme par "magie" suivant un certain effet ?


Carpe Diem :p
 
Hors ligne damienklotz # Posté le 07/07/2008 à 09:51:23
Avatar
Groupe : Membres
Salut cgrard ;)

Tu vois ce que je t'ai donné comme .fla, et bien je veux que quand je change de page, toute la page actuelle disparaisse progressivement et la page de destination apparaisse progressivement.

J'ai vu ca sur une présentation Flash donc je sais que c'est possible.

Par contre, ce n'est peut-être pas évident à mettre en place :(

Je veux donc que ce soit tous les élément de la page qui disparaissent, pas seulment une zone.

Damien
Hors ligne mysterty # Posté le 07/07/2008 à 11:13:57
dsl
Avatar
Groupe : Membres
pour cela le mieux est d'utiliser l'ActionScript, mais il faudra repenser la structure de ton anime. c'est lourd au début, mais très franchement, c'est carrément plus rapide après.

pour passer d'une page à l'autre avec des fondus, il faudrait que chaque page ne corresponde plus à une image, mais à un clip.

ta scène de dépard est complètement vide.

tu mets page1, page2, page3 etc dans des MoviesClips que tu nommes en faisant dans la bibliothèque clic-droit, liaison, lier pour action script (nomme Page1 ton clip page1, Page 2, etc).

dans ta fenetre action tu faits pour toute tes pages:
Code : Actionscript
1
2
3
var page1:MovieClip = new Page1();
addChild(Page1);
page1.alpha = 0;



et enfin, tu utilises la fonction tween pour passer de page 1 à page 2 en jouant sur la propriété alpha (transparence).
Code : Actionscript
1
2
var tween:Tween = new Tween ( page1, "alpha", Elastic.easeOut, 100, 0, 2, true );
var tween:Tween = new Tween ( page2, "alpha", Elastic.easeOut, 0, 100, 2, true );


PS: n'oublie pas d'importer les police de tes texte si tu mets des textes dynamiques, sinon ils ne seront pas géré par le tween !
Édité le 07/07/2008 à 11:16:03 par mysterty

faites vivre une grande aventure à votre cerveau !

(\_(\    [ils ne savaient pas que c'était impossible... alors ils l'ont fait !]
(= '.'=)    /
((")_(")    
 
Hors ligne damienklotz # Posté le 09/07/2008 à 10:31:18
Avatar
Groupe : Membres
Merci mysterty,

Par contre, avant de tester ta solution de fondu,

j'aimerai bien convertir mon code AS 2.0 en code AS 3.0 afin d'être plus dans les standarts.

Voici mon code (qui ne fonctionne pas en AS 3.0) :

Code : Actionscript
1
2
3
4
5
6
button_page1.onRelease = function() { gotoAndStop("page1"); }
button_page2.onRelease = function() { gotoAndStop("page2"); }
button_page3.onRelease = function() { gotoAndStop("page3"); }
button_page4.onRelease = function() { gotoAndStop("page4"); }

stop();


Comment le modifier pour qu'il fonctionne en AS 3.0 ?

Damien
Hors ligne mysterty # Posté le 09/07/2008 à 12:41:01
dsl
Avatar
Groupe : Membres
en AS3 ça a complètement changé (c'est pour cela que je t'avai conseillé de t'y mettre directement dans ton précédent sujet il me semble :p ).

donc, en as3, tous passe par des écouteurs d'évènement (un peu comme en java si mes souvenir sont bons):

Code : Actionscript
1
2
3
4
5
monBouton.addEventListener(MouseEvent.CLICK, clicHandler)
function clicHandler(event:MouseEvent)
{
    trace(ok);
}


et encore une fois je te conseille de lire l'excellent livre de Thibault Imbert: Bonnes Pratiques d'ActionScript3 disponible gratuitement sur le net :D

faites vivre une grande aventure à votre cerveau !

(\_(\    [ils ne savaient pas que c'était impossible... alors ils l'ont fait !]
(= '.'=)    /
((")_(")    
 
Hors ligne damienklotz # Posté le 09/07/2008 à 16:33:09
Avatar
Groupe : Membres
Salut mysterty,

Je suis désolé car je n'avais pas vu tes derniers messages ajoutés à mes deux sujets.
Bon, c'est vrai que je me suis lancé un peu rapidement sans forcément faire les bons choix mais je devais impérativement me jeter dans le sujet pour mon stage.

OK, je passe à l'AS 3.0. Pas de retour en arrière. Je bannis l'AS 2.0.

Bon.

Par contre, j'ai essayé ta méthode de changement de page en AS 3.0 et ca fait tout défiler, ca ne s'arrète pas sur les pages. De toute facon, je crois que ton code ouvre un message sur la fenêtre de sortie. En ce qui me concerne, j'aimerai bien changé de page avec les boutons.

J'ai trois page : page0, page1 et page2

page 0 : Cette page configure le lecteur Flash afin de supprimer la barre de menu

Image utilisateur

page 1 : Première page de ma présentation Flash contenant deux boutons :
button_page1 : bouton vers cette même page
button_page2 : bouton vers la page 2

Image utilisateur

page 2 : Seconde page de ma présentation Flash contenant également les deux boutons :
button_page1 : bouton vers la page 1
button_page2 : bouton vers cette même page

Image utilisateur

Voilà, comment transformer les trace pour que ca envoie vers les pages puis que ca stoppe (comme ce que j'avais en AS 2.0) ?

Damien
Édité le 09/07/2008 à 16:39:18 par damienklotz
Hors ligne mysterty # Posté le 09/07/2008 à 17:30:21
dsl
Avatar
Groupe : Membres
quand j'ai le temps (peut-etre demain) je t'envoie un fla avec une bonne méthode pour faire ce que tu veux, tu comprendras...

faites vivre une grande aventure à votre cerveau !

(\_(\    [ils ne savaient pas que c'était impossible... alors ils l'ont fait !]
(= '.'=)    /
((")_(")    
 
Hors ligne damienklotz # Posté le 09/07/2008 à 17:51:44
Avatar
Groupe : Membres
D'accord mysterty.

Je te remercie.

Damien
Hors ligne mysterty # Posté le 11/07/2008 à 11:07:32
dsl
Avatar
Groupe : Membres
voilà, j'ai fait cette petite annime flash hier et j'ai paufiné ce matin.

ça fait des fondu enchaînés avec plusieurs pages qui comme tu le vois peuvent contenir ce que tu veux.

analyse bien le code, je l'ai pas vraiment commenté parcequ'il est plutôt simple.

pour ceux qui n'ont pas flash, voici le code :

Code : Actionscript
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
/*import des classes nécessaires*/
import fl.transitions.Tween;
import fl.transitions.TweenEvent;
import fl.transitions.easing.*;

/*définition des paramètres*/
var array_menu:Array = new Array();
array_menu["btnMenu1"]=["ma jolie page 1", "Page1"];
array_menu["btnMenu2"]=["ma jolie page 2", "Page2"];
array_menu["btnMenu3"]=["ma jolie page 3", "Page3"];
array_menu["btnMenu4"]=["ma jolie page 4", "Page4"];
array_menu["btnMenu5"]=["ma jolie page 5", "Page5"];
var length_menu:int = 5;
var conteneur:MovieClip = new MovieClip();

/*ajout des éléments sur la scène*/
addChild(conteneur);

/*définition des écouteurs*/
for (var i:int=1; i<=length_menu; i++)
{
	this["btnMenu"+i].addEventListener(MouseEvent.CLICK, clickHandler);
	this["btnMenu"+i].texte.text = array_menu["btnMenu"+i][0];
	this["btnMenu"+i].texte.mouseEnabled = false;
}

/*définition des fonctions*/
function clickHandler(event:MouseEvent):void
{
	while(conteneur.numChildren>0)
	{
		conteneur.removeChildAt(0);
	}
	var class_page:Class = getDefinitionByName(array_menu[event.target.parent.name][1]) as Class;
	var page:MovieClip = new class_page();
	conteneur.addChild(page);
	var tween_page:Tween = new Tween(conteneur, "alpha", Strong.easeIn, 0, 100, 1, true);
}


si tu as des questions, n'hésite pas.

note que pour que le fondu s'applique aux textes dynamiques, il faut intégrer les polices (propriété du texte>intégrer>sélectionner tous les latins)

faites vivre une grande aventure à votre cerveau !

(\_(\    [ils ne savaient pas que c'était impossible... alors ils l'ont fait !]
(= '.'=)    /
((")_(")    
 
Hors ligne damienklotz # Posté le 11/07/2008 à 20:00:58
Avatar
Groupe : Membres
Waou, merci beaucoup mysterty !

C'est e-xa-cte-ment ce que je voulais :)
Édité le 11/07/2008 à 20:02:19 par damienklotz
Hors ligne damienklotz # Posté le 13/07/2008 à 12:00:32
Avatar
Groupe : Membres
Bonjour,

J'essaie de reproduire la méthode donnée par mysterty.

Mais je ne sais pas dans quel ordre procéder pour créer les clips, movie-clips, et autres...

(En ce qui concerne le code AS 3.0, je l'ai déjà placé dans la fenêtre Actions)

Je suis sur la Frame 1, je suppose que je dois commencer par insérer les images des boutons.
Puis faire clic-droit dessus puis Convertir en Symbôle>Clip pour chacun d'entre eux ?

Mais comment définir l'emplacement ou s'affichera les images désirées ?

Autant vous dire que je suis un peu perdu !

Damien
Hors ligne mysterty # Posté le 13/07/2008 à 15:50:45
dsl
Avatar
Groupe : Membres
et bien, moi je ne me suis pas embêter pour cela, j'ai défini toute mes pages de la même taille et je les appelle à la position (0;0).

mais si tu veux spécifier la position à une image, tu la transforme en symbole, tu la lies pour action scipt, et tu joues sur leurs propriété x et y comme en AS2 :

Code : Actionscript
1
2
3
4
5
var monImage:Sprite = new MonImage();
monImage.x = 140; //défini la position en abscisse
monImage.y = 78; //défini la position en ordonnée
monImage.alpha = 75; //définie la transparence, pour le fun  :p
addChild(monImage);


ensuite, pour "dans quel ordre faire", tu t'en moques completement.

faites vivre une grande aventure à votre cerveau !

(\_(\    [ils ne savaient pas que c'était impossible... alors ils l'ont fait !]
(= '.'=)    /
((")_(")    
 
Hors ligne damienklotz # Posté le 13/07/2008 à 16:15:04
Avatar
Groupe : Membres
Bon je résume :

1/ J'arrive sous Adobe Flash CS3 Professional, je clique sur Fichier>Nouveau>Fichier Flash (AS 3.0)
2/ Là directement, je vais dans Actions et je copie-colle ton code Action Script.
3/ Maintenant, je dois créer les 5 boutons. Je crée une image de bouton JPG sous Paint.
Puis, sous Abobe Flash, je fais Fichier>Importer>Importer dans la scène pour placer les 5 images de bouton. Je les converti en Symbôle>Clip et je leur donne les noms d'occurence :
btnMenu1, btnMenu2, btnMenu3, btnMenu4 et btnMenu5.
4/ Ensuite, je dois créer 5 pages CLIP. Par exemple, je dessine 5 JPG différents sous Paint.
Puis sous Adobe Flash, je fais Fichier>Importer>Importer dans la scène pour que ca ajoute les 5 images JPG dans la bibiothèque. Je convertir ces cinq JPG en symbôle de type CLIP auxquelles je donne les noms d'occurences :
Page1, Page2, Page3, Page4 et Page5.
Puis je les supprime de la scène car les pages sont appellées par le code AS 3.0 (par l'intermédiaire des boutons).

Et là quand je fais Contrôle>Tester l'animation, ca doit faire apparaître mes pages en fondu enchainé quand je clique sur les boutons ?

Parce-que ca ne fonctionne pas :(

Damien




Édité le 13/07/2008 à 16:17:24 par damienklotz
Hors ligne mysterty # Posté le 13/07/2008 à 16:55:48
dsl
Avatar
Groupe : Membres
ha ouai mais bon, là, je suis désolé je peux pas tout t'expliquer depuis le début... :(

tout ce que peux te dire, c'est de bien observer on fla.

par exemple, regarde bien la structure de mes boutons : tu verras qu'en fait, un bouton c'est un clip dont le nom d'occurence est "btnX" qui contient un champ de texte dynamique et un bouton.

pour les pages, il s'agit de divers choses (des textes, des images...)

analyse bien mon fichier, regarde bien tout (c'est assez simple, il n'y a qu'une seule image, et tout est dans la bibliothèque), regarde bien les noms de liaisons, les propriété des différents éléments des pages, et tu verras que tout est dedans.

je suis désolé, mais à distance, je ne peux pas t'expliquer correctement, mais tu devrais pouvoir t'en sortir, courage ! ;)

faites vivre une grande aventure à votre cerveau !

(\_(\    [ils ne savaient pas que c'était impossible... alors ils l'ont fait !]
(= '.'=)    /
((")_(")    
 
Hors ligne damienklotz # Posté le 14/07/2008 à 15:16:13
Avatar
Groupe : Membres
C'est bon j'ai tout compris de fond en comble, il n'y a plus aucune zone d'ombre.

Juste une chose, comme fait-tu pour positionner tes pages sont ajouter les lignes de code suivantes :

Code : Actionscript
1
2
page.x=345;
page.y=163;


Car moi, quand je n'indique pas une bonne position, elle se place en dehors du lecteur Flash sur la gauche o_O

Damien
Édité le 15/07/2008 à 09:34:07 par damienklotz
Hors ligne mysterty # Posté le 15/07/2008 à 10:00:49
dsl
Avatar
Groupe : Membres
comme je le disai, je ne me suis pas embété, j'ai créé mon clip "Page1" par exemple en plaçant le contenu à la bonne place.

je m'expliqe : tes clips sont importé par défaut par l'action script à la position (0;0), soit en haut à gauche de la fenêtre. mais ce n'est pas par rapport au début du contenu du clip, c'est par rapport au "point de gravité du clip". Quand tu double clic sur le clip, tu vois une petite croix sur ton écran, c'est cela le "centre de gravité", c'est ce point là qui sera à la position (0;0), donc tout ce qui se situera à gauche et en haut de ce point se trouvera par défaut hors de la fenêtre. il te suffit de repositionner le contenu correctement pour résoudre ce problème ^^

faites vivre une grande aventure à votre cerveau !

(\_(\    [ils ne savaient pas que c'était impossible... alors ils l'ont fait !]
(= '.'=)    /
((")_(")    
 
Hors ligne damienklotz # Posté le 15/07/2008 à 10:30:10
Avatar
Groupe : Membres
C'est chose faite :)

Merci mysterty, tu m'a fait avancé d'un pas de géant.
Allez je continue le dévellopement de mon application...

Encore merci !

Damien

Retour au forum "Autres langages" ou à la liste des forums

Vous devez être inscrit pour pouvoir poster des messages

Changer de design | En savoir plus | Plan du site | Politique d'accessibilité | Règles | RSS tutoriels | RSS news
Édité par Simple IT SARL : Nous contacter | Notre blog | Revue de presse | Publicité

Y'a plus rien à lire, faut remonter maintenant !

Hébergement web - Correction de tutoriels - Créer un site
Vous souhaitez apparaître ici ? Contactez-nous.

Nombre de connectés 351 Zéros connectés | Requêtes SQL 6 requêtes | Temps de génération de la page : Total (SQL) 0.0242s (0.0059s)