Bitmap.smoothing - come diminuire la distorsione delle immagini

[Flep]

Buon Lunedì a tutti !
Ho ricevuto diverse domande a riguardo dell' utilità gratuita visualizzatore immagini in 3D , precisamente riguardo a come possono espandersi le immagini senza distorcersi troppo.
Alcune e-mails ricevute affermavano che utilizzavo delle immagini ad alta risoluzione, ma questo non è corretto.
Le immagini utilizzate sono ottimizzate al massimo per il web e niente alta risoluzione.
Il ' trucco ' per non far distorcere le immagini che utilizziamo per le animazioni è semplicemente un parametro che possiamo settare cliccando l' immagine in libreria col destro, andiamo in proprietà e noteremo una opzione ' allow smoothing '. Bene, se attiviamo quell' opzone, Flash ridurrà drasticamente le distorsioni di quella immagine in fase di animazione ( movimento o ingrandimento ).
Ecco il punto: e se l' immagine non è in libreria ma viene caricata esternamente in runtime ?
La risposta è la proprietà smoothing della classe Bitmap di Actionscript 3.0 .

Vediamo un esempio per capirci meglio...*

Il primo esempio ha la proprietà smoothing=false, mentre il secondo smoothing=true

Vediamo come farlo via codice.

Creo un FLA che salvo con nome ' main.fla '.
Niente al suo interno. Solo dichiariamo la sua Document Class, un file AS che salvo con nome ' Main.as ', implementata in questo modo:

package
{
	import flash.display.MovieClip;
	import flash.display.Loader;
	import flash.net.URLRequest;
	import flash.events.Event;
	
	public class Main extends MovieClip
	{
		private var loader:Loader;
		
		private var startWidth:Number;
		private var startHeight:Number;
		
		public function Main()
		{
			init();
			loadImage();
		}
		
		private function init():void
		{
			stage.frameRate=31;
		}
		
		private function loadImage():void
		{
			var request:URLRequest=new URLRequest('http://www.flepstudio.org/swf/sintassi/allow_smoothing/pic_0.jpg');
			loader=new Loader();
			loader.contentLoaderInfo.addEventListener(Event.COMPLETE,completed);
			loader.load(request);
		}
		
		private function completed(evt:Event):void
		{
			addChild(loader);
			startWidth=loader.width;
			startHeight=loader.height;
			loader.addEventListener(Event.ENTER_FRAME,moveMe);
		}
		
		private function moveMe(evt:Event):void
		{
			evt.target.width+=2;
			evt.target.height+=2;
			if(evt.target.width>stage.stageWidth)
			{
				evt.target.width=startWidth;
				evt.target.height=startHeight;
			}
		}
	}
}

Come vediamo dal codice, viene caricata un' immagine esterna utilizzando un Loader.
A caricamento avvenuto, viene applicata a loader ( l' istanza del Loader che ha caricato l' immagine ) uuna animazione e cioè il contenuto di loader viene allargato sia in width che in height.
In questo caso non utilizzando la proprietà smoothing, il risultato è decisamente brutto.

Se noi invece, quando loader ha terminato il caricamento dell' immagine ( quindi nel metodo: private function completed ), scrivessimo queste poche righe in più:
aggiungo loader allo stage ( altrimenti non sarebbe visibile )
addChild(loader);
creo una variabile di tipo Bitmap alla quale assegno il valore del contenuto di loader e forzo il tipo a Bitmap ( as Bitmap )
var image:Bitmap=loader.content as Bitmap;
assegno true alla proprietà smoothing di image
image.smoothing=true;

In questo modo il risultato cambia decisamente in meglio.
Abbiamo sfruttato al massimo una immagine di dimensioni 280x187 che pesa solo 8KB !

Alla prossima !