Distorcer clips com ActionScript

Em Flash as transformações básicas que podemos aplicar a um clip são mudar a posição, a rotação e a escala.

Por Tutoriales-flash.com


Publicado em: 25/9/08
Valorize este artigo:
Entretanto, se queremos distorcer um clip de filme veremos que com as ferramentas que nos proporciona Flash não poderemos fazê-lo diretamente.

Neste documento iremos facilitar uma maneira de distorcer um clip de filme em tempo de execução com ActionScript. Na verdade o clip original permanecerá inalterável, o que faremos será criar outro clip com a distorção aplicada e ocultar o primeiro. O processo se baseará na classe bitmapData de ActionScript. A classe bitmapData nos permite armazenar e manipular os pixels que compõe um clip.



COMO FAZÊ-LO.

A distorção se fará segundo este esquema onde cada bloco representa uma coluna de pixels:


Decomporemos a representação gráfica do clip original em filas ou colunas segundo seja a distorção horizontal ou vertical. Depois modificaremos as dimensões destes segmentos e se gerará a aparência de distorção. Vamos explicar só a distorção vertical, já que a distorção horizontal é praticamente igual e as diferenças no código são mínimas como se poderá comprovar mais adiante.

O primeiro passo consiste em armazenar em um objeto bitmapData os pixels do clip a distorcer. Chamaremos de bitmap_1. Depois vamos criar um clip vazio que conterá o clip com a distorção aplicada. Seu identificador será conteiner. Para criar a distorção vamos descompor a rede de pixels do objeto bitmap_1 em suas colunas, de modo que ficará dentro do clip contêiner uma série clips de um pixel de largura e a mesma altura que o original. Para copiar estes pixels, nos apoiamos em outros objetos bitmapData, que se correspondem com o identificador bitmap_temp que há dentro do loop no código.

// importamos as classes necessárias
import flash.display.BitmapData;
import flash.geom.Rectangle;
import flash.geom.Point;
MovieClip.prototype.distorcerV = function(distorcao:Number) {
var largura:Number = Math.round(this._width);
var altura:Number = Math.round(this._height);
var transparent:Boolean = true;
var fillColor:Number = 0x00000000;
// objeto bitmapData onde armazenamos a info do clip a distorcer
var bitmap_1:BitmapData = new BitmapData(largura, altura, transparent, fillColor);
bitmap_1.draw(this);
this._visible = false;
distorcido_mc.removeMovieClip();
// clip onde criaremos a distorção
var conteiner:MovieClip = this._parent.createEmptyMovieClip("distorcido_mc", this._parent.getNextHighestDepth(), {_x:this._x, _y:this._y});
conteiner._x = this._x;
conteiner._y = this._y;
for (var k:Number = 1; k<largura; k++) {
var clip_temp:MovieClip = conteiner.createEmptyMovieClip("clip"+k, conteiner.getNextHighestDepth(), {_x:k, _y:0});
clip_temp._x = k;
var bitmap_temp:BitmapData = new BitmapData(1, altura);
bitmap_temp.copyPixels(bitmap_1,new Rectangle(k, 0, k, alto),new Point(0, 0));
clip_temp.attachBitmap(bitmap_temp,clip_temp.getNextHighestDepth(),"auto",true);
clip_temp._yscale = ((k/(alto-1))*(100-distorcao))+distorcao;
clip_temp._y = (altura-clip_temp._height)*0.5;
}

// liberamos memória
bitmap_1.dispose();
};


Para distorcer um clip simplesmente há que chamar ao seu método distorcerV(distorcao). O valor do parâmetro distorção deve estar entre 0 e 100 senão os resultados são imprevisíveis (pode-se provar de todos modos). Um exemplo seria:

meuClip.distorcerV(70);

Facilitamos o código em uns arquivos .as de modo que para empregá-los você terá duas opções:
  • Copiar o código do .as dentro de nosso filme.
  • Usar um #include para dispor de suas funções.
Com esta base o interessante é provar novas formas de distorção ou inclusive combinar várias distorções.
Nesta imagem se aplicou uma distorção horizontal e logo outra vertical para conseguir um efeito de perspectiva.


Download dos arquivos .as: distorsion.zip





Comentários do artigo
Foi enviado 1 comentário ao artigo
1 comentário não revisado
0 comentários revisados

Usuários :    login / registro

Manuais relacionados
Categorias relacionadas
O autor

Home | Sobre nós | Copyright | Anuncie | Entrar em contato