 |
| Author |
Message |
|
fluffypilla
Member
Joined: Tue May 16, 2006 11:30 pm Posts: 46
|
 AS3 Project
Trying to wrap my head around AS3 and using it in FD... but I can't even seem to get a simple project working. Could someone tell me what is wrong with this?
Code: /** * @mxmlc -default-size 400 300 */ package { import flash.display.Sprite; import mx.controls.Alert; public class Application extends Sprite { public function Application() { Alert.show("Hello World"); } } }
|
| Thu Feb 15, 2007 1:35 pm |
|
 |
|
zeus
Member
Joined: Tue Nov 08, 2005 5:49 pm Posts: 190 Location: Silicon Valley
|
You can't mix Flex components like Alert with a basic ActionScript project. There's a ton of bootstrapping and initialization code that gets included when you make an MXML Application.
_________________ Josh
zeuslabs.us
|
| Thu Feb 15, 2007 5:30 pm |
|
 |
|
Aphex
Member
Joined: Sun Sep 17, 2006 3:03 am Posts: 40
|
Hey I hope this helps, but a Alert is a Flex Component which, from what I gather, needs a MXML file to be used.
Here is a really simple AS 3 only file you can start with that doesn't have any components.
//Application.as
Code: /** * @mxmlc -default-size 300 300 */ package { import flash.display.*
public class Application extends Sprite{ function Application(){ this.graphics.beginFill(0xff0000); this.graphics.drawCircle(100, 100, 20); } } }
If you want to use your example you could throw together something simple like this. //Demo.mxml Code: <!-- @mxmlc -default-size 400 300 -incremental=false --> <MainApp xmlns="*"/>
//MainApp.as Code: package { import mx.core.* import mx.events.FlexEvent; import mx.skins.halo.HaloBorder; import mx.controls.Alert public class MainApp extends Application{ function MainApp(){ super(); this.layout = "vertical"; this.setStyle("borderSkin",mx.skins.halo.HaloBorder); this.addEventListener(FlexEvent.APPLICATION_COMPLETE, alertListener); }
private function alertListener(e:FlexEvent):void { Alert.show("Test BOX!", "Alert Box", Alert.OK, this); } } }
When you compile the Demo.mxml file you should get your alert box. Hope this helps!
-ross
|
| Thu Feb 15, 2007 5:35 pm |
|
 |
|
twalling
Member
Joined: Fri Feb 17, 2006 3:39 pm Posts: 49 Location: Boston
|
You don't have to use a MXML file to use Flex components. You can go either route, actionscript file or mxml file.
|
| Thu Feb 15, 2007 5:40 pm |
|
 |
|
Aphex
Member
Joined: Sun Sep 17, 2006 3:03 am Posts: 40
|
Really? That would be awesome.
Can you post a simple demo of creating a alert box or something like that?
-ross
|
| Fri Feb 16, 2007 4:04 pm |
|
 |
|
zeus
Member
Joined: Tue Nov 08, 2005 5:49 pm Posts: 190 Location: Silicon Valley
|
twalling wrote: You don't have to use a MXML file to use Flex components. You can go either route, actionscript file or mxml file.
Well, you need at least one MXML file, so yes, you need MXML.
_________________ Josh
zeuslabs.us
|
| Fri Feb 16, 2007 5:49 pm |
|
 |
|
twalling
Member
Joined: Fri Feb 17, 2006 3:39 pm Posts: 49 Location: Boston
|
I meant in the general sense of the actual use of Flex components. When you create a new application in Flex Builder, it creates a MXML file for you, which extends Application. You should make this your starting point. I think the above example could be simplified as follows:
MainApp.mxml
Code: <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" creationComplete="onCreationComplete()" > <mx:Script> <![CDATA[ import mx.controls.Alert; private function onCreationComplete():void { Alert.show("Test BOX!", "Alert Box", Alert.OK, this); } ]]> </mx:Script> </mx:Application>
That's it, one file. The previous example is confusing because in the file MainApp.as, the class is importing mx.core.* which includes an Application class that Flex uses. In this case, I don't think the user's own custom Application.as is even being used.
It's important to use the base Application class in a MXML file so that the compiler generates various CSS initialization code.
|
| Fri Feb 16, 2007 6:31 pm |
|
 |
|
adampasz
Member
Joined: Sun Mar 05, 2006 4:48 pm Posts: 40 Location: San Francisco
|
Thanks for this discussion, everyone. Until now, I was baffled as to why I couldn't use AS3 to create components. I don't like the idea of embedding code within the MXML, so Aphex's example seems like a compelling alternative. Twalling, I don't understand what you mean by their "custom Application.as file".
|
| Sun Feb 18, 2007 3:51 pm |
|
 |
