PDA

View Full Version : Using Sprite objects to draw to screen


meddlingwithfir
11-16-2006, 06:50 PM
How are these things supposed to be used? I'm apparently missing the mark. I figured I could use them to display images & shapes in my application. But it doesn't look like I can add them in my MXML or Actionscript:


<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute"
width="800"
height="600"
creationComplete="onLoad()"
>
<mx:Script>
<![CDATA[

private function onLoad():void
{
var square:Sprite = new Sprite();
square.graphics.beginFill(0xFF88CC);
square.graphics.drawRect(0, 0, 80, 80);
panel1.addChild(square);
}
]]>
</mx:Script>

<mx:Panel id="panel1"
x="0" y="1000"
width="50%"
height="80%"
title="panel1">
</mx:Panel>
<mx:Panel id="panel2"
x="400" y="1000"
width="50%"
height="80%"
title="panel2">
</mx:Panel>


</mx:Application>


Throws an error during runtime:

TypeError: Error #1034: Type Coercion failed: cannot convert flash.display::Sprite@4dee191 to mx.core.IUIComponent.
at mx.core::Container/http://www.adobe.com/2006/flex/mx/internal::addingChild()
at mx.core::Container/addChildAt()
at mx.core::Container/addChild()
at SpaceFlex/::onLoad()
at SpaceFlex/___Application1_creationComplete()
at flash.events::EventDispatcher/flash.events:EventDispatcher::dispatchEventFunctio n()
at flash.events::EventDispatcher/dispatchEvent()
at mx.core::UIComponent/set initialized()
at mx.managers::LayoutManager/::doPhasedInstantiation()
at Function/http://adobe.com/AS3/2006/builtin::apply()
at mx.core::UIComponent/::callLaterDispatcher2()
at mx.core::UIComponent/::callLaterDispatcher()

So I can see that a Sprite isn't of IUIComponent -- so it won't let me add it directly to the panel or to the application. How am I supposed to use these things in my Flex application? I checked out the livedocs: http://livedocs.macromedia.com/flex/2/langref/flash/display/Sprite.html and I don't see why their subclass of Sprite would work, while a regular plain-jane Sprite wouldn't. It doesn't look like they've made any conversion of the Sprite to a IUIComponent...

Pretty much all I'm after is trying to programatically draw a square (or whatever other shape my miniscule brain can conjure :)) and display that to the screen.

CDHBookingEdge
11-16-2006, 07:14 PM
Trying to work this out in my head too so forgive me, and based on the fact that I'm kinda working "crippled" here at the moment, kinda bear with me.

Sprite is a subclass of ...never mind..LOL here might be the answer.

Try using FlexSprite (http://livedocs.macromedia.com/flex/2/langref/mx/core/FlexSprite.html) In the documentation for it, it says: FlexSprite is a subclass of the Player's Sprite class and the superclass of UIComponent. It overrides the toString() method to return a string indicating the location of the object within the hierarchy of DisplayObjects in the application.

Also since FlexSprite is in mx.core and therefore in the Flex 2 SDK you can look at it's implementation to see how they did it and if it doesn't quite work for you, maybe use some similar concepts, to make something that will work.

See if that works for you and let us know. ;-)

Christopher

Tink
11-16-2006, 07:25 PM
Anything added to a UIComponent needs to be a UIComponent. A Sprite is not, you would use it for Flash and ActionScript projects.

If you really want to use Sprites you can add them as a rawChild or components that have rawChildren

var square:Sprite = new Sprite();
square.graphics.beginFill(0xFF88CC);
square.graphics.drawRect(0, 0, 80, 80);
panel1.rawChildren.addChild(square);

Also if you were just drawing, you be bext of using a Shape instead of a Sprite.

CDHBookingEdge
11-16-2006, 08:07 PM
Interesting! So what the heck is a FlexSprite and where would you really use it?

CDHBookingEdge
11-16-2006, 08:28 PM
Interesting! So what the heck is a FlexSprite and where would you really use it?

CDHBookingEdge
11-16-2006, 08:29 PM
Sorry for the double post, apparently AS.org wasn't responding or such.

meddlingwithfir
11-16-2006, 08:36 PM
CDH -- It sounds like FlexSprite is what you should use, from what you said. But if it's a superclass to UIComponent, wouldn't that mean that it is not in-itself a UIComponent, and therefore I'd get the same error as before?

Tink -- would that be considered a "dirty" way to get the functionality I'm looking for (just drawing a simple shape to the screen programatically), or is that the expected method?

CDHBookingEdge
11-17-2006, 01:03 AM
You might need to cast it to a UIComponent, true. (Ducks at the castigation I might receive for throwing that out there. And hopefully not other words that beging with cast LOL) But if you cast it shouldn't you be able to "cirumvent" the compiler error?

Laughs at myself after having deleted what I was going to write, about 3 or 4 times.

Tink's probably got the best idea. He usually does. ;-)

Christopher

meddlingwithfir
11-17-2006, 02:58 AM
Haha :D I get the same impulses too! Just try anything and everything that might work :)

I'll give the casting thing a try tomorrow, along with Tinks suggestion. It just seems like I'm going about this wrong though -- like there should be some other class out there for me to use (this seems like fighting an uphill battle for what I think should be a fairly trivial task...). And usually when that happens, it means I'm doing something wrong :D

dr_zeus
11-17-2006, 04:48 PM
You could instantiate a UIComponent and draw to that:

