Comments on: Flex Reflections Component and Actionscript Class

By: Robert

Robert — Wed, 17 Mar 2010 16:24:43 +0000

Nice component.

Will work with video if you just plop a video object in a UIComponent wrapper but that’s not practical for most apps. Video components are usually wrapped in layout containers like Canvas. I can’t get it to reflect the contents of a Canvas so won’t work for my video. Shame. Like the look.

By: Robert

Robert — Thu, 25 Feb 2010 17:29:39 +0000

Has anyone tried to use this with an ActionScript video object? I have a Flex app with a custom player used for live streaming that is created in ActionScript (no mx:VideoDisplay object). I wrap the video object in a UIComponent to display. Tried targeting the UIComponent but get the “Invalid BitmapData” error on Reflect.as line 53.

By: niamath

niamath — Mon, 28 Dec 2009 11:24:29 +0000

Excellent component man, I need this exactly. thanks.

By: Andrew

Andrew — Sat, 26 Dec 2009 15:17:05 +0000

It doesn’t seem like you can reflect a Canvas. Or am I missing something? I get the error:

Type Coercion failed: cannot convert flash.display::Bitmap@160ddcb9 to mx.core.IUIComponent.

Any suggestions for a code modification to be able to allow any UIComponent as the source?

By: Peter Hastie

Peter Hastie — Wed, 02 Dec 2009 21:49:38 +0000

Thanks for sharing your components with the world, Seb! Very nice stuff.

Replacing the body of the createGradientBitmapData function with the following code should stop the black squares showing around non square reflections.

var colors:Array = [0x00000000, 0x00000000]; var alphas:Array = [this.alpha, 0]; var ratios:Array = [0, this.ratio]; var rotation:Number = 0.5;


			var gradientSprite:Sprite = new Sprite();
			// We only want the bitmap for the shape

			var image:Bitmap = new Bitmap(new BitmapData(_sourceBitmap.width, _sourceBitmap.height, true, 0x00000000));

			image.bitmapData.draw(_sourceBitmap);

			image.cacheAsBitmap = true;

			gradientSprite.addChild(image);
			// Lay the alpha gradient on top of the shape

			var gradientClip:Sprite = new Sprite();

			var matrix:Matrix = new Matrix();

			matrix.createGradientBox(image.width, image.height, rotation * Math.PI);

			gradientClip.graphics.beginGradientFill(GradientType.LINEAR, colors, alphas, ratios, matrix, SpreadMethod.PAD);

			gradientClip.graphics.drawRect(0,0,image.width,image.height);

			gradientClip.cacheAsBitmap = true;

			gradientSprite.addChild(gradientClip);
			// Mask the shape with the alpha gradient. Areas not covered by the shape will still have alpha = 0, even at the opaque

			// end of the gradient

			image.mask = gradientClip;

// Now write this as a bitmap _gradientBmd = new BitmapData(_sourceBitmap.width, _sourceBitmap.height, true, 0x00000000); _gradientBmd.draw(gradientSprite);

By: Paul

Paul — Thu, 12 Nov 2009 15:15:12 +0000

Hey, when I drop this reflection for an image, which has got a button under him, it makes that button unclickable, like it would be above him. Any ideas how to deal with it?

By: Purni

Purni — Tue, 18 Aug 2009 13:11:23 +0000

i am getting a black square for images while are in shapes other than square or rectangle… does anyone have solution for tat??

By: Elan

Elan — Wed, 03 Jun 2009 11:58:47 +0000

Hi,

Its working great but when use circle [transparent]image the reflection will appear only with black background so its looks like square.How do i handle it.

By: Mitesh panchal

Mitesh panchal — Thu, 21 May 2009 13:26:22 +0000

Hi,I have an image and i want to remove white color from image.That removing color is same like its background color.If anybody have any idea of this problem please reply me on mitesh@clientdriveninnovation.com .And my application in Flex 3 so please send me action script code of this problem.Thank you

By: admin

admin — Sun, 10 May 2009 08:12:07 +0000

I think it should work with png’s with transparency as well, give it a try and let me know