|
twalling
Member
Joined: Fri Feb 17, 2006 3:39 pm Posts: 49 Location: Boston
|
Embedding code within a MXML file is common, I wouldn't write it off completely. Unfortunately right now FD doesn't have support for actionscript within a MXML file. I'm not advocating putting lots of business logic in MXML, I'm just saying there's nothing wrong with putting some in there. I view MXML and actionscript classes as one in the same really. MXML is converted to classes by the compiler, you can actually pass a flag to the compiler to keep the generated code to see what it looks like.
Regarding the Application file I was referring to. Application is a special class in the Flex package, all I was pointing out was that in the example provided, I failed to see how the custom Application class was being differentiated from the flex Application class.
I think there's a bit of confusion within this thread and I'd like to point out a few things. There's an important distinction to be made between creating an Actionscript 3 project and a Flex project. Since it seemed the title of the thread had to do with AS3 and how it relates to FD I think it's important that this distinction is pointed out.
If you want to create a Flex app, meaning you're going to be using classes in the mx.* package, then you should start with a base MXML file which uses the Application tag/class.
If you want to create an AS3 project, which only uses classes in the flash.* package you don't need to follow the above guidelines. You can simply extend Movieclip or Sprite, write an actionscript file which you pass to the compiler.
|
| Sun Feb 18, 2007 5:20 pm |
|
 |
|
twalling
Member
Joined: Fri Feb 17, 2006 3:39 pm Posts: 49 Location: Boston
|
zeus wrote: Well, you need at least one MXML file, so yes, you need MXML.
Technically, that's not true.  I'm playing devil's advocate here just because I think understanding the compiler and what it does to MXML files is useful.
Like I mentioned before, there is a certain amount of CSS initialization that is done by the compiler through code that is auto-generated. Here's a working example of an application that drops a "hello world" Label into a class which extends Application.
Code: package { import mx.core.Application; import mx.events.FlexEvent; import mx.styles.StyleManager; import mx.styles.CSSStyleDeclaration; import mx.controls.Label; import mx.skins.halo.HaloBorder;
public class MainApp extends Application { public function MainApp() { super(); this.layout = "absolute"; this.addEventListener(FlexEvent.CREATION_COMPLETE, handleComplete); setupStyles(); } private function setupStyles():void { var style:CSSStyleDeclaration = new CSSStyleDeclaration(); style.setStyle("borderSkin", mx.skins.halo.HaloBorder); StyleManager.setStyleDeclaration("Application", style, false); style = new CSSStyleDeclaration(); style.setStyle("textAlign", "left"); style.setStyle("fontAntiAliasType", "advanced"); style.setStyle("fontGridFitType", "pixel"); StyleManager.setStyleDeclaration("Label", style, false); } private function handleComplete(event:FlexEvent):void { var label:Label = new Label(); label.text = "hello world"; addChild(label); } } }
As you can see I had to jump through some hoops to get the required style information included in the app. If you add the "-keep" option to your compile, you'll see all of the CSS style information generated for you.
|
| Tue Feb 20, 2007 12:02 am |
|
 |
|
fluffypilla
Member
Joined: Tue May 16, 2006 11:30 pm Posts: 46
|
Thanks for all the help/discussion. As you could probably see from the post I really don't know much about AS3 or FLEX. I am trying to get into both and understand what they can do. Without project templates in FD for AS3 project or a FLEX App I was trying to write simple project (hello world) templates to start from.
Also since we are on this topic does anyone know of a good source for Flex 2 or AS3 tutorials? I keep finding stuff even on Adobe's site that seems to no longer work.
|
| Tue Feb 20, 2007 12:39 am |
|
 |
|
Philippe
Admin
Joined: Wed Aug 31, 2005 7:27 am Posts: 7471 Location: Paris, France
|
fluffypilla wrote: Thanks for all the help/discussion. As you could probably see from the post I really don't know much about AS3 or FLEX. I am trying to get into both and understand what they can do. Without project templates in FD for AS3 project or a FLEX App I was trying to write simple project (hello world) templates to start from.
Also since we are on this topic does anyone know of a good source for Flex 2 or AS3 tutorials? I keep finding stuff even on Adobe's site that seems to no longer work.
There is a good list of information/tips to get started:
http://www.kirupa.com/forum/showthread.php?t=223798
|
| Tue Feb 20, 2007 7:55 am |
|
 |
|
twalling
Member
Joined: Fri Feb 17, 2006 3:39 pm Posts: 49 Location: Boston
|
All of the stuff up on the Flex Developer Center should be up to date for Flex 2.
http://www.adobe.com/devnet/flex/
|
| Tue Feb 20, 2007 1:15 pm |
|
 |
|
zeus
Member
Joined: Tue Nov 08, 2005 5:49 pm Posts: 190 Location: Silicon Valley
|
twalling wrote: Technically, that's not true.  I'm playing devil's advocate here just because I think understanding the compiler and what it does to MXML files is useful.
Sure, if you want to handle all that initialization code yourself, you can do it. Let's be honest, though. If you want much more complexity than a single Label, you're going to be writing a lot more extra code.
_________________ Josh
zeuslabs.us
|
| Tue Feb 20, 2007 5:39 pm |
|
 |
|
twalling
Member
Joined: Fri Feb 17, 2006 3:39 pm Posts: 49 Location: Boston
|
zeus wrote: Sure, if you want to handle all that initialization code yourself, you can do it. Let's be honest, though. If you want much more complexity than a single Label, you're going to be writing a lot more extra code. exactly tswalling wrote: As you can see I had to jump through some hoops to get the required style information included in the app. If you add the "-keep" option to your compile, you'll see all of the CSS style information generated for you.
|
| Tue Feb 20, 2007 6:20 pm |
|
|
Who is online |
Users browsing this forum: No registered users and 0 guests |
|
You cannot post new topics in this forum You cannot reply to topics in this forum You cannot edit your posts in this forum You cannot delete your posts in this forum
|
|
 |