[RESOLU] codage pour ne pas degrader une photo en redim

codage pour ne pas degrader une photo en redim [RESOLU] - Flash/ActionScript - Programmation

Marsh Posté le 26-11-2008 à 21:29:03    

.  
 
 
bonjour a tous !  
 
 
voila j'expose ma question :  
 
sur une frame 1600x1200 donc destinee a de grandes resolutions deja,  
1920x1200 et 1600x1200, je pose une photo en 1050 pixels de hauteur.  
 
Attention, c'est de la haute definition, donc pas simplement une image genre wallpaper mais reellement une photo !  
 
 
j'y met un code derrriere, la photo se redimensionnera selon la taille de la fenetre et gardera sa proportion du genre :  
 
la hauteur de la photo sera tant de la hauteur de la fenetre,  
et la largeur de la photo sera tant toujours de la hauteur de la fenetre.  
 
Ainsi la photo garde le meme rapport, et se redimensionne.  
la photo au depart est donc en grand format, 1050,  et tout ca est destine non pas a des resolutions plus grandes mais plus petites genre 1024x768.  
 
 
Mais voila, la photo est degradee, meme avec une reso 1920x1200 et 4 barres d'outils du navigateur, en effet un effet de lignes brisees qu'on appelle aliasing ou crenelage se produit, sans parler de zones plus pixelees, donc avec des degrades pixels moins fins.  
 
 
 
Existe il une solution flash pour palier a cela ou cela est il redibitoire ?  
 
 
Je connais deja une solution mentionnee sur le net, qui est de faire reconnaitre la resolution du visiteur et selon cette reconnaissance diriger le chargement des photos en fonction. Mais cela veut dire qu'il faut prevoir a l'avance plusieurs fichiers pour chaque photo dans des tailles differentes, ce qui resulte d'un travail epouvantablement lourd, presque ingerable pour moi dans le cas de plusieurs dizaines de galeries composees chacune de plusieurs dizaines de photos.....  
 
Donc si vous avez des pistes, elles sont les beinvenues d'autant plus que c'est urgent !  
Merci !  
 
Autre point :
 
je mets un code de redimensionnement sur la scene de mon swf qui contient notamment un clip container par rapport a la fenetre, mais pas de code pour le container.
 
Ensuite je mets un code de redimenssionnement sur la scene de mon swf qui contient la photo, et qui va etre appele dans le container.
 
est ce deja une bonne methode et si non peut elle influer sur la degradation image lors du redimensionnement ou faut il faire autrement ?
 
 
 
.


Message édité par LDL le 29-11-2008 à 20:05:57
Reply

Marsh Posté le 26-11-2008 à 21:29:03   

Reply

Marsh Posté le 27-11-2008 à 06:28:23    

T'as essayé, clic-droit sur l'image dans la bibliotheque, Proprietes>Authorisé le lissage.
 
T'es photos tu les charges dynamiquement ou elles sont toutes dans ton Flash ?


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

Marsh Posté le 27-11-2008 à 11:51:41    

c'est jamais super puissant le redimentionnemnet de photos.. bien que ca soit mieux avec AS3 en flash 10
 
sinon, tu peux transformer te photo en bitmap et la tu peux lisser tranquilos... ca marche assez bien comme ca et c'est pas un code compliqué

Reply

Marsh Posté le 27-11-2008 à 12:28:36    

J'ai jamais vu de grosses différences en passant par la :/


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

Marsh Posté le 27-11-2008 à 12:40:20    

merci pour vos messages !
je charge les photos directement dans le flash donc je ne passe pas par un objet dynamique. J'ai deja essaye le lissage mais ca n'empeche pas la degradation de la photo vraiment. Il existe cependant bien une degradation, attention, la encore nous parlons de photos en haute definition,
donc pour des yeux avertis comme les photographes professionnels. Sur le screen suivant, le degradation constatee est terrifiante, pour certains
clients cela ne passent pas du tout, mais alors pas du tout !
 
En revanche, il existe bien forcement une methode !
J'en veux pour preuve ce lien :
http://www.fabian-guignard.ch/new.htm
 
Autre indication, si j'ai une photo et que je la diminue dans un logiciel adapte de gestion image comme photoshop, en diminuant la photo on voit tres nettement la degradation (aliasing sur les cheveux).
Si je mets la fenetre du navigateur affichant ce lien et la redimensionne a la meme taille que cette dite photo, cote a cote on voit tres nettement que le redimensionnement de ce site ne degrade en rien la photo (pareil, controle sur le haut du crane, cheveux non creneles).
 
screen pour voir la degradation, visionner ce fichier en taille reelle
 
