[flexcoders] Drawing on skinned component

2009-02-20 Thread civilu007
Hello,

I'm trying to draw something on a component skinned using a Flash
skin, but nothing is drawn (or better said, I don't see anything
because the drawing is done beneath the skin).

My code looks something like

public class TestButton extends Button
{
  public function TestButton()
  {
super();
  }

  override protected function updateDisplayList(w:Number, h:Number):void
  {
super.updateDisplayList(w, h);

var g:Graphics = graphics;

g.moveTo(0, unscaledHeight / 2);
g.lineStyle(1, 0x00);
g.lineTo(unscaledWidth, unscaledHeight / 2);
  }
}

I have tried using a Sprite as the topmost child and drawing on it,
but apparently there's always something above my Sprite and I still
can't see what I draw.

I've googled and searched the group archives for a similar problem,
but either I'm not using the right search terms or nobody had such a
problem before because I can't seem to find anything of help.

So, does anybody have some pointers as to what might one do to draw on
such a component?

Thank you!



Re: [flexcoders] Drawing on skinned component

2009-02-20 Thread Laurent Cozic
 I have tried using a Sprite as the topmost child and drawing on it

I think that's the way to do it. To make sure that your  sprite is always on 
top, just add addChild(yourSprite) at the end of the updateDisplayList 
function. If the sprite is not on the display list, it's going to be added to 
it, and if it's already there, it's going to be pushed on top of all the other 
sprites.

--
Laurent Cozic

Flash, Flex and Web Application development
http://pogopixels.com

--- On Fri, 2/20/09, civilu007 civilu.gro...@gmail.com wrote:
From: civilu007 civilu.gro...@gmail.com
Subject: [flexcoders] Drawing on skinned component
To: flexcoders@yahoogroups.com
Date: Friday, February 20, 2009, 8:53 AM












Hello,



I'm trying to draw something on a component skinned using a Flash

skin, but nothing is drawn (or better said, I don't see anything

because the drawing is done beneath the skin).



My code looks something like



public class TestButton extends Button

{

  public function TestButton()

  {

super();

  }



override protected function updateDisplayList( w:Number, h:Number):void

  {

super.updateDisplay List(w, h);



var g:Graphics = graphics;



g.moveTo(0, unscaledHeight / 2);

g.lineStyle( 1, 0x00);

g.lineTo(unscaledWi dth, unscaledHeight / 2);

  }

}



I have tried using a Sprite as the topmost child and drawing on it,

but apparently there's always something above my Sprite and I still

can't see what I draw.



I've googled and searched the group archives for a similar problem,

but either I'm not using the right search terms or nobody had such a

problem before because I can't seem to find anything of help.



So, does anybody have some pointers as to what might one do to draw on

such a component?



Thank you!




 

  




 

















  

Re: [flexcoders] Drawing on skinned component

2009-02-20 Thread Alex Militaru
Thank you for your answer Laurent.

I was doing something similar, but more complicated: calling
addChild(sprite) in createChildren() and then setting the index of the
sprite to numChildren - 1 in updateDisplayList.

Apparently the answer is to wrap the sprite in a UIComponent and adding that
using addChild() (idea taken from
http://casario.blogs.com/mmworld/2008/01/adding-a-sprite.html).

I think the problem was that setting the position and size of the sprite
using its x, y, width and height properties didn't work as expected. And,
although I was setting the sprite to be as large as its parent, it had no
effect (from the docs: Except for TextField and Video objects, a display
object with no content (such as an empty sprite) has a width of 0, even if
you try to set width to a different value.).

Now, using move() and setActualSize() on the wrapper UIComponent does the
trick. It works even without adding the sprite and drawing directly on the
wrapper.

However, this raises another question: it seems that resizing the
UIComponent containing the Sprite, also resizes the Sprite; why wasn't the
Sprite resized when adding it directly to the component?

Alex

On Fri, Feb 20, 2009 at 4:20 PM, Laurent Cozic pogopix...@yahoo.com wrote:

I have tried using a Sprite as the topmost child and drawing on it

 I think that's the way to do it. To make sure that your  sprite is always
 on top, just add addChild(yourSprite) at the end of the updateDisplayList
 function. If the sprite is not on the display list, it's going to be added
 to it, and if it's already there, it's going to be pushed on top of all the
 other sprites.