Button not appearing

17 posts

Flag Post

I extended the simplebutton class to create a button based off of a single displayobject that would be modified in the child class’s constructor to create the button state displayobjects for the simplebutton constructor. The trouble is, the button doesn’t show up when I add it to the stage.

	public class ImageButton extends SimpleButton 
	{
		public function ImageButton(image:DisplayObject) 
		{
			var up:Sprite = new Sprite();
			up.addChild(image);
			
			var over:Sprite = new Sprite();
			over.addChild(image);
			
			var down:Sprite = new Sprite();
			down.addChild(image);
			
			super(up, over, down, up);
		}
	}

Now I know it works because if I replace super(up, over, down, up) with super(image, over, down, image) then the button shows up. How do I fix this problem? Thanks in advance!

 
Flag Post

A DisplayObject can only be added to one DisplayObjectContainer.

Why do you want to use different containers for the same thing.
Explain in detail what you actually want to achieve, not the solution you came up with.

 
Flag Post

Like I said, I want a button that takes in a single image and creates the button states by itself from the image. For example, the button might take in a picture and create different versions of the picture for the button states so that the button wouldn’t look static when you click it. This is not the “solution I came up with”, but the code for how far I got in solving the problem.

 
Flag Post

Your solution is to add the image to multiple containers, which is not possible.

Originally posted by Arloistale:

the button might take in a picture and create different versions

What do you want those different versions to look like?

Your goal is different from the intent of the SimpleButton class.
Sure, you can try to bend it to your will, but why do it the complicated way?

 
Flag Post
Originally posted by Arloistale:

Like I said, I want a button that takes in a single image and creates the button states by itself from the image. For example, the button might take in a picture and create different versions of the picture for the button states so that the button wouldn’t look static when you click it. This is not the “solution I came up with”, but the code for how far I got in solving the problem.

Point is you have added the image to FOUR containers. The only place it will exist is inside down.

 
Flag Post

I want the up state to be the original image, the over state to be the image with a light transparent filter over it, and the down state to be the image with a heavy transparent filter over it. The reason I had a container for the each up over and down states is that I decided that it was easiest to add the image to a container and then add a transparent white foreground over it.

 
Flag Post

You still have to duplicate the original image.

I bet if you did this:

	public class ImageButton extends SimpleButton 
	{
		public function ImageButton(image:DisplayObject) 
		{
			var over:Sprite = new Sprite();
			over.addChild(image);
			
			var down:Sprite = new Sprite();
			down.addChild(image);

			var up:Sprite = new Sprite();
			up.addChild(image);
			
			super(up, over, down, up);
		}
	}

Your button would be visible…until you rolled over it.

 
Flag Post

So what is the best way to duplicate the image? Should I use bitmaps instead of displayobjects for the original image?

 
Flag Post
Originally posted by Arloistale:

Should I use bitmaps instead of displayobjects for the original image?

Bitmap is a DisplayObject.
Your image is a Bitmap.

Originally posted by Arloistale:

So what is the best way to duplicate the image?

Why do you insist on duplicating the image?
You said yourself that your goal is to have one.

As said, the idea behind the SimpleButton is different from what you want to do, because you have one image.
You could use it to display the overlays if you really want to.

 
Flag Post

You can use a Sprite subclass and give it the properties of a button.
In that case, you would extend Sprite, addChild your image to the Sprite, create whatever overlays and effects you want and then link applying them to the appropriate MouseEvents: MOUSE_OVER and MOUSE_DOWN. The listeners should be placed on the Sprite.
Please note I said a Sprite subclass and not a Bitmap subclass because for some absurd reason Adobe made it so that Bitmaps can’t have children, and don’t properly dispatch events.

