dispatchEvent

2. create a customized state interface for this application

This interface should contain any methods that are state dependent.

IBreakfastMakerState.as
[ftf]
package
{
public interface IBreakfastMakerState extends ILogicalState
{
function get breakfastInstructions():String;
function get breakfastLabel():String;
}
}
[/ftf]
Note that this interface extends ILogicalState.

3. create state classes

I’ll create two different state classes, one for English breakfast and one for French Breakfast. Each will implement the IBreakfastMakerState interface and will provide the functionality needed to prepare the appropriate breakfast.

EnglishBreakfastState.as
[ftf]
package
{
public class EnglishBreakfastState implements IBreakfastMakerState
{
public function get name():String
{
return “English”;
}

public function get breakfastInstructions():String
{
return “Fry eggs” +
“\nToast bread” +
“\nFry tomatoes” +
“\nMake tea”;
}
public function get breakfastLabel():String {
return “Make Breakfast”;
}
}
}
[/ftf]

FrenchBreakfastState.as
[ftf]
package
{
public class FrenchBreakfastState implements IBreakfastMakerState
{
public function get name():String
{
return “French”;
}

public function get breakfastInstructions():String
{
return “Tartiner du beurre sur baguette” +
“\nMettre le yaourt dans un bol” +
“\nTranche les fruits” +
“\nFaire cafe”;
}

public function get breakfastLabel():String {
return “Préparer des petits-déjeuners”;
}
}
}
[/ftf]

4. Refactor StateDemo.mxml

Finally, rewrite the StateDemo.mxml to take advantage of the new state objects and call it LogicalStateDemo.mxml. (Note, this application should run exactly the same as StateDemo.mxml)

LogicalStateDemo.mxml
[ftf]

initialize="onInitialize(event)">

// define the logical states as constants
static public const ENGLISH:IBreakfastMakerState = new EnglishBreakfastState();
static public const FRENCH:IBreakfastMakerState = new FrenchBreakfastState();

/**
* keep track of the current logical state and when the currentLogicalState changes
* update the currentState using its name property.
*/
protected var _currentLogicalState:IBreakfastMakerState;
public function set currentLogicalState(state:IBreakfastMakerState):void {
_currentLogicalState = state;
currentState = _currentLogicalState.name;
}

protected function onInitialize(event:Event):void {
currentLogicalState = ENGLISH;
}

protected function onBreakfastButton(event:Event):void {
// rely on the logical state to handle the logic of preparing the breakfast.
output.text = _currentLogicalState.breakfastInstructions;
}
]]>

[/ftf]

Et voila! A state pattern that works with the existing view states. This may seem like a lot of work for such a simple thing but it will really pay off in the long run on a complicated RIA.

Download Source!