ActionScript/Usando máscara, cache e aplicando filtro

O ActionScript nos dá, além da oportunidade de desenhar com código, aplicar filtros, possibilidades de ganhos de desempenho em renderização e aplicação de máscaras.

Utilizando máscara

Para mascarar um objeto basta desenhar uma máscara com a classe graphics e usando a propriedade mask do Sprite que será mascarado.

// Objeto retangular que será mascarado
var sp:Sprite = new Sprite();
sp.graphics.beginFill(0xFF0000, 1);
sp.graphics.drawRoundRect(100, 100, 150, 200, 20);
sp.graphics.endFill();

// A máscara
var spMask:Sprite = new Sprite();
spMask.graphics.beginFill(0x0000FF, 1);
spMask.graphics.drawCircle(150, 120, 80);
spMask.graphics.endFill();

addChild(sp);

addChild(spMask);

// Mascarando o retângulo com spMask
sp.mask = spMask;

Vetor com cache como Bitmap

É possível utilizar efeitos baseados em pixel em recursos de vetor e/ou tentar aumentar a performance de renderização, economizando processamento de CPU. Ativando o vetor como um bitmap faz com que o Flash Player tire um "instantâneo" do vetor toda vez que houver uma transformação nele, como giro, alfa ou escala.

// Sp é um objeto Sprite qualquer...
sp.cacheAsBitmap = true;

// Um objeto que é máscara...
spMask.cacheAsBitmap = true;

Aplicando filtros de Bitmap

É possível aplicar filtro em objetos de exibição, como sombra, chanfrado e ofuscado.

• Primeiro veremos o filtro de sombreamento:

var sp:Sprite = new Sprite();
sp.graphics.beginFill(0xFF0000, 1);
sp.graphics.drawRoundRect(100, 100, 250, 90, 20);
sp.graphics.endFill();
addChild(sp);

// Aplicando a sombra opaca
var ds:DropShadowFilter = new DropShadowFilter();
sp.filters = [ds];

Esse snippet acima irá lançar uma sombra opaca no objeto. Podemos configurar características sobre a sombra. Elas podem ser configuradas no momento da instanciação ou separadamente, como abaixo:

var ds:DropShadowFilter = new DropShadowFilter();
ds.blurX = 0.2; // extensão na direção x
ds.blurY = 0.2; // extensão na y
ds.alpha = 0.2; // alfa
ds.distance = 10; // distância da sombra
ds.color = 0xCCCCCC; // cor da sombra
ds.angle = 90; // ângulo
sp.filters = [ds];

• Aplicando outro filtro, do tipo chamfrado:

// Baseando-se no exemplo anterior
var bv:BevelFilter = new BevelFilter();
bv.highlightAlpha = 0.5;
bv.highlightColor = 0x00FF00;
sp.filters = [ds, bv];

Como visto na linha sp.filters = [ds, bv], podemos inserir mais de um efeito à sp. No caso foi inserido o bv, que acabamos de criar, ao ds, do exemplo anterior.

• Filtro brilhante, que criará uma sensação de luminosidade ao objeto:

// Aplicando o GlowFilter
var gl:GlowFilter = new GlowFilter()
gl.color = 0xFFFF00;
gl.blurX = gl.blurY = 50;
sp.filters = [gl];

• E por fim, veremos um filtro de ofuscado, que dará um embaçamento ao desenho:

// Baseando-se no exemplo anterior
var bl:BlurFilter = new BlurFilter();
bl.blurX = 30;
bl.blurY = 30;
bl.quality = 1;

sp.filters = [bl];