Une animation redimensionnable ?

**guillaumeabxl** · 04/10/2007, 13h56

Bonjour,

Je travaille sur une interface en Flash mais j'aimerai que le flash occupe toute la page du navigateur.
Je veux pas utiliser la fonction "dimensions 100 %" de parametres de publication car je veux juste pouvoir redimenssioner le background de l'animation et non les éléments (logo, images ... qui auront une taille fixe en pixel) car ils ont tendance à pixelliser.

J'ai trouvé un exemple pour que vous puissiez mieux comprendre ce que je veux faire :

http://www.milk.dk/

Merci de m'éclairer,
Guillaume

**samuel_L** · 04/10/2007, 14h41

c'est marrant je cherchais la meme chose ya pas longtemps.
et j'ai presque solutionné ce pb.

1) AS sur la 1ere image :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

fscommand("allowscale","false");

ainsi ton flash ne sera plus étiré, ce seront les bords du clip qui s'adapteront à la zone visible

2) tu mets le width et le height dans le embed à 100%,
en css tu définis la marge du document à 0

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

body {margin:0; padding:0}

(ou alors <body style='{margin:0; padding:0}'>...)

3) il reste le plus délicat : adapter la position de ta scene à la taille de la fenetre.
alors en fait il faut que tu crées une fonction AS qui sera invoquée à chaque redimensionnement de la fenetre, et dans laquelle tu recalcules les positions de tes éléments à partir de Stage.width et Stage.height.
il vaut mieux que tu n'aies pas trop d'éléments à positionner, ou alors rassemble-les dans des symboles (menu, zone principale,bandeaux...)

j'ai un bout de code qui marche mais il est chez moi. mais j'en ai retrouvé un autre du meme style (à mettre sous la 1ere image apres le fscommand, et un stop()):

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
stop();
fscommand("allowscale","false");
var myListener:Object = new Object();
myListener.onResize = function() {
      //centré :
      _root.mc1._x = (Stage.width/2)-(_root.mc1._width/2);
      _root.mc1._y = (Stage.height/2)-(_root.mc1._height/2);
      // aligné en bas à droite :
      _root.mc2._x = Stage.width - _root.mc2._width;
      _root.mc2._y = Stage.height - _root.mc2._height;
      // ex inspiré de milk : on cache certains objets si fenetre trop petite
      _root.mc3._visible = (Stage.width > 500);
 
      // etc...
 
};
Stage.addListener(myListener);
 
/* on appelle manuellement la fonction la 1ere fois
 car si l'utilisateur ne bouge pas sa fenetre, on n'aura
 jamais de positionnement initial.*/
myListener.onResize();

Attention en AS3 ça ne marche pas !

si tu utilises les fonctions de tweening (genre FUSE), ce sera plus fluide.
_root.mc1.tween("_x",nouvelX, .5, "easeOutQuad");

voila,

a+

**guillaumeabxl** · 08/10/2007, 11h08

Merci pour ton aide.

J'ai incorporer le script dans mon animation le resultat est visible à cette adresse :
http://www.acielouvert.net/act/fullscreen.html

Le fichier .fla est ici :
http://www.acielouvert.net/act/test.fla

La redimension fonctionne si on lit le fichier swf seul : http://www.acielouvert.net/act/test.swf
par contre quand on l'intègre dans une page html (avec embed à 100%) ça n'agit pas de la même façon.

Si tu as une idée ?
Je suis preneur.

Guillaume

**Destiny** · 08/10/2007, 12h49

Dans ta page php ou html quand ton intègre ton animation, tu as mis 100%?

**guillaumeabxl** · 08/10/2007, 13h42

Oui je place 100% dans le embed

Mais ça ne donne rien. Par contre quand je lis le swf tout seul (sans la page html) je peux redimensionner la fenetre.

?

**samuel_L** · 08/10/2007, 22h47

ne m'en veux pas je réponds à ton mp DANS le forum pour faire partager =)

Samuel,
Tout d'abord merci pour ton script, je l'ai utilisé dans mon animation, le resultat est visible à cette adresse :
http://www.acielouvert.net/act/fullscreen.html

Le fichier .fla est ici : (*** masque ***)
La redimension fonctionne si on lit le fichier swf seul : http://www.acielouvert.net/act/test.swf
par contre quand on l'intègre dans une page html (avec embed à 100%) ça n'agit pas de la même façon.

Si tu as une idée ?
Je suis preneur.

Guillaume

en fait j'ai ouvert ton .fla... mais je ne vois pas l'AS dedans.
le embed width=100% etc dit à ton navigateur de placer l'anim sur toute la fenetre, mais ne prévient pas flash des changements de taille de fenetre

le fscommand("allowscale","false") maintient l'échelle, ensuite il faut écrire ton onResize et y mettre les repositionnements des éléments. c'est ce que j'explique dans mon post plus haut...

**guillaumeabxl** · 09/10/2007, 15h10

Le code AS est placé sur la première image clef du calque "big1".

**samuel_L** · 09/10/2007, 22h12

arf j'étais crevé hier j'ai meme pas pensé a regarder dans la timeline si j'étais au début. lol

**samuel_L** · 09/10/2007, 22h39

ok, tu as recopié tel-quel le code du post plus haut, mais les clips mc1,mc2 et mc3 n'existent pas dans ton Fla, donc ils ne seront pas repositionnés... ce n'est pas une formule magique, il faut adapter le contenu de la fonction onResize à TA scène, donc à TES occurences de clips en choisissant laquelle est placée où.

là je pense qu'il faut mettre un peu d'ordre avant d'ajouter l'AS, en :
- redisposant les éléments aussi bien dans la bibliotheque que sur la scène...
- essaie de structurer tes élements par famille ou par mise en page, et de les rassembler dans des sous-dossiers de la biblio. n'hésite pas à faire un dessin sur papier et à décomposer ta scène pour t'y aider (fond, bande haut, bande bas, menu, zone de texte, titre....). ainsi ensuite tu rassembles les éléments dans des mc, et tu créeras tes occurences sur la scène.
Ainsi, si tu veux faire bouger la 'bande du bas' par une transition, tu n'auras qu'une occurence à toucher et tu t'y retrouveras.

pour l'AS : petite astuce pour ne pas te perdre dans ton code : dans la mesure du possible rassemble tout l'actionscript dans le meme calque nommé "as", que tu mettras tout en haut ou tout en bas, et que tu rendras invisible et verrouillé pour ne pas contenir autre chose que de l'AS. pour ajouter une action à un moment précis (par exemple tes stop), tu crées une image clé vide sur ce calque et tu y ajoutes le code.
procèdes de la meme facon à l'intérieur de tes symboles, ainsi tu sais où chercher (et les gens à qui tu montres aussi

.

je vais arreter là, je fais un off-topic sinon. pour reprendre le pb d'origine (disposition de la scène en full-browser à la facon du site "milk", je posterai plus tard un autre msg avec un .FLA d'exemple pour clarifier)

a+

**guillaumeabxl** · 10/10/2007, 11h45

Samuel,

Merci beaucoup pour ton aide, tu as du te rendre compte que je suis un peu une bille en AS, je suis plus à l'aise en flash "classic" et en html.

Je vais bosser dessus demain toute la journée pour faire avancer le projet, si tu pouvais publier un fla d'exemple ce serait genial. Je comprend mieux ton script, je vais renommer mes clips en mc1 ... je dois aussi nommer mc1 ... les occurences (encre) ou se trouve les clips ?

Merci,
Guillaume

Une animation redimensionnable ?

Flash

Vue hybride

Discussions similaires

Partager

Partager