Flash Camp Milan review

Yesterday in Milan we had the Flash Camp about Mobile topics and then we had the Flash Camp Party at NH Hotel… really wonderful time.
Like you know, in Italy it’s not so easy to organize those kind of events because usually people don’t move to another city like other foreign countries but Flash Camp had a great success.
This camp was organized in the same place of WhyMCA the mobile revolution, an italian conference focused on mobile topics.
We had 50/60 people per session and I’m glad to say that my session had 80 people so I’m happy about this little success.
All the sessions surfed in deep about CG, design patterns, video optimization for mobile, flex on mobile and so on, so I was really excited to take part in this event.
My session was about Design Pattern for Mobile, I talked about 3 design patterns: Singleton, Observer and Presentation Model.
With a couple of samples (that you can download from this link) and few slides I made an application that run with the same base code on tablet and smartphone; this is an hot topic now on mobile world in particular on Flash Platform side.

In next few weeks I’ll make a post about Presentation Model to share my thoughts about this argument and how to use it in your project , but if you want to start with this topic, take a look at this great post on RIArockstars.

Finally I’d like to thanks the Flash Mind, Adobe Flash Platform User Group Italy, to give me this opportunity, WhyMCA staff for the amazing organization, other speakers of Flash Camp for great time spent together and people that came to talk with us during the Flash Camp and to the beer party too.
I leave also a link to some photos took during Flash Camp in Milan.


Observer Pattern Actionscript 3

One of the most useful design pattern when you don’t want to work with framework like Swiz, Cairngorm, Mate or PureMVC but you’d like to work with a comfortable utility to manage events in your application or web site is Observer Pattern.

The definition from Wikipedia is:

The observer pattern (a subset of the publish/subscribe pattern) is a software design pattern in which an object, called the subject, maintains a list of its dependents, called observers, and notifies them automatically of any state changes, usually by calling one of their methods. It is mainly used to implement distributed event handling systems.

For more information and if you want to see UML diagram, take a look at wikipedia site.

You can use this design pattern when you want to notify to all object that are interesting in a particular notification; for example if you have 100 buttons you can show or hide only even or odd ones; it’s not important where they are added, if in the same displaylist or in another one, because it’s observer pattern that substitute event handling to notify something.
If you think how you usually work with event handling you must know where is situated your component  and if it’s nested in 10 different containers you must dispatch that event trough each component… it’s totally crazy!

Observer Pattern solve this problem because it’s like an event engine where knows all object that could be interesting in a notification and it notifies to all components.
When you start to work with it, you could use everywhere in your productions, believe me!

So how Observer Pattern works:

First of all you must create an Interface (IObserver) that has an update method that will be called from Observer manager when a notification will be called:

public interface IObserver {
    function update(_notification:String):void;
Then you must have an Observer Manager that manage all objects that implements IObserver interface.
This manager will have 3 public methods: subscribe, unsubscribe and notify.
You call subscribe when you want to add an object that is update from Observer; unsubscribe when you remove an object from a displaylist or if you don’t need to update anymore  and notify when you want to notify something to all subscribed objects:
public class ObserverManager {
private static var instance : ObserverManager;
private var observerData : Array;
public function ObserverManager():void{
observerData = new Array();
public static function getInstance() : ObserverManager{
if(instance == null)
instance = new ObserverManager();
return instance;
public function subscribe(observer:IObserver):void{
public function unsubscribe(observer : IObserver) : void {
var totObs:int = observerData.length;
for(var i:int = 0; i < totObs; i++){
if(observer === observerData[i]){
observerData.splice(i, 1);
       public function notify(_notification:String):void{
var totObs:int = observerData.length;
for(var i:int = 0; i < totObs; i++){

Ok now you are ready to work with observer, so we create an object that implements IObserver and another one that add on displaylist all IObserver objects and notify to all some notifications:

custom button that implements IObserver interface:

public class ObserverButton extends Button implements IObserver


	public static const HIDE_BUTTON:String = "hideBtnEvt";

	public static const SHOW_BUTTON:String = "showBtnEvt";


	public function ObserverButton()





	public function update(_notification:String):void



			case HIDE_BUTTON:

				this.alpha = .2;



			case SHOW_BUTTON:

				this.alpha = 1;





subscribe some custom buttons to observer manager:			

protected var observer:ObserverManager;

protected function init():void{				

	observer = ObserverManager.getInstance();

	for(var i:int = 0; i < 100; i++){			

		var btn:ObserverButton = new ObserverButton();

		btn.label = i.toString()


		if((i & 1) == 0)



		btn.x = Math.random() * 800;

		btn.y = Math.random() * 500 + 70;



That’s it! You can see the Flex 4 sample that use Observer Pattern here (with right click you can see and download source code).
If you have any questions or suggestions feel free to leave a comment.