I'm trying to apply a GlowFilter (border) to a image and then rotate+skew it. Unfortunately, doing this makes the filter look bad (jagged edges) even though the image itself is smooth. I've tried a few things, including using different filters (like the DropShadowFilter).
Here's a rough example of what I'm doing...
const cardDeckBorderThickness:int = 2; const cardDeckScaleFactor:Number = .12; const cardDeckRotation:int = 30; const cardDeckSkew:int = -20; var image:Image = new Image(); image.source = /* image here */; image.smoothBitmapContent = true; image.filters = [ new spark.filters.GlowFilter( 0xFFFFFF, 1, cardDeckBorderThickness, cardDeckBorderThickness, 255, BitmapFilterQuality.MEDIUM ) ]; deckCardsContainer.addElement( image ); var matrix:Matrix = image.transform.matrix; matrix.c = Math.tan( cardDeckSkew * ( Math.PI / 180 ) ); var rotationPoint:Point = new Point( image.width / 2, image.height / 2 ); rotationPoint = matrix.transformPoint( rotationPoint ); matrix.translate( -rotationPoint.x, -rotationPoint.y ); matrix.rotate( cardDeckRotation * ( Math.PI / 180 ) ); matrix.translate( rotationPoint.x, rotationPoint.y ); matrix.scale( cardDeckScaleFactor, cardDeckScaleFactor ); image.transform.matrix = matrix;
decrease the strength and increase the quality to create a less harsh filter.
Thanks for the input mate. From what I've seen, the quality doesn't have an effect on the jaggedness of the filter once it's rotated, but your right on with the suggestion of decreasing the strength. I wanted a fully opaque border so I assumed I should use full-strength but it seems that even a value of strength=150 works pretty well for that.
Thanks for the help.