You can use a SimpleButton subclass and use several copies of your image. Take one image as parameter, and assign a new Bitmap to each state of the button. then for each state make its BitmapData a new BitmapData using the the dimensions of the image, and copyPixels() the contents of the image’s bitmapData into each state’s bitmapData. For each state apply the appropriate filters and transformations to the bitmapData.

 
Flag Post
Originally posted by Ace_Blue:
Please note I said a Sprite subclass and not a Bitmap subclass because for some absurd reason Adobe made it so that Bitmaps can’t have children, and don’t properly dispatch events.

It actually makes more sense that Bitmap is not a DisplayObject container because its purpose is to display BitmapDatas.
It dispatches the events it is supposed to dispatch just fine.

Originally posted by Ace_Blue:
then for each state make its BitmapData a new BitmapData using the the dimensions of the image, and copyPixels() the contents of the image’s bitmapData into each state’s bitmapData. For each state apply the appropriate filters and transformations to the bitmapData.

Why copy if you can clone?
Then again, why would one change the model if what you actually want to have is a different view of the same model?

 
Flag Post
Originally posted by NineFiveThree:
Originally posted by Ace_Blue:
Please note I said a Sprite subclass and not a Bitmap subclass because for some absurd reason Adobe made it so that Bitmaps can’t have children, and don’t properly dispatch events.

It actually makes more sense that Bitmap is not a DisplayObject container because its purpose is to display BitmapDatas.
It dispatches the events it is supposed to dispatch just fine.

I’m talking about this:
“The Bitmap class is not a subclass of the InteractiveObject class, so it cannot dispatch mouse events. However, you can use the addEventListener() method of the display object container that contains the Bitmap object.”
That’s lazy. If it can be displayed, then someone is bound to click on it. It should be able to handle that. As for making Bitmap a leaf class, there is no justification whatsoever for the restriction. It’s a purely arbitrary constraint.

Originally posted by NineFiveThree:
Originally posted by Ace_Blue:
then for each state make its BitmapData a new BitmapData using the the dimensions of the image, and copyPixels() the contents of the image’s bitmapData into each state’s bitmapData. For each state apply the appropriate filters and transformations to the bitmapData.

Why copy if you can clone?

Because clone is used to make copies of BitmapData instances, and that’s all it’s good for. copyPixels does so much more. If I’m going to introduce the OP to a new function I’d rather show him one that can do a bunch of other things as well.

Other than that, I’m just offering practical solutions. Sure, I could have spent 4 posts just in this thread pointing out all the ways that other people are wrong Wrong WRONG, but I find it ultimately counter-productive. I’d rather help the OP solve his problem, even if that means I don’t get to chide him or anyone else for being such lousy programmers in the process. I guess we all have our priorities.

 
Flag Post

Thanks so much Ace; I used bitmaps for the states and it was easy to duplicate the original. However, I would like to know all those bad practices that I have so I can get rid of them, if you have the time to point them all out.

 
Flag Post

Glad I could be of help. And no, I don’t have either the time nor the inclination to catalog everything you do that I would do differently. Truth be told, as long as your code runs smoothly, does what you want and is readable, it doesn’t really matter how you code. If you want to improve, keep coding. Programming is a craft, you learn it by doing it. There are also very good books on programming that can impart much greater insights than I could in a forum post.

 
Flag Post
Originally posted by Ace_Blue:

Because clone is used to make copies of BitmapData instances, and that’s all

…you want to do in this scenario.

Originally posted by Ace_Blue:

copyPixels does so much more. If I’m going to introduce the OP to a new function I’d rather show him one that can do a bunch of other things as well.

Then why not recommend using draw()?
Or set- and getVector()? You can do so much more with them…
The goal of this thread is not necessarily to introduce any new functions but to help solve the actual problem.

Originally posted by Arloistale:

However, I would like to know all those bad practices that I have so I can get rid of them, if you have the time to point them all out.

Don’t copy BitmapData objects if you don’t have to.

 
Flag Post

If I can borrow some more of your guys time, how can I put transparent filters over the original image to make the darkened versions of the image for the over and down states?

 
Flag Post

Use a darker overlay DisplayObject or simply apply a ColorTransform to “image”.