private function onLoad():void
{
var square:UIComponent = new UIComponent ();
square.graphics.beginFill(0xFF88CC);
square.graphics.drawRect(0, 0, 80, 80);
panel1.addChild(square);
}

The reason you're receiving this error is because Flex Containers expect to receive UIComponents as children. Containers need access to certain functions and properties of UIComponents to position them properly. Tink suggested using rawChildren, which is used internally by the Panel to attach it's skin pieces that aren't UIComponents.

Tink
11-17-2006, 05:05 PM
You might need to cast it to a UIComponent,The cast would fail as FlexSprite is not a subclass of UIComponent.

rawChildren is probably best avoided. Its not wrong, but still..

As Josh says you could use a UIComponent to achieve what your after, but it seems a shame to add all that extra overhead of a UIComponent, when all you really require is a simple graphics object.

I'd go for using the grapgics object of your panel and drawing into thatpanel1.graphics.beginFill(0xFF88CC);
panel1.graphics.drawRect(0, 0, 80, 80);although I'm not sure whether that will appear above rawChildren or below it. It is appears below, you'll have to go with UIComponent.

dr_zeus
11-17-2006, 06:07 PM
If I remember correctly, rawChildren actually contains all children of the Container. The implementation of Container makes it so that the standard display list functions (getChildAt, addChild, removeChild, etc) can only access the contained children. rawChildren is there so that you can go nuts and play with any child on the container's display list.

CDHBookingEdge
11-17-2006, 06:38 PM
And wasn't the separation done in the first place, (at least partly) to "hide" the skins from the child list? I seem to remember something about that.

Christopher

Tink
11-17-2006, 07:02 PM
And wasn't the separation done in the first place, (at least partly) to "hide" the skins from the child list?it would make sense. it would be a right pain having to allow for those when dealing with the DisplayList.

dr_zeus
11-17-2006, 09:46 PM
I'm pretty sure everyone understands, but I should add that it's not just for skins, but also subcomponents that aren't contained. For example, the Panel has scrollbars, and those only appear in the rawChildren.

CDHBookingEdge
11-17-2006, 09:59 PM
Sorry about that I did misstate that about..essentially any "chrome" right?

meddlingwithfir
11-19-2006, 12:29 AM
Wow, thanks for the responses! Where do you guys get all this information about the inner workings of Flex? I've poke around the livedocs when I get a chance, but I don't recall seeing the inner workings such as this being discussed there...

Just curious -- there seems to be a source of Flex info that I don't know about.

CDHBookingEdge
11-19-2006, 05:44 AM
I, personally don't think you've missed anything. You just picked up on what you read and I picked up on what I read. The way I looked at it was a point of, ok so this is how they plan on doing it (or more appropriately how they've done it) now a) why is that? b) could it be done better? c) is there a way to get "around" it?

In other words, it was your problem. Therefore you were focused on the problem. You were saying to yourself "Da** it! I need to get this stuff done and out of my way or...<insert whatever negative things you want.>" Where as we, or at least I, was thinking "Da** this sounds like something fun to investigate!" Of course Tink and Zeus are just saying what they said because they are smart and have been down this way before. ;-)

You saw things I didn't and I saw things you didn't. Honestly if you were to ask me where I exactly learned the word chrome, or to an extent any of this stuff I'm not sure I could tell you. That's why we all work together. ;-)

Sorry, I think I spent too much time tonight dealing with the family LOL

I'll shut up now!
LOL

Christopher

dr_zeus
11-20-2006, 07:31 PM
Where do you guys get all this information about the inner workings of Flex? I've poke around the livedocs when I get a chance, but I don't recall seeing the inner workings such as this being discussed there...

Personally, I've read through many parts of the source code for the Flex framework. When I create custom components, I try to match the Flex team's architecture and practices so that I know my components will work the same. I've also chatted with folks involved with Flex at Adobe, and I've watched quite a few presentations from them at MAX and other events.

I highly recommend checking out the source code provided with the free SDK and Flex Builder. You'll be amazed at how much you'll learn (and didn't know existed).

Tink
11-21-2006, 10:39 AM
Where do you guys get all this information about the inner workings of Flex? I've poke around the livedocs when I get a chance, but I don't recall seeing the inner workings such as this being discussed there...i had a crazy dream where the adobe angel came down to give me all the info ;)

meddlingwithfir
11-21-2006, 03:00 PM
:D I need to start sleeping more then -- it'd increase my odds of being visited!

Tink
11-21-2006, 03:15 PM
recreational drugs can also help

CDHBookingEdge
11-21-2006, 06:15 PM
Ya gotta sleep to have them visit you? What are they Santa's Elves? Jeez! Now ya tell me! And Tink, I'm not gonna touch that recreational drug statement except to say that you need to make sure you take the right ones. *grin* As I've said about myself a time or two (and other members of my family as well) could you imagine if I was doing uppers?

Sorry, it's been a long day, week, LOL lifetime even, and needed to say something silly. ;-)

jwd
05-04-2008, 08:41 PM
I know this thread is old, but in case someone _just_ wants to draw something to the screen in Flex... the easiest way is to create a Canvas, request its graphics object, and then use it to draw directly on the canvas.

There may be instances when you'd want to use a FlexSprite, but if all you want to do is draw something, save yourself the headache. This technique generalizes to most other Flex controls/containers (Button, Panel, etc.) as well.