The key pieces to this application are: SWFAddress helper class that uses AS3Signals, the application model, the view state model, a command to pass the application model parameters to SWFAddress, and a command to process SWFAddress changes and update the application model.

SWFAddress

You can grab the updated SWFAddress file here.  Right now it’s in the com.kilometer0 package, but you can move it to whatever package you want.  It’s not dependent on any files.

The relevant signals are:

/**
  * Dispatched when SWFAddress initializes.
  */
public var init:Signal;

/**
  * Dispatched when any value change.
  */
public var change:Signal;

/**
  * Dispatched when value was changed by Flash.
  */
public var internalChange:Signal;

/**
  * Dispatched when value was changed by Browser.
  */
public var externalChange:Signal;

Application Model

The application model class holds the variables that your application uses to build it’s state.  In my demo, I modify the ApplicationModel class whenever a user has performed an action that needs to update the state of the application.

public class ApplicationModel extends Actor
{
	public var option1:String;
	public var option2:String;
}

View State Model

I used the View State Model to hold values related to building views. In my demo, this is a super simple class that just has the current view name.  When the view name is changed, a ViewStateChanged signal is dispatched. This signal is a singleton managed by RobotLegs and is injected into the class when it’s instantiated.  This signal is handled by the MainUIMediator in the demo.  The mediator then calls the current view and tells it to hide, then creates the new view if it doesn’t exist already, then shows the new view.

public class ViewStateModel extends Actor
{
	[Inject]
	public var viewStateChanged:ViewStateChanged;

	protected var _viewName:String;

	public function get viewName():String { return _viewName; };
	public function set viewName(val:String):void
	{
		var changed:Boolean = val != _viewName;
		_viewName = val;
		if(changed)
			viewStateChanged.dispatch();
	}
}

The Change Application State Command

This command is wired to the ModifyApplicationState signal. When the signal is dispatched, this command gets executed. It takes the parameters from the ViewStateModel and ApplicationModel then converts them into a URL that is passed to SWFAddress. SWFAddress then modifies the browser address bar, which SWFAddress captures and in turn dispatches a signal letting the application know that the state has been modified.

public class ChangeApplicationStateCommand extends SignalCommand
{
	[Inject]
	public var appModel:ApplicationModel;

	[Inject]
	public var viewState:ViewStateModel;

	[Inject]
	public var swfAddress:SWFAddress;

	override public function execute():void
	{
		trace("ChangeApplicationStateCommand: execute");
		var url:String = "/"+viewState.viewName+"?";
		if(appModel.option1 != null)
			url+="op1="+appModel.option1;
		if(appModel.option2 != null)
			url+="&op2="+appModel.option2;

		swfAddress.setValue(url);

	}

}

The Application State Changed Command

This command gets fired when SWFAddress is modified. It parses the SWFAddress URL and parameters and sets them on the ApplicationModel and ViewStateModel.

public class ApplicationStateChangedCommand extends SignalCommand
{
	[Inject]
	public var viewState:ViewStateModel;

	[Inject]
	public var appModel:ApplicationModel;

	[Inject]
	public var swfAddress:SWFAddress;

	override public function execute():void
	{
		trace("ApplicationStateChangedCommand: execute");
		trace(swfAddress.getValue());

		appModel.option1 = swfAddress.getParameter("op1") as String;
		appModel.option2 = swfAddress.getParameter("op2") as String;

		viewState.viewName = swfAddress.getPath().substr(1);

	}

}

You can view the demo of the application and how it works here: /demos/sasrl/.

You can download the demo application source code here (Flex Builder AS3 Only project): SWFAddressSignalsRobotLegs.zip

I thought this might be useful to others starting out using AS3Signals and RobotLegs.

Check out the code and examples here: http://www.kilometer0.com/blog/code/swfaddress-and-as3signals/

Making the URL is simple, it looks something like this:

http://www.twitter.com/home?status=Your+Message+http://mylink.com

However, if you add an Ampersand (&) to the message it breaks the URL, like so:

http://www.twitter.com/home?status=Your+Message+&+something+http://mylink.com