Donc il existe bien forcement une methode ou un script, la preuve certains sites arrivent a gerer le redimensionnement sans degradation....
(j'ai d'autres liens d'exemples mais bon un seul ca suffit je pense...;) ).
J'avais pense a la fonction high_quality mais cela ne donne rien....
:(
 
J'ai oublie de preciser que actuellement mon redimensionnement subit le meme probleme que un redimensionnement de photo dans un logiciel adapte comme photoshop. Peu etre aussi que tout simplement je m'y prend mal d'une point de vue construction flash, vu que je suis a ce niveau la quand meme faut bien dire une banane !
 
JE reprecise quand meme ma facon de faire, des fois que j'aurai tout faux ! :
 
j'ai un swf.
 
dedans, des clips donc un clip qui contient les boutons. (une bande de petites photos en fait)
en dessous un autre clip appele container ou va etre charge le swf qui contient la photo.
(en dessous car il doit passer en dessous des thumbnails)
 
Sur chaque bouton, je met le code suivant (claissque je crois) :
 

Code :
  1. on (release){
  2.     _parent._parent.container.loadMovie ("grandephoto.swf" );
  3. }


 
(parent parent a cause bien sur de l'arborescence)
 
Sur ce swf, des scripts de redimensionnement et repositionnement sur la scene pour chaque clips mais aucun script
pour le container (peu etre est ce un tort, je devrais le mette la, je suis entrain de faire les tests..).
 
Ensuite sur le swf appele qui contient la photo, un  script de redimensionnement, peu etre aussi
que la j'a tout faux cependant la photo est tres bien redimensionnee e repositionnne, de ce cote la tout fonctinne tres bien, mais le redimensionnement etant peu etre ultrasensible, peu etre qu'il existe une consequence que j'ignore :
 

Code :
  1. function Dimensionne_fond () {
  2. //fond._align = "TL";  
  3. fond._width = Stage.width;
  4. fond._height = Stage.height;
  5. //fond._x = Stage.width/1600;  
  6. //fond._y = Stage.height/1200;  
  7. fond._x = 0;
  8. fond._y = 0;
  9. }
  10. function Redimension_Photo () {
  11. //Photo._align = "TL";  
  12. Photo._width = Stage.height*1.201666;
  13. Photo._height = Stage.height/1.142857;
  14. Photo._x = Stage.width/48.4848;
  15. Photo._y = Stage.height/36.3636;
  16. }
  17. onSelfEvent (load) {
  18. Redimension_Photo()
  19. Stage.align = "TL";
  20. Stage.scaleMode = "noScale";
  21. var sizeListener = new Object();
  22. sizeListener.onResize = function() {
  23. Dimensionne_fond();
  24. Redimension_Photo();
  25. };
  26. Stage.addListener(sizeListener);
  27. Dimensionne_fond(); 
  28. }
  29. onFrame (2) {
  30. Redimension_Photo();   
  31. }
  32. onFrame (10) {
  33.     stop();
  34. }


 
 
ma scene est en 1600x1200.
tous les swf font la meme taille (la c'est sur je me suis pas fait chier, mais bon vu mon faible niveau en code, j'ai interet)
pour garantir le redimensionnement j'ai mis la fonction en frame 2, si je la met en frame 1, le redimensionnement ne se produit pas.
 
voila...
:(
 
 
.


Message édité par LDL le 27-11-2008 à 13:00:03
Reply

Marsh Posté le 27-11-2008 à 17:10:38    

tu pourais nous en lien mettre une photo brute qui se redimmentione pas bien ... qu'on puisse tester avec tres images ?...

Reply

Marsh Posté le 27-11-2008 à 18:14:44    

.
 
tu peux faire des tests sur l'image des screens que j'ai mis, mais en fait cela ne vient pas de l'image je te le dis tout de suite. n'importe quelle image fera l'affaire du reste, a condition d'avoir une bonne def au depart. voici quand meme le lien de l'image utilisee pour mon exemple que montre plus haut :
 
http://images2.photomania.com/560000/1/rad4E37A.jpg
 
 
.

Reply

Marsh Posté le 29-11-2008 à 19:45:08    

.
 
 
bon !
 
Apres certaines recherches et pas mal d'essais, et des controles avec mon client photographe, j'ai trouve la soluce, que je poste ici évidemment pour celui qui va passer derriere avec le meme probleme !
;)
 
 
La construction en fait importe, peu, seul compte le fait d'avoir 4 éléments réunis.
 
Dans mon cas, je précise quand meme les conditions de ma construction qui est un swf maitre en plugin 7 qui comporte un script de redimensionnement et repositionnement des differents clips qui contiennent mon design (fond, image, texte). Le swf contient aussi un clip vide appelé container vis a vis duquel il n'y a aucun script, et dans lequel le swf externe qui contient la photo va etre appelé.
 
Sur les boutons, un release qui appelle le swf externe photo dans le container vide et avec un code qualité qui va garantir le maintien de qualité de la photo lors de tout redimensionnement sans aucune dégradation. ce script est le suivant :
 

Code :
  1. on (release){
  2.     _parent.container.loadMovie ("swfexterne.swf" );       
  3.     _quality = "BEST";
  4. }


 
Sur la scene du swf externe qui contient la photo, un script de redimensionnement et repositonnement avec écouteur bien sur....
 
 
Pour garantir le résultat, voici les 4 éléments indispensables (sans un seul, rien ne fonctionne et la photo est systématiquement dégradée !) qu'il faut impérativement avoir :
 
* Photo en format BMP
* Anti-Alias autorisé (a activer lorsque l'on met la photo dans le flash)
* Utiliser la propriété _quality sur le bouton d'appel du swf externe.  
* Le niveau de la propriété _quality doit etre impérativement : "BEST".  
 
A noter que :
Si le niveau de la propriété _quality est activé seulement sur le niveau "HIGH", la dégradation a lieu exactement comme si il n'y aucun code.
 
(Tableau explicatif des niveaux de la propriété quality)
http://images2.photomania.com/560000/1/radE0002.jpg
 
A noter aussi depuis flash player 5, la propriété _hightquality est déconseillée, au profit de la propriété _quality. Si la propriété _hightquality est utilisée, le niveau doit etre 2 impérativement.
 
 
 
Et pour finir, une mention pour la gestion :
 
qualité de la photo
- Fichier de départ : jpg HD en 240 dpi
- Sauvegarde du fichier lors de la mise au format : format BMP format windows 24bits/pixel. Poids : (dans mon cas) 4.26 Mo
- Chargement dans flash : compression : Au mieux (auto) : qualite 99% (poids final : 294 Ko)
 
 
voila. Le resultat est impeccable.
;)
 
 
 
SUJET RESOLU.
.


Message édité par LDL le 29-11-2008 à 20:12:09
Reply

Marsh Posté le 30-11-2008 à 20:51:42    

Citation :

Fichier de départ : jpg HD en 240 dpi

:non:  
Si c'est de la haute qualité, ta source ne devrait pas être du jpg (déja degradé a priori), mais du TIFF
A+,


---------------
There's more than what can be linked! --    Iyashikei Anime Forever!    --  AngularJS c'est un framework d'engulé!  --
Reply

Marsh Posté le 01-12-2008 à 01:38:02    

.
 
 
pas en 1050 pixels comme je l'ai precise dans ce cas de figure.....
d'autant plus en 240 dpi ! (si on etait en plus grand format, oui completement d'accord que le tif est imperatif)
Sur ce format intermediaire, cela ne peut vraiment jouer que si il y a retouche ou alors impression.
 
Cela dit, c'est vrai que autant transformer le format, autant le faire directement a partir du fichier HD tif plutot que de se taper un format transitoire jpg pour avoir a la sortie un bmp. Mais j'ai mentionne le jpg car je pars du principe que normalement les tif ne sont pas des fichiers facilement et disponibles, et ni meme confies, donc j'ai fait le test sur un cas de figure plus classique, qui est d'avoir un jpg sous la main....
;)
 
 
.


Message édité par LDL le 01-12-2008 à 01:56:48
Reply

Marsh Posté le 01-12-2008 à 01:38:02   

Reply

Marsh Posté le 01-12-2008 à 03:47:44    

Oue TIF a traiter dans Flash au bout de quelques uns le programme peut plus gerer.
 
Et au fait 240dpi c'est pas utile. Flash gérerait plus facilement du 72.
 
Sinon, merci pour la propriete _quality que je ne connaissais pas et qui est fort utile. Je l'ai testé sur un script de galerie que j'ai fait et ca marche tres bien.


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

Marsh Posté le 01-12-2008 à 17:11:02    

.
 
 
oui. ce que voulais dire gilou a propose des tif est que si il faut transformer une image en format bmp pour le flash, il vaut mieux partir d'une fichier tif et le mettre au format bmp.
 
Dans mon cas, comme je l'ai precise avoir les fichiers tif est plus difficile surtout si le client est un photographe professionnel, et qui plus est deja renomme. Seule solution, lui demander si il peut transformer ses tif en bmp pour le site. Apres, c'est vrai aussi que bcp de photographes ont leurs fichiers en taille intermediaire en jpg, et qu'il est difficile de leut demander de tout refaire du tif en bmp car c'est bcp de boulot sur une galerie qui est souvent consequente, d'ou mon indication pour un fichier jpg vers le bmp.
 
Par contre, sil je jpg est en 72 dpi, non la, ca rejoint aussi ce que disait gilou, la perte des details est trop importante si on veut un travail de qualite, bon apres ca depend aussi ce que l'on met derriere le mot qualite !
;)
 
Content sinon d'avoir donne une info utile a quelqu'un de plus avance que moi, vu que le developpement web n'est pas mon domaine, mais bon, c'est bien de partager, des fois ca peut servir a d'autres.....
:)
 
 
.


Message édité par LDL le 01-12-2008 à 17:15:15
Reply

Marsh Posté le 02-01-2009 à 16:48:14    

.
 
 
Illustration de l'application de la fonction, ici :
Michel Bonini - beauty
 
Pour ceux que ca interesse...
:)
 
 
.


Message édité par LDL le 02-01-2009 à 16:49:26
Reply

Sujets relatifs:

Leave a Replay

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