Brightworks has a nice collection of links for “Graphics, Skinning, Themes, CSS, etc.” All the stuff you should be up on if you’re doing RIA’s.

By the way, I stumbled on some great Flash games by Bloc by way of a post on DrawLogic. When I see great stuff like this, and then I read that the developers are pumping them out in a matter of weeks (read the notes below), I say to myself “What??!!” … no, no, I mean, I say to myself, “what a cool time to be doing Flash when so many smart people are making great stuff.” Yes, that is what I say. Now, back to those links…gotta…learn…more….

So I was doing just find until I started adding all kinds of assets to my Flex Builder Project. After throwing in a bunch sound files, video files and numerous .png assets, Flex Builder app starting crashing during the build, complaining about the JVM Heap Space…or rather the lack of it.

I found this post which seemed to provide the solution: increase the size of the heap space through the Flex Builder’s .ini file.

However, don’t do this real fast like I did and then wonder why nothing happened: It turns out on my system that there were two directories for Flex Builder:

C:\Program Files\Adobe\Flex Builder 3\FlexBuilder.ini

and

C:\Program Files\Flex Builder 3\FlexBuilder.ini

I changed the .ini in the first one, which was NOT the right one. I only later realized that there was another installation directory. So, changing the second .ini file did the trick.

Update: if you try to increase your JVM heap space past a certain value, Flex Builder won’t start up. There’s a bug report on the Adobe bug tracking site, but it somehow got marked not a bug. Hmm…I still feel strongly about it being a bug since I can’t kick my heap space up to 1536MB.

In the meantime, I picked up a tip from Riyad on EclipseZone about setting -Xms and -Xmx to the same value to improve performance.

So, my .ini file now looks like

-vmargs
-Xms1024m
-Xmx1024m
-XX:MaxPermSize=256m
-XX:PermSize=64m
-Djava.net.preferIPv4Stack=true

but I still want it to look like

-vmargs
-Xms1536m
-Xmx1536m
-XX:MaxPermSize=256m
-XX:PermSize=64m
-Djava.net.preferIPv4Stack=true

Here’s somebody else wrestling with the same problem.

I’m still trying to get the hang of how the Cairngorm framework uses RemoteObjects. For the uninitiated (and you do get initiated, kind of like a beat-in) Cairngorm is a Model-View-Controller framework used to organize and structure your ActionScript code in Flex.

When using RemoteObjects in Cairngorm and Flex, everything is fine if you know the URL of your endpoints beforehand. You configure your services-config.xml file, setup some RemoteObject tags in your Services.mxml file, and away you go.

But what if you want to select an endpoint at runtime? In my application, when a user logs in they can select from a number of servers.

This list of servers is downloaded from a main “Admin” server when the user first launches the app (it’s a desktop application composed of a swf wrapped in Multidmedia’s Zinc program).

As I mentioned above, setting up your RemoteObjects with Cairngorm and Flex takes a couple steps. First, you describe the endpoints of your services in the services-config.xml file. I won’t go into the whole format of this .xml file here; the important point for this discussion is that the endpoint information is placed in an <endpoint> tag.

<endpoint uri="http://myCrazyRailsApplicationWithWebOrb.org:3000/weborb" class="flex.messaging.endpoints.AMFEndpoint"/>

You’ll notice in the URL that I’m using WebORB, a remoting gateway that connects Flex to my Rails app.

Next, you use the Cairngorm convention of creating RemoteObject tags in a Services.mxml file in order to make them available to your application through the Cairngorm ServiceLocator class.

Here’s a portion of my Services.mxml file with one service that handles login:

<cairngorm:ServiceLocator   xmlns:mx="http://www.adobe.com/2006/mxml"

                            xmlns:cairngorm="http://www.adobe.com/2006/cairngorm">



    <mx:RemoteObject   id="UserService"

                        destination="UserService"

                        showBusyCursor="true"

                        result="event.token.resultHandler( event );"

                        fault="event.token.faultHandler( event );">

                                                



    </mx:RemoteObject>



</cairngorm:ServiceLocator>

Now, whenever I need to call my service, I create an instance of the service and issue the calls. In Cairngorm, this usually happens in a Delegate object.

myService= ServiceLocator.getInstance().getRemoteObject( "ScenarioService" )

However, here’s problem: the Cairngorm ServiceLocator returns a Remoting object of type mx.rpc.remoting.RemoteObject. Unfortunately, with this class there isn’t (I think) a way to change the endpoint parameter to a different URL.

There is another RemoteObject class, extended directly from mx.rpc.remoting.RemoteObject. It’s mx.rpc.remoting.mxml.RemoteObject! (Thanks to Temujin for making this clear to me.)

This class does allow you to set the endpoint parameter. Since the RemoteObjects held by the Cairngorm ServiceLocator are actually of this type, all you need to do is cast the returned RemoteObject to it and then set the new endpoint:

myService = mx.rpc.remoting.mxml.RemoteObject (ServiceLocator.getInstance().getRemoteObject("ScenarioService" ))

service.endpoint = myNewEndpointURL

I’m probably misunderstanding how the framework should be used. Why would Cairngorm return the more generic superclass of RemoteObject? Alas, my app is working now so that ugly friggin’ cast is staying there.

So the problem today was getting a component created in CS3 and exported as a Flex UI component to resize gracefully in Flex. I wanted the component to show a nice grid beneath an object, and when resized, the grid should expand but the object should stay the same size.

My component should go from this:

To this:

Writing the code for drawing the grid was no problem. The difficulty centered around knowing when the component was resized.

The first approach was to add listeners to stage resizes within my “ZoneSelector” CS3 component:

[code lang="actionscript"]
public function ZoneSelector(){
    stage.scaleMode = StageScaleMode.NO_SCALE
    stage.align = StageAlign.TOP_LEFT
    stage.addEventListener(Event.RESIZE, resizeHandler)
}
public function resizeHandler(event:Event)
{
    //do stuff with the stageWidth and stageHeight info
    mcBG.width = stage.stageWidth
    mcBG.height = stage.stageHeight
}
[/code]

The component tested fine within CS3. But when I embedded my component in flex…

[code lang="html4strict"]

[/code]

… I started getting an insidious “null reference” error. It turns out that the .swc component doesn’t have a reference to the Stage even after the Flex container has launched a creationComplete event.

So, I switched things around and added a listener to the ZoneSelector constructor so I knew when the stage was available…

[code lang="actionscript"]
public function ZoneSelector()
{
    addEventListener("addedToStage", onAddedToStage);
}
public function onAddedToStage(event:Event):void
{
    //now I'll get stageWidth and stageHeight and do something with it
}
[/code]

But OH NO things are not that easy. In doing this I discovered that the Stage is really the stage for the entire Flex application, not the immediate parent container of my component. To the chorus of voices snickering “read the API” I say to you “BAH!”

So, my final solution was to add a function within my component that handled size updates, and then called that function whenever the Flex container object received a size event

In the component I have the function

[code lang="actionscript"]
public function setComponentSize(w:Number, h:Number):void
{
    //do something with the width and height sent in from outside
}
[/code]

and in my Flex .mxml I have..

[code lang="html4strict"]

[/code]

When the Flex application is resized, the zsCanvas has a resize event, which calls the setComponentSize function in the component.

There are probably much better ways to do this and no better way to tell the world than to describe them in a comment below.

I’m gonna get that frog.