You can escape the ampersand using %26, however it shows up as %26 in the actual message, like so:

http://www.twitter.com/home?status=Your+Message+%26+something+http://mylink.com

It seems that Twitter doesn’t want to use www.twitter.com as their main domain.  They want to use twitter.com, so they redirect.  When they redirect, it does encodes the previous url and passes it to the twitter.com domain.  So %26 turns into %2526 (%25 = %).

However, if you form your url to go directly to http://twitter.com it won’t do the redirect and it’ll work just fine.  So the final good url is:

http://twitter.com/home?status=Your+Message+%26+something+http://mylink.com

Last tip, if you use this method of posting to Twitter, make sure you send the user to http://twitter.com/home?status=your+message and not to http://twitter.com/?status=your+message.  The http://twitter.com URL works if you’re already logged in (which you might be if you’re developing the application), but if you have to login first, it won’t forward the message.  Going to the /home page will allow you login and then forward the message.

Also, when making the url’s make sure you use +’s and not %20′s.

I’m this blog post will outline steps I took to get setup. I often find blog posts like this helpful for people getting started. There are plenty of resources right now on it, but one more couldn’t hurt. I’m using Windows 7 64bit, so the issues I run into might or might not be related. Either way I’ll try to solve them along the way.

Initial downloads:

1. Eclipse 3.5 from http://www.eclipse.org/downloads/ Windows 32bit via BitTorrent
2. Android SDK from http://developer.android.com/sdk/index.html

Eclipse Setup:

1. Install Developer Tools using Eclipse Update from this site: https://dl-ssl.google.com/android/eclipse/
2. Restart Eclipse
3. Go to Preferences -> Android and enter in folder of Android SDK

Android SDK Setup:

1. Run SDK Setup.exe in the Android SDK directory.
2. If it can’t connect, go to “Settings” and select force https sources to be fetched using http (I had to do this).
3. I installed Documentation, USB Driver, SDK 2.0.1 (for Droid Phone), SDK 1.5 (for Droid Eris), and the respective Google Api’s (3 for 1.5 and 6 for 2.0.1)
4. Once Installed, click Devices.
5. Create 2 devices, one for each phone / SDK.
6. To setup the “Path”, Go to Start menu -> Right click on Computer -> select Properties -> Advanced Settings -> Environment Variables -> Find “Path” in the bottom list.
7. Copy / Paste your Android SDK / Tools directory from Explorer and add it to the end of the Path variable.  Ad

USB Driver Setup:

1. On the Phone go to Settings -> Application Settings -> Development -> Check USB Debugging
2. Plug in Phone to computer
3. Windows 7 said “Couldn’t find driver”.
4. Click on Start menu, right click Computer, click Manage, select Device Manager.
5. Find the Motorola device with the yellow yield icon.  Right click and select Update Device Software.
6. Select “Browse my computer”.  Point the search at the Android SDK -> USB Driver folder.

Now for the Hello World App. I used the tutorial here: http://developer.android.com/resources/tutorials/hello-world.html

When you have the phone plugged in via USB and you “Run” or “Debug” it’ll run on the phone if the emulator isn’t running.  It was weird at first, because I couldn’t figure out why it wasn’t showing up in the emulator.  I unplugged the phone, and the app ran in the debugger (which took a little while to load).  When running or debugging that application later, you can chose to run on the phone or the emulator.

Thats it for the “Hello World App”.  I then installed the “API Demos” app from here: http://developer.android.com/resources/samples/ApiDemos/index.html

Interesting things to note about the API Demo’s is the features that work in the emulator and those that don’t.  Like the camera based view had a demo video going, and the voice recognition part didn’t work.

Next up is what I hope is my first app for the Android, a Pantry Management System that will use the ZXing Barcode scanner API and allow you to catalog your pantry easily.

Source: http://www.kilometer0.com/blog/wp-content/uploads/2009/12/Mate_NYFlexUG.zip

*note* I didn’t make the diagrams. They were created by another blogger (whom I can’t seem to find at this moment). They were used without permission, so if you are the rightful owner and would like me to add attribution or remove the diagrams, let me know.