Although I’ve upgraded openfl to 4.0.3, lime 3.0.3, swf 2.2.3, I’ve noticed that BlurFilter
is not working on HTML5 target
What filters are supported in HTML5 target? what about GlowFilter
& ColorMatrixFilter
?
Although I’ve upgraded openfl to 4.0.3, lime 3.0.3, swf 2.2.3, I’ve noticed that BlurFilter
is not working on HTML5 target
What filters are supported in HTML5 target? what about GlowFilter
& ColorMatrixFilter
?
I believe that ColorMatrixFilter
works in HTML5 canvas right now (-Dcanvas
) and ShaderFilter
works on individual display objects (sprite.graphics
or TextField
or Bitmap
, etc) for GL targets (WebGL on HTML5)
There are some work items related to a milestone for filter improvements, related to being able to support all these filters on all supported targets
I’ve tried to run this example inside the main Sprite:
var s:Sprite = new Sprite();
s.graphics.beginFill(0xff0000, 1);
s.graphics.drawCircle(50, 50, 50);
s.graphics.endFill();
var blur:GlowFilter = new GlowFilter(0x00FF00, 1);
var filt:ColorMatrixFilter = new ColorMatrixFilter(hexToMatrix(0xFFFFFF));
s.filters = [blur, filt];
function hexToMatrix ( hex:Int):Array<Float>
{
var alpha:Float = 100;
var matrix:Array<Float> = new Array<Float>();
matrix = matrix.concat([((hex & 0x00FF0000) >>> 16)/255, 0, 0, 0, 0]); // red
matrix = matrix.concat([0, ((hex & 0x0000FF00) >>> 8)/255, 0, 0, 0]); //green
matrix = matrix.concat([0, 0, (hex & 0x000000FF)/255, 0, 0]); // blue
matrix = matrix.concat([0, 0, 0, alpha/100, 0]); // alpha
return matrix;
}
using -Dcanvas
in the compilation, but could not notice any effect, is there something I am missing?
Maybe canvas only works with applyFilter
at the moment
var sprite = new Sprite ();
sprite.graphics.beginFill (0xFF0000);
sprite.graphics.drawRect (0, 0, 100, 100);
var bitmapData = new BitmapData (Math.ceil (sprite.width), Math.ceil (sprite.height));
bitmapData.draw (sprite);
// set-up filter
bitmapData.applyFilter (bitmapData, bitmapData.rect, new Point (), filter);
I tried to apply the filter like this:
bitmapData.applyFilter (bitmapData, bitmapData.rect, new openfl.geom.Point (0,0), filt);
sprite.graphics.beginBitmapFill(bitmapData);
sprite.graphics.endFill();
But could not see any effect, can you advice please?
Also, should I try the heroku shaders? but I have to idea how to apply a shader or a sprite? and to set the color and glow effect? also, this will enforce me to rewrite the project to work with shaders, which would cost me a lot of time.
Do you expect to get filters work normally in HTML5 in the next release? what’s your advice? maybe I can work on other features while the next release is being developed?
Anyone can help? Chrome will eventually stop Flash content, and I really need to port my project to HTML5 as soon as I can.