Dino wrote:
I was also wondering how would I go about adding easing to the scrolling of a VBox? I don’t think there is an out-of-box solution such as an Accordion having a style property openEasingFunction that allows you to specify easing but I could be wrong. Does this require customization of the Container class? I was looking at Container.scrollChildren() and other methods in the Container class to determine if I could override any behaviour.

Somehow his email coincided with a scroll-related task I had recently. I had to use a scroll-bar which is situated on a pretty custom position and it was strolling columns of content with a snapping effect. So, how would I approach the problem with the animated scroll-bar?

The Solution

Going for extending the Container or some of the others Flex containers is a hairy and let’s say adventurous direction to proceed with. And I believe the solution won’t be much flexible. What would you do if you need to place the scroll-bar on a more peculiar place (e.g. on the left or the top side of the container sizes or event somewhere else outside the scrolled container)?

The solution is to detach the scroll-bar from the container, so we can use an outside scroll-bar. The following code fragment shows you how to achieve this:

<!-- 1. Place the View that needs scrolling into a Canvas which represents the visible area
     which can't be exceeded by the View.
     !!!IMPORTANT!!! Disable the scrolling of the Canvas, so we can use a detached scroller,
     which we can place wherever we want (e.g. on the left or top sides of the Canvas) -->
<mx:Canvas id="viewContainer"
    width="{largerView.width}" height="500"
    verticalScrollPolicy="off" horizontalScrollPolicy="off"
    borderColor="black" borderStyle="solid">
    <view:ViewThatNeedsScroll id="largerView"/> <!-- THIS IS THE VIEW -->
</mx:Canvas>

<!-- 2. Create a Canvas with fictive content - this is the actual detatched scroll-bar.
     Make sure the dimensions of this Canvas are corresponding to the size of the visible
     area specified by the View-container. Also make sure the fictive content has dimensions
     corresponding to the the dimensions of the View.
     Use data binding to set the corresponding dimensions! -->
<mx:Canvas id="scrollerContainer"
    x="{viewContainer.x - scrollerContainer.width}"
    y="{viewContainer.y}"
    width="40" height="{viewContainer.height}">
    <mx:Canvas width="1" height="{largerView.height}"/> <!-- THIS IS FAKE CONTENT -->
</mx:Canvas>

The Simplest Way to Attach the Scroll-Bar to the View

Before trying to add a tween and an easing to the scrolling motion, I’ll show you the most simplest solution for attaching this outer scroll-bar to the View that needs to be scrolled:

<!-- 3. Use Data Binding to attach the scroller to the View: -->
<mx:Binding source="scrollerContainer.verticalScrollPosition"
    destination="viewContainer.verticalScrollPosition"/>

Here’s the working sample (view source is enabled):

Animating the Scrolling

I’ve implemented a simple controller component which animates the scrolling movement. You can adjust various properties of the ScrollerController, such as:

● interaction delay
● easing function
● max duration of the tween
● etc.

I’m not going to look at the controller’s implementation in details. Feel free to ask me any questions in the comments section.

Here’s the working sample (view source is enabled):

Tell me what do you think of my solution? How would you solve this problem?

Almost two years ago my colleague Barni and I literally spent half a day in finding what causes this behavior. We’ve tried everything - drawing the loaded bitmap into a new BitmapData-object with the smoothing argument set to true, but with no luck. And then it suddenly struck us - it was the image dimensions. Images that have an odd dimension(s) fail to be smoothed. Check the sample app beneath - choose a different image from the combo and observe whether the smoothing works for it:

The Solution

The solution is to create a new BitmapData-object that is always with even dimensions.

var smoothBitmapData : BitmapData = new BitmapData(
    loadedBitmap.width + (loadedBitmap.width % 2),
    loadedBitmap.height + (loadedBitmap.height % 2),
    true, 0x00FF0000);
smoothBitmapData.draw(
    loadedBitmap, null, null, null, null, true);

smoothBitmap = new Bitmap(
    smoothBitmapData, PixelSnapping.NEVER, true);

This is how it looks with the fix:

VIEW SOURCE

Well, that’s an oldie! During the Cryptography course in the university (4 years and a half ago) I had an assignment to decipher a simple substitution cipher. Deciphering such ciphers is really straight-forward, but the extravagant part of me decided, that I’m too special to go with the straight way, so I’ve decided to try an alternative approach. Inspired from the Soft Computing course I attended the previous term, I was determined to experiment with a genetic algorithm and to play God with the small world of 20 populations with 20 individuals each possessing a unique DNA.

My Conclusion

Well, does the evolution work or what? No matter how many times I’ve ran the evolution, it ended producing individuals which doesn’t look much like English - I had no luck with an exact match. Nevertheless the individuals bred by the process helped me a lot to recognize the English sentence that was in the cipher.

The Source Code

My implementation is in Perl - this language seemed most suitable for the task.

This is a slightly modified implementation of the genetics algorithm, described in “Solving Substitution Ciphers with Genetics Algorithm” by Joe Gester. A corpus of English text should be supplied - in this sample I pasted in the corpus.txt file “The Secret Garden” by G.K. Chesterton.

#########################################################################
# Solving Substitution Ciphers with Genetics Algorithm!			#
# 	(c) Vladimir Tsvetkov, 2005					#
# 	For selfsatisfaction only!					#
#########################################################################

#!/usr/bin/perl

use warnings;
use strict;

###############################################################################
# cypher text that is about to be cracked:
my $cypher_text = "BTKIB" . "OKIBR" . "BAARJ" . "ZGBON" . "QBBSH" . "OZIBM"
		. "BAAGB" . "ONZAH" . "RANMH" . "OZIBI" . "JQSAB" . "WKNHM"
		. "KTLBJ" . "ZZIBR" . "BWKQH" . "RWKHA" . "HHPJU" . "HVKIB"
		. "OJWQK" . "HRHWQ" . "BORIJ" . "KRJZX" . "HTWXK" . "HIJSS"
		. "BWWBC" . "K";

###############################################################################
# almost randomly chosen corpus in English:
# use this to calculate the digram and trigram frequency tables:
my $corpus = "";

###############################################################################
# capitalize all letters in the corpus, remove spaces, numbers and punctuation:
sub prepare_corpus {
	open (CORPUSFILE, '<', "corpus.txt")
		or die "Can't open file! $!";
	my @contents = ;
	close (CORPUSFILE);
	foreach my $paragraph (@contents) {
		$corpus .= $paragraph;
	}
	$corpus =~ tr/a-z/A-Z/;	# capitalize
	$corpus =~ s/\s//g;	# remove spaces
	$corpus =~ s/\W//g;	# remove punctuation and other symbols
	$corpus =~ s/\d//g;	# remove digits
}

prepare_corpus ();

###############################################################################
# alphabeth we use:
my $alphabeth = “ABCDEFGHIJKLMNOPQRSTUVWXYZ”;

###############################################################################
# letters distribution for the alphabeth we use (in %):
# if you are using another alphabet, you should change this table!
my %letter_distribution_table = (
	‘E’ => 12.31,	 ‘L’ => 4.03, 	‘B’ => 1.62,
	‘T’ => 9.59,	 ‘D’ => 3.65, 	‘G’ => 1.61,
	‘A’ => 8.05,	 ‘C’ => 3.20, 	‘V’ => 0.93,
	‘O’ => 7.94,	 ‘U’ => 3.10, 	‘K’ => 0.52,
	‘N’ => 7.19,	 ‘P’ => 2.29, 	‘Q’ => 0.20,
	‘I’ => 7.18,	 ‘F’ => 2.28, 	‘X’ => 0.20,
	‘S’ => 6.59,	 ‘M’ => 2.25, 	‘J’ => 0.10,
	‘R’ => 6.03,	 ‘W’ => 2.03, 	‘Z’ => 0.09,
	‘H’ => 5.14,	 ‘Y’ => 1.88
);

###############################################################################
# digram frequency table:
my %digram_frequency_table = ();

# this will populate the %digram_frequency_table:
sub calculate_digram_frequency_table {
	my $i = 1;
	foreach my $letter (split (//, $corpus)) {
		last if ($i == length $corpus);
		my $digram = $letter . substr ($corpus, $i, 1);
		$i ++;
		if (defined $digram_frequency_table{$digram}) {
			$digram_frequency_table{$digram} ++;
		} else {
			$digram_frequency_table{$digram} = 1;
		}
	}
}

calculate_digram_frequency_table ();

###############################################################################
# trigram frequency table:
my %trigram_frequency_table = ();

# this will populate the %trigram_frequency_table:
sub calculate_trigram_frequency_table {
	my $i = 1;
	foreach my $letter (split (//, $corpus)) {
		last if ($i == (length $corpus) - 1);
		my $trigram = $letter . substr ($corpus, $i, 2);
		$i ++;
		if (defined $trigram_frequency_table{$trigram}) {
			$trigram_frequency_table{$trigram} ++;
		} else {
			$trigram_frequency_table{$trigram} = 1;
		}
	}
}

calculate_trigram_frequency_table ();

###############################################################################
# implementing the crossover between individuals:
# as long as less than half of the key is swapped at any one time, at least
# the good information from one parent remains in the child and likely the
# majority of the good information from the other parent also remains
# Example:
# father - A (B  C  D) E  F
# mother - B  D  F  E  C  A
# the crossover takes the next 3 steps:
# 1. tr/BD/DB/
# 2. tr/CF/FC/
# 3. tr/DE/ED/
# child  - E  B  C  D  F  A
sub crossover {
	my ($father, $mother) = @_;
	my $letters_count = length $alphabeth;
	my $crossover_fragment_length = 12;
	my $fragment_offset =
		int (rand ($letters_count - $crossover_fragment_length + 1));

	my $child = $mother;
	my $father_fragment = substr ($father,
				$fragment_offset,
				$crossover_fragment_length);

	my $mother_fragment = substr ($mother,
				$fragment_offset,
				$crossover_fragment_length);

	# swap the randomly chosen fragments:
	my $i = 0;
	foreach my $father_letter (split (//, $father_fragment)) {
		my $mother_letter = substr ($mother_fragment, $i, 1);
		$i ++;
		my $digram_left = $father_letter . $mother_letter;
		my $digram_right = $mother_letter . $father_letter;
		$_ = $child;
		eval “tr/$digram_left/$digram_right/”;
		$child = $_;
	}

	return $child;
}

###############################################################################
# implementing the fitness function for a given individual:
# To apply the fitness function to an individual, the cipher-text is decrypted
# using the individual’s gene as it’s key. Then every trigram and digram in
# the decrypted text is looked up in the table of how many times it occurs
# in the corpus. These numbers are then summed. Thus, trigrams and bigrams
# that occur commonly in the corpus are more heavily rewarded than those
# that do not.
sub fitness {
	my ($individual) = @_;
	my $permutated_alphabeth = $individual;
	my $plain_text = $cypher_text;

	# decrypt, using the given individual:
	$_ = $plain_text;
	eval “tr/$permutated_alphabeth/$alphabeth/”;
	$plain_text = $_;

	# calculate the fitness function of the decrypted text:
	my $fitness = 0;
	my $i = 1;
	foreach my $letter (split (//, $plain_text)) {
		unless ($i == length $plain_text) {
			my $next_letter = substr ($plain_text, $i, 1);
			my $digram = $letter . $next_letter;
			$fitness += $digram_frequency_table{$digram}
				if (defined $digram_frequency_table{$digram});
			unless ($i == (length $corpus) - 1) {
				my $next_two_letters = substr ($plain_text, $i, 2);
				my $trigram = $letter . $next_two_letters;
				$fitness += $trigram_frequency_table{$trigram}
					if (defined $trigram_frequency_table{$trigram});
			} else {
				$i ++;
				next;
			}
		} else {
			last;
		}
		$i ++;
	}

	return $fitness;
}

###############################################################################
# implementing mutation:
# This is implemented as a swap between probable neighbors based on the
# single letter frequencies of English. That is, the character ’e’ might
# be swapped with ’t’ but not with ’v’ or ’x’.
# In this case the random swap occurs only for the first 9 most frequent
# letters, based on the %letter_distribution_table.
sub mutation {
	my ($individual) = @_;
	my $mutated_individual = $individual;
	my $letters_count = 9;
	my $letter_position1 = int (rand ($letters_count));
	my $letter_position2 = int (rand ($letters_count));
	return $mutated_individual if ($letter_position1 == $letter_position2);
	my @letters_sorted_by_distribution =
		reverse
			sort  { $letter_distribution_table{$a} <=>
				$letter_distribution_table{$b} }
				keys %letter_distribution_table;
	my $letter1 = $letters_sorted_by_distribution[$letter_position1];
	my $letter2 = $letters_sorted_by_distribution[$letter_position2];
	my $index1 = index ($alphabeth, $letter1);
	my $index2 = index ($alphabeth, $letter2);
	my @letters = split (//, $individual);
	my $swap_letter1 = $letters[$index1];
	my $swap_letter2 = $letters[$index2];
	my $digram_left = $swap_letter1 . $swap_letter2;
	my $digram_right = $swap_letter2 . $swap_letter1;
	$_ = $mutated_individual;
	eval “tr/$digram_left/$digram_right/”;
	$mutated_individual = $_;
	return $mutated_individual;
}

###############################################################################
# generate random individual (generates random permutation of the alphabeth):
sub generate_random_individual {
	my @letters = split (//, $alphabeth);
	my $random_individual = ”;
	foreach my $i (reverse (1 .. length $alphabeth)) {
		my $pos = int (rand $i);
		$random_individual .= $letters[$pos];
		# delete the concatenated element from @letters:
		unless ($pos == $#letters) {
			my $temp = $letters[$#letters];
			$letters[$#letters] = $letters[$pos];
			$letters[$pos] = $temp;
			pop @letters;
		} else {
			pop @letters;
		}
	}
	return $random_individual;
}

###############################################################################
# number of populations:
my $populations_count = 20;

###############################################################################
# number of individuals in a population:
my $individuals_count = 20;

###############################################################################
# array of populations:
my @populations;

###############################################################################
# describe a population of indiliduals:
# my $population = {
#	‘individuals’ => [],
#	‘total_fitness’ => 0
# };

###############################################################################
# describe an individual:
# my $individual = {
#	‘description’ => ”,
#	‘fitness’ => 0
# };

###############################################################################
# sort individuals in a population by the fitness function:
sub sort_individuals {
	my ($population) = @_;
	@{$population->{’individuals’}} =
		reverse sort { $a->{’fitness’} <=> $b->{’fitness’} }
			@{$population->{’individuals’}};
}

###############################################################################
# sort populations by the cumulative fitness values:
sub sort_populations {
	@populations =
		reverse sort { $a->{’total_fitness’} <=> $b->{’total_fitness’} }
			@populations;
}

###############################################################################
# initialize the first generation:
sub zero_generation {
	foreach (1 .. $populations_count) {
		my $population = {};
		$population->{’individuals’} = [];
		$population->{’total_fitness’} = 0;
		foreach (1 .. $individuals_count) {
			my $individual = {};
			$individual->{’description’} = ”;
			$individual->{’fitness’} = 0;
			my $random_individual = generate_random_individual ();
			$individual->{’description’} = $random_individual;
			my $fitness = fitness ($random_individual);
			$individual->{’fitness’} = $fitness;
			push (@{$population->{’individuals’}}, $individual);
			$population->{’total_fitness’} += $fitness;
		}
		sort_individuals ($population);
		push (@populations, $population);
	}
	sort_populations ();
}

###############################################################################
# number of individuals in a population that will mutate:
my $mutate_individuals_count = 4;

###############################################################################
# mutate some randomly chosen individuals in a population:
# A random range of $mutate_individuals_count individuals from a single
# population will mutate.
sub mutate_population {
	my ($population) = @_;
	my $offset = int
		(rand ($individuals_count - $mutate_individuals_count));
	foreach my $i (1 .. $mutate_individuals_count) {
		my $individual =
			${$population->{’individuals’}}[$offset + $i];
		my $mutated_description =
			mutation ($individual->{’description’});
		$individual->{’description’} = $mutated_description;
		$population->{’total_fitness’} -= $individual->{’fitness’};
		$individual->{’fitness’} =
			fitness ($mutated_description);
		$population->{’total_fitness’} += $individual->{’fitness’};
	}
	sort_individuals ($population);
}

###############################################################################
# mutate all populations:
sub mutate_all_populations {
	foreach my $population (@populations) {
		mutate_population ($population);
	}
	sort_populations ();
}

###############################################################################
# breed the individuals in a population:
# The father is chosen among the 5 best individuals in a population.
# The mother is chosen among the rest individuals in the same population.
# Their child takes the place of the weakest individual in the population.
sub breeding {
	my ($population) = @_;
	my $father_pos = int (rand (5));
	my $father_individual = ${$population->{’individuals’}}[$father_pos];
	my $mother_pos = int (rand ($individuals_count - 5)) + 5;
	my $mother_individual = ${$population->{’individuals’}}[$mother_pos];
	my $child_individual =
		${$population->{’individuals’}}[$individuals_count - 1];
	my $father = $father_individual->{’description’};
	my $mother = $mother_individual->{’description’};
	my $child = crossover ($father, $mother);
	$child_individual->{’description’} = $child;
	$population->{’total_fitness’} -= $child_individual->{’fitness’};
	$child_individual->{’fitness’} = fitness ($child);
	$population->{’total_fitness’} += $child_individual->{’fitness’};
	sort_individuals ($population);
}

###############################################################################
# breed all populations:
sub breed_all_populations {
	foreach my $population (@populations) {
		breeding ($population);
	}
	sort_populations ();
}

###############################################################################
# interbreeding between neighbour populations:
# The father is the best individual in the first population.
# The mother is randomly chosen individual from the next weakest population.
# Their child takes the place of the weakest individual in the mother’s
# population. I thought it’s quite reasonable to interbreed only neighbour
# populations (populations that have close values for the total_fitness).
sub interbreeding {
	foreach my $i (0 .. $populations_count - 2) {
		my $father_population = $populations[$i];
		my $father_individual =
			${$father_population->{’individuals’}}[0];
		my $mother_population = $populations[$i + 1];
		my $mother_pos = int (rand ($individuals_count));
		my $mother_individual =
			${$father_population->{’individuals’}}[$mother_pos];
		my $child_individual =
			${$mother_population->{’individuals’}}[$individuals_count - 1];
		my $father = $father_individual->{’description’};
		my $mother = $mother_individual->{’description’};
		my $child = crossover ($father, $mother);
		$child_individual->{’description’} = $child;
		$mother_population->{’total_fitness’} -=
			$child_individual->{’fitness’};
		$child_individual->{’fitness’} = fitness ($child);
		$mother_population->{’total_fitness’} +=
			$child_individual->{’fitness’};
		sort_individuals ($mother_population);
	}
	sort_populations ();
}

###############################################################################
# clone an individual:
sub clone_individual {
	my ($individual) = @_;
	my $cloned_individual = {};
	$cloned_individual->{’description’} = $individual->{’description’};
	$cloned_individual->{’fitness’} = $individual->{’fitness’};
	return $cloned_individual;
}

###############################################################################
# sort array of individuals:
sub sort_best_individuals {
	my ($ref_individuals) = @_;
	@$ref_individuals =
		reverse sort { $a->{’fitness’} <=> $b->{’fitness’} }
			@$ref_individuals;
}

###############################################################################
# the best individuals throughout all generations:
my @best_individuals;

###############################################################################
# check if this individual is not already in the @best_individuals array:
sub is_member_individual {
	my ($ref_individuals, $individual) = @_;
	foreach my $member_individual (@$ref_individuals) {
		if ($member_individual->{’description’} eq
		    $individual->{’description’}) {
			return “TRUE”;
		}
	}
	return undef;
}

###############################################################################
# merges to sorted lists of individuals:
sub merge_individuals {
	my ($ref_candidate_individuals) = @_;
	my @new_individuals = (@best_individuals);
	foreach my $candidate_individual (@$ref_candidate_individuals) {
		push (@new_individuals, $candidate_individual)
			unless (is_member_individual (\@new_individuals, $candidate_individual));
	}
	sort_best_individuals (\@new_individuals);
	$#new_individuals = $populations_count - 1;
	@best_individuals = @new_individuals;
}

###############################################################################
# select the best individuals, and if they are better than the existing ones,
# change them:
# This is a way to save the local maxima for all generations in the evolution.
sub select_best_individuals {
	if (@best_individuals) {
		my @best_individuals_in_this_generation;
		foreach my $population (@populations) {
			my $individual =
				clone_individual (${$population->{’individuals’}}[0]);
			push (@best_individuals_in_this_generation, $individual);
		}
		sort_best_individuals (\@best_individuals_in_this_generation);
		merge_individuals (\@best_individuals_in_this_generation);
	} else {
		# first initialization of @best_individuals;
		foreach my $population (@populations) {
			my $individual =
				clone_individual (${$population->{’individuals’}}[0]);
			push (@best_individuals, $individual);
		}
		sort_best_individuals (\@best_individuals);
	}
}

###############################################################################
# calculate cumulative fitness for all populations in a generation:
sub cumulative_fitness {
	my $cumulative_fitness = 0;
	foreach my $population (@populations) {
		$cumulative_fitness += $population->{’total_fitness’};
	}
	return $cumulative_fitness;
}

###############################################################################
# calculate next generation:
sub next_generation {
	breed_all_populations ();
	select_best_individuals ();
	interbreeding ();
	select_best_individuals ();
	mutate_all_populations ();
	select_best_individuals ();
}

###############################################################################
# decrypt the cypher text, using the individual’s description:
sub decrypt_individual {
	my ($individual) = @_;
	my $permutated_alphabeth = $individual->{’description’};
	my $plain_text = $cypher_text;
	# decrypt, using the given individual:
	$_ = $plain_text;
	eval “tr/$permutated_alphabeth/$alphabeth/”;
	$plain_text = $_;
	return $plain_text;
}

###############################################################################
# prints all suggestions about the decription of the cypher text:
sub print_results {
	open (RESULTS, ‘>’, “decriptions.txt”)
		or die “Can’t open file! $!”;
	foreach my $population (@populations) {
		foreach my $individual (@{$population->{’individuals’}}) {
			my $plain_text = decrypt_individual ($individual);
			print RESULTS “$plain_text\n”;
		}
	}
	print RESULTS “\nBEST SUGGESTIONS:\n”;
	foreach my $individual (@best_individuals) {
		my $plain_text = decrypt_individual ($individual);
		print RESULTS “$plain_text\n”;
	}
	close (RESULTS);
}

###############################################################################
# number of generations that are allowed to be without an improvement:
# on every improvement increment this value!
# on every worsening decrement this value!
my $generations_without_improvement = 10;

###############################################################################
# simulation of the evolution process:
sub evolution {
	my $cumulative_fitness = 0;
	zero_generation ();
	select_best_individuals ();
	$cumulative_fitness = cumulative_fitness ();
	my $generations = 0;
	while ($generations_without_improvement) {
		print “GENERATION $generations\t\tFITNESS: $cumulative_fitness\tGENERATIONS LEFT: $generations_without_improvement\n”;
		$generations ++;
		next_generation ();
		my $new_cumulative_fitness = cumulative_fitness ();
		if ($new_cumulative_fitness > $cumulative_fitness) {
			$generations_without_improvement ++;
			$cumulative_fitness = $new_cumulative_fitness;
		} else {
			$generations_without_improvement –;
		}
	}
	print_results ();
}

evolution ();

HERE YOU CAN DOWNLOAD MY PAPER

Prolog

Just as always when I have to write a paper for the university, I take the assigned topic and turn it into something completely different. And that’s exactly what I did for my Middleware paper.

My assignment was to write about Ontologies and Ontology Languages for Web Service Description, but it ended being a paper about reassessing the role which formality plays in the field of software engineering.

So, how did I got from there to here?

At the start, my intention was to take a couple of ontologies for web service description and to make an attempt to evaluate them according to a set of design criteria, as described in one of the most widely cited works in ontology - Thomas R. Gruber, Toward Principles for the Design of Ontologies Used for Knowledge Sharing.

But guess what? It doesn’t work that way. And it won’t work that way, especially when you don’t have enough time. And what do I mean by that?

The Impenetrable Citadel of Concentric Formality

As soon as I started my acquaintance with one of the ontologies I’ve picked, I realized that I don’t know enough and that I need to get familiar with the underlying layer. When I started to get to know the thing underneath, same sh*t happened. I just couldn’t move on without picking into the layer beneath. Getting two floors down and I couldn’t remember anymore what was two floors above.

I’ve always considered layering a good thing, but what was happening then? Why I’m not able to learn about a system one layer at a time, without having to pick into the layers beneath? And it just struck me:

All these layers of effective formality all the way down are simply inefficient…

…And it is inefficient not because it isn’t precise, but because it is maybe too precise.

Why growing an interest in Lisp may matter?

When you grew an interest about something, interesting things will start to happen to you. Things like discovering new stuff, discovering new ideas and most importantly discovering new amazing people. Scheme is probably the most amazing programming language I’ve learned in the university, but I haven’t been manifesting any forms of interest in Lisp until recently. And that’s how I discovered the work of Gregor Kiczales - the creator of the Meta-Object Protocol for Lisp, the father of CLOS and the mind behind the Aspect-Oriented Programming. And one of the first things I did was listening to his keynote talk at OOPSLA 2007 (available as podcast and PDF slides). Since then I’ve been listening to this same talk at least three more times. This talk is all about formality vs. informality and it ended being a road-map for my Middleware paper. A substantial part of the audio you can find almost as a transcript in my paper. I’ve been shamelessly repeating Kiczales’ words with the hope they will raise some interest in these radical ideas.

Disclaimer

In advance, I want to apologize to all the experts that are familiar in much more detail with the stuff I wrote about in my paper. To them it may seem that I’m just scratching the surface, and probably they’re right. Forgive me, if I haven’t presented your ideas in the right way, or if I’ve misunderstood you. If that’s the case, it would be great if I hear back from you.

Adobe have done a great job with Flex (and in the years to come it will hopefully improve)! But Flex comes with a certain weight that makes it nearly impossible to use when we have to develop the class of applications that I want to stress on. The overhead of the framework is too big to be ignored. Our main concern is that this will eventually result in poorer user experiences, because of initial download times. But even if we circumvent this issue in some way (check my article on Totally Custom Preloaders), the SWF will still include code dependencies that are used nowhere in the application. Not to mention that the whole component model is too heavy and complicated and will eventually stand in our way when we have to implement a totally custom experience.

Introducing FLit

But on the other hand Flex comes with a set of tools and concept that we really love and still want to be able to use. So what we end up doing in our free time in Obecto is a framework that would enable us to use Flex for really custom Flash apps with a minimal overhead from the framework. And we called this framework FLit - a light-weight Flex for Flash apps. We’ve developing it open source from line 1 - so feel free to check out the source from Google Code. There you’ll find some samples too!

Why we call it FLit?

First, FL stands for Flash. We want to build plain AS3 projects without the need to use <mx:Application> as a root object for our apps, and we want it to be as fast and as small as a plain AS3 project could be.

How do we use Flex in FLit?

As you might guess FL also stands for Flex, but we only use a small subset of the Flex Framework, like Data Binding and MXML, and nothing else - no UIComponent, no Flex Application. How do we succeed in using MXML inside of a plain AS3 project? Well, this is a topic for another post.

We are also using a concept pretty close to the view contract in Spark, thus enabling the separation of concerns between the designer and the developer.

What do we mean by lite?

We understand liteness as to have minimum dependencies between components, thus there are no components in the framework that will induce as dependencies a substantial part of the framework itself.

We understand liteness as the ability to include only those concern that interest you and not some behavior hard-coded in the framework.

We also understand liteness as having a lite build process. Previously when building custom Flash apps we needed to use the designer machine and the designer productivity tools for the build. With FLit this is not the case - the designer is responsible only in preparing assets that must contain the parts specified in the view contract, so the productivity tools are not used for the build. So, this is also a pretty lite skinning process.

The current state of FLit

FLit is in early experimentation phase. Maybe this sample somewhat summarizes what’s inside the framework now? You can also check out the sample’s code!
A summary of features:

● light-weight base component
● light-weight base container
● view contract specification through metadata tags
● skin asset
● several layout strategies
● transition manager that supports declarative transitions between states
● tasks (an idea which originated from the GuggaFF) - Sequence and Parallel are also tasks
● declarative input validators
● skin-able button component
● tweening engine

The thing is we’re still mimicking early media types and no one (neither Apple or Microsoft, or even free software initiatives) have the guts to leave behind old paradigms and move to radically new user interface mechanisms.

Some say a radically new user interfaces would be unintuitive and unnatural, but the adverb intuitive in nothing more than a reference to someone’s level of acquaintance or past experience with a concept. This simply means that in order to feel comfortable with a system you need to be relatively experienced with similar systems. But what are the options when most of the systems are poorly designed? To design an intuitive system we need to repeat the design flaws of the previous systems our potential users were exposed to. So maybe we should not set intuitiveness as a goal, but instead focus on human cognetics and solid scientific principles when exploring new possibilities for user interfaces.

Some say there is no business for radical changes, especially in times of crisis. People want something that has already been proven useful. There is no margin for risks… So, I’m going to publish a comparison between current metaphorical user interfaces with an alternative one that relies on information physics.

My points of view about personal computer user interfaces are strongly influenced by Jef Raskin’s book The Humane Interface. In his book he wrote about the application of Zoomable User Interfaces and he also referred to the research work done in this field by Benjamin B. Bederson with the Pad++ software at the University of New Mexico. Currently the information about Pad++ is moved to the web pages of the University of Maryland, where you can find a handful of useful papers (a must-read for everyone interested in designing and developing ZUI’s). I’ve recently found this comparison in the last pages of a paper titled Pad++: A Zooming Graphical Interface for Exploring Alternate Interface Physics. I’ll publish the comparison with just minor modifications.

Four distinguishing differences

A physical interface strategy can be distinguished in at least four ways from a metaphor based strategies:

First, metaphors necessarily pre-exist their use. Pre-Copernicans could never have used the metaphor of the solar system for describing the atom. In designing interfaces, one is limited to metaphorical resources at hand. In addition, the metaphorical reference must be familiar to work. An unfamiliar interface metaphor in functionally no metaphor at all. One can never design metaphor the way one can design self-consistent physical descriptions of appearance and behavior. Thus, as an interface design strategy physics offer design-ability and tailor-ability that metaphor does not.

Second, metaphors are temporary bridging concepts. When they become ubiquitous, they die. The familiarity provided by the metaphor during earlier stages of uses gives way to familiarity with the interface due to actual experience. The current generation of kids have grew up with personal computers around them and a world of desktops, files and menus, but even though these are metaphors, and are also a successful ones, to these kids a desktop is just a computer screen and a file is just something on a hard drive with no mental association with the real life entities originally used for the metaphors. Successful metaphors also wind up as dead metaphors. But the pervasiveness of dead metaphors as files, menus, and windows may well restrict us from thinking about alternative organizations of computation.

Third, since the sheer amount and complexity of information with which we need to interact continues to grow, we require design strategies that scale. Metaphor is no such a scaling strategy. Physics is. Physics scales to organize greater and greater complexity by uniform application of sets of simple laws. In contrast, the greater the complexity of metaphorical reference, the less likely it is that any particular structural correspondence between metaphorical target and reference will be useful.

Fourth, it is clear that metaphors can be harmful as well as helpful since they may well lead users to import knowledge not supported by the interface. There are certainly metaphorical aspects associated with physics-based strategy. Our point is not that metaphors are not useful but that they may restrict the range of interfaces we consider.

What do you think about this?
Tell me, what you want to be able to do with your personal computers and what user interfaces you would like to have?

The thing is that me and my partner are forming a company which is focused on building human-centered Rich Internet Applications, but we don’t want to limit the human centrism only to the applications itself, but to also focus on the humans as the foundation of the whole company. And by humans we don’t mean consumers, demographics and statistics, but the conscious, valuable beings that are aware of themselves, the environment and the people around them.

A bit of history

The conveyor line best characterized the most of the successful businesses of the last century - increasingly detailed division of labour, mindless execution of single repetitive tasks and higher and higher deskilling. We refer to this period of time as to the Industrial Era, and to this management approach as to Command & Control. While it is great for producing more with less, it’s simply not humane.

If you ask me the industrial era of Command & Control management have died with the fall of the Berlin Wall (this event is not directly related to technology, but adds a dramatic effect) or even a decade before that, but I guess it will take another 20-30 years (hopefully far less than that) to change peoples perception of business as just a shiny polished logo, strong brand with some brainwashing slogans and infinitely repeating advertisements that dumb down the man into a robot (which eventually is substituted by actual robots) on the conveyer line for the purpose of producing and consuming more and more, in order to sustain the company’s infinite expansion.

I’m a software guy, so I have a natural disgust for Command & Control - it’s just not the way software is getting done. But no matter how I hate Command & Control, I still can’t believe how distorted was my perception of business. I thought I need to implement the “genius” idea - the idea that will bring the fortune to my company, but an idea that is not necessarily improving people’s lives. And then… then what? Just keep a nice company image, good financial records, advertise in order not to fossilize and leave everything else to the financiers - they are so good at buying and selling and blowing phony balloons. You may think I write this, because I’m one of those that hate brokers and bankers and all financiers, but probably I wouldn’t even thought of them if I haven’t recently stumbled upon this article - I think Guy Kawasaki twitted about it three or four or five weeks ago and this is how I got to it.

Intuitively I knew my perception of business is full of shit, but it took some things to happen before I got my intuition wide awake.

Sustainability

I’ve been thinking for quite some time about the impact my lifestyle has on the environment, but not until a year ago I began to understand what sustainability really means and why it is important. Since then I try to live with the realization that everything I do should somehow fit into the natural environment and not just fit, but also to sustain in it without damaging or destroying it… or at least I just try to minimize my impact. If you still don’t know what sustainability is really about, you got to watch the William McDonough’s TED talk to get acquainted with the notions of cradle-to-cradle design.

Speaking of design…

I’m in the business of making things, so it’s kind of essential for me to have an accurate understanding of what design is. The cool thing is that if you watch the William McDonough TED lecture you’re not going to learn only about sustainability, but you can also get enlightened on what design is… and it’s pretty much everything. By saying that it’s pretty much everything it’s my way to emphasize on the importance of the concept of having an intention and to signify this intention with your designs. People think about their desires and needs, but rarely take a minute and try connecting all the dots into a picture that clearly shows their intentions. I was no different…

It’s just scope and scale

Everything I do or have done had a meaning in the context of my actions - graduating a nice university, picking a profession, practice that profession. Sure, professionalism is expected, getting the job done is expected, but nobody expects or requires from you to have intentions out of the scope and the scale of your jobs. It’s just so Command & Control… but besides that Command & Control is so inhumane it is also terribly bad for the environment. If you think about your actions, you’ll see that many of them are justified enough in a particular scope and scale, but in a broader scope and in a bigger scale those same actions are devastating - their signal of intention sounds pretty strange for a reasonable being. It goes something like: “Let’s have miserable lives full of stress in a polluted environment where our kids are dying from mercury intoxication.” Allan Chochinov have put it all together very beautifully in his 1000 words Manifesto for Sustainability in Design.

Designer of a business

As a beginner entrepreneur I’m also a designer of a business. It’s my responsibility to decide what’s going to be my company’s signal of intent. It’s my job to develop a sense of scope and scale for the company, instead of just finding ways to expand. It’s me who’s task is to define the company’s mission, instead of just searching for sources that will fill my pockets. It’s me and my partners… and as every other designer, we have specific problems to solve.

The problem

Simply put, we need to design a very humane conversation environment for our company. And by humane I mean an environment that responds to the natural human needs and our inclinations to speak freely, show off with the stuff we’re creating, share our knowledge, learn new things and satisfy our curiosity, but above all to connect and relate with other human beings.

The common closed model

The established model among successful companies is to have an intranet hidden behind a firewall and a centralized censorship. The intranet is used for internal discussions, research and development, enterprise management, etc. The firewall takes care of the company’s discoveries, issues, ideas and dirty underwear not to be released by chance to the public and to keep curious strangers, but mostly to keep potential clients and competition out of the companies internal issues and affairs. The central censorship is disguised under a Public Relations department. The PR guys are concerned only with the company’s image and this concern has nothing to do with utility or contribution to the greater good, not to mention ethics. It’s easy and maybe fair to start demonizing the Big Brother and to add a flavor of paranoia, but you should put aside conspiracy theories and start thinking about the reasons that have triggered the emergence of such a model. And the reasons are pretty obvious… It’s a matter of basic survival instincts. It looks like living in the constant conditions of competition and rivalry gives power to our most destructive forces. It’s utopian to expect fair play and ethics out of a dog-eat-dog situation. So, forget about greater good, forget about ethics, forget about basic human needs, forget about the environment and lets focus on screwing each other… But does it has to be necessarily like this?

Are there any better alternatives?

Remember the crazy mathematician from the Beautiful Mind movie? Do you remember his name? If you’ve attended a Game Theory course there is no way you’ve missed or haven’t remembered his name - John Forbes Nash Jr. He had mathematically proven that in competitive environments, conflict situations or games, where every player is interested in raising a higher score, the optimal strategy is to reduce competitiveness in favor of cooperation. If all parties agree to such strategy, they’ll increase their score in the most optimal (least riskier) way and they’ll reach a point of equilibrium where everyone’s behavior should remain unchanged in order to gain a sure profit for all parties from such a conflict situation. Businesses apply this theory with their competition, but the sole goal of increasing profit no matter of the social and environmental costs, is pushing people away from businesses and is turning people into their biggest opponent. What used to be statistics, demographics and a gray dumb mass of consumers and employees is now a massive symbiotic system of pervasively interconnected individuals. In our hyper-linked world, we can know anything, anytime.

My starting business must acknowledge this eruption of mass awareness and must forge a mutually beneficial strategy that has the potential for large scale collaboration. And to my opinion the first step is to create an entirely open company.

What’s an open company?

I haven’t done any research on whether there are such companies and I haven’t even made the effort to search whether an ‘open company’ exists as a term. I don’t know what an open company is, so don’t expect from me to give you an exact definition. What I can do, is to list some of the characteristics of an open company and also to write down what an open company is not.

an open company should encourage the emerging Conversation and should not limit discussions only inside the corporate intranet - one way or another the information leakage is inevitable - either an unsatisfied client will expose you as a fraud if you pretend to be something that you’re not and if your services suck and your products are crap, or either one of your employees will start blogging under a legal disclaimer that will prevent affiliating his writings with the actual company’s issues

an open company should make use of all emerging information channels in addition to the company’s established channels - useful feedback can come from virtually everyone and everywhere

an open company should avoid standing in what I call a protective posture - covering its problems, masking company’s proportions into something completely different or being willing to do anything for a buck - this protective mode prevents companies from actually facing and solving their issues and eventually creating a healthy, worthy, sustainable businesses

an open company should share its knowledge - simple as that

And here are some words on what an open company is not:

an open company is not a reality 24/7 pimp show - company’s openness is not a desperate attempt for being original - company’s openness is a tool for discovering and solving issues, sharing knowledge and learning from each other - it is conceptually pure, potentially ethical, but most importantly it looks like a more humane way of making business

The current status

Right know my venture is wearing the suit of an outsourcing company. Should I be ashamed of that? Strange question you may think, but I wonder is it going to look that strange to you when you come to the realization that it is my company’s availability, my company’s competitive prices and it’s my company’s higher quality of service that makes possible and it’s partially responsible for the huge lay offs of programmers and software engineers in the world leading countries. Companies that pretend to be socially responsible may put this legal note on their services:

USE OUR OUTSOURCING SERVICES RESPONSIBLY. ABUSE MAY RESULT IN PEOPLE LOOSING THEIR JOBS, DESTROYING LOCAL ECONOMIES AND EVENTUALLY DESTROYING YOUR WHOLE COMMUNITY.

But on the other side, it’s me and my partners and our employees who maintain a cheaper lifestyle and restrain our consumer abilities to a level much lower than the level of our american colleagues for instance. This is the nature of the free enterprise system. All of us helped and contributed in establishing this system on a global scale, and now like it or not we’re in position to constantly compete with each other. I don’t like it this way. I would rather collaborate than compete with my colleagues, so I’m in a search of ways to create an open company. I don’t know if this makes any sense to anyone, but every suggestion and opinion would be appreciated.

● create particles (rectangles, circles, springs, etc.)
● configure particles (mass, friction, elasticity, collision, etc.)
● connect particles through spring constraints
● set particles velocity
● add forces to the particles
● group particles into groups and compositions

The code is easy to read and modify and now I’ll show you, how I’ve added directional motion blur to some APE components.

Check this sample pendulum which elements are using directional motion blur:

Download the Pendulum source code!
Download APE with directional motion blur!

Adding the directional motion blur to APE is relatively simple, but before doing that we need to understand how to implement directional motion blur with ActionScript.

What is Directional Motion Blur?

The Blur filter in Flash can apply blurring only to the right and left or up and down directions of a display object, but not in other directions, like blurring only in 35 degrees direction. This article showed me how can I get by this restriction.

1. First, you need to determine the direction angle of the movement. In ActionScript you can get the direction angle in radians with the following calculation:

var directionAngle:Number = Math.atan2(endPt.y - startPt.y, endPt.x - startPt.x);

2. Second, you need to rotate the display object to the negative value of the direction angle. To achieve this you need to rotate the transformation matrix you’ll use when you draw the bitmap.

// reset the rotation matrix:
rotationMatrix.identity();
// rotate the matrix:
rotationMatrix.rotate(-directionAngle);
// set matrix translation:
rotationMatrix.translate(offset, offset);

3. Third, you draw the bitmap with the already configured transformation matrix and then apply only horizontal blurring with a particular blurring distance.

// reset the bitmap data:
blurBitmapData.fillRect(blurRect, 0);
// draw with rotation:
blurBitmapData.draw(originalSprite, rotationMatrix);

// calculate horizontal blur:
var distance:Number = Point.distance(startPt, endPt);
blurFilter.blurX = Math.min(maxBlur, distance * 3);
// apply the blur filter:
blurBitmapData.applyFilter(blurBitmapData, blurRect, blurPoint, blurFilter);

4. Now, you’re ready for the final step - restoring the rotation.

// the rotation property expects degrees, not radians:
sprite.rotation = directionAngle * 180/Math.PI;

Here is a sample application demonstrating directional motion blur in action.

Download directional motion blur sample!

Putting All Together in APE

Obecto is bidding for an interesting Flash project, so I had to compile a simple prototype that uses APE for a multi-joint pendulum which elements have a directional motion blur. I’m not proud the way I did it - I’ve just done it as quick as possible - directly modifying the RectangleParticle, CircleParticle and the SpringConstraint components of APE. I still haven’t thought about how to separate the directional motion blur logic into a discrete aspect, neither my implementation is general enough to handle all possible ways of using APE particles (e.q. this implementation does not handle the case when we use a predefined display object instead of a styled rectangle or circle). And may be the worst thing about my implementation is that I’ve changed the constructors interfaces of the modified components, but this can be fixed quickly.

Have fun with APE for at least a weekend!

Change

It gets to a point in life, where a man should decide, whether he’s going to pursuit his dreams or leave it to the mundane inertia and play it “safe”. There were no signs that I’ve got to this point, but I must say my partner Todor was just about there. His decision to descent to the “deep, dark canyons of uncertainty and ambiguity” and his desire to “walk the breathtaking highlands of success” inspired me to act. Not to postpone, but to act - right now and right here.

I’m recognizing a great business opportunity for Obecto to create and shape an amazing new company, but I’m also seeing a great personal opportunity to develop my character, to learn new things and have the fulfilling experience of being an entrepreneur. Month ago I decided to do my best to make this happen.

…and oh boy things are happening really fast

Almost a month since Todor and I took our decisions and you can already see the results of the efforts taken by us and Obecto’s associates. We gave the birth of our corporate web site. To my opinion, the design is simplistic, but yet elegant. I’ll leave to you the comments. Every feedback matters, so please don’t hesitate.

Some words about technology

Our site is written in Flex and it uses Papervision3D. For everyone interested, the code of the site is going to be published soon. Right now, we’re too embarrassed to share the stuff we wrote so quickly late in the night (both of us are for four more days on a payroll at Gugga) and just don’t want to leave you with a bad impressions.

A chance to thank

I want to thank Gugga and to all my colleagues there. These 3 years I learned a lot from you guys. Keep up with the good work!

More on the Mediator

In my previous article I was describing the need to have an agent near the View in order to handle complex user interaction instead of running the whole cycle of processing Cairngorm events, but most importantly to make possible View reuse. To make something reusable it should be abstract as possible - this means not only removing any business specific logic from the View-component, but also to reduce the necessity to imbue other application components with certain knowledge about this View-component. The lesser they need to know about it, the better. So far, so good, but I’ve omitted and missed entirely to write about Mediators as translators. Removing business specific logic from the View-components, means that the View-specific events should be mapped to business logic events. As you might guess the Mediator is the dude performing this so important mapping - it intercepts the View specific events and then dispatches the corresponding business specific events that usually trigger Command execution.
The bitch in Cairngorm is the lack of a Mediator. Novices do dispatch Cairngorm events directly from the View-components, thus making these components not very reusable - sometimes you might be able to reuse them in other Cairngorm applications, but you have to be careful not to duplicate an already existing Cairngorm event. In the above mentioned article Jesse Warden suggested that Cairngorm needs a formalized concept for a Mediator, just as in PureMVC. I agree on that, but later in this article I will describe an approach bit more natural to Flex.

I won’t contribute to the second part of the discussion started by Jesse about the pros and cons of using singletons first because I agree with his point of view and second because as being such a fundamental and well known and widely used pattern its value or harm to application architectures have been discussed thoroughly.

The Gugga Approach

In the rest of the article I’ll write about the approach we use in the company I work for - it is not something new - I’ll write about things that have been around in the Flex community for a while and have been used successfully by plethora of Flex practitioners.
In part 1 and part 2 I’ve been showing you couple of architectures you can use almost right away as skeletons for your applications, but those architectures are way to MACRO to deal with the real challenges in building RIAs - user experience, human computer interaction and custom UI components - these are impossible to deal with using a MACRO approach. Sure, application architectures are important, but as soon as you gain the experience, you’ll start designing your own custom tailored application specific architectures, just like the sample architecture on the simple diagram below:

On the diagram I’m showing couple of Flex modules or just Flex components, which are implementing the MVC or MVCS (Model View Controller Service) patterns, but not in the terms of PureMVC or Cairngorm - I’ll get into more detail in the next section. The Application Controller manages the life-cycle of these modules and it is also responsible for catching application specific events from the modules, injecting the needed data for the modules, controlling the transitions between modules and updating the business specific data, which is kept in synch with the help of a Data Manager. This is a rather MACRO MVC architecture - where the Model is comprised by data and a Data Manager, the View is composed by modules, and the Controller is the thick thing in the middle.

An Architectural Blueprint for Flex Applications

Almost two years ago Joe Berkovitz wrote an article for the Adobe DevNet which to my opinion had a deep influence not only on a MACRO-level as a prescription for Flex application architectures, but also on a more MICRO-level as a blueprint for engineering Flex modules and Flex components. The realization that this MVCS approach is applicable in making Flex components didn’t came at once - it took us almost a year of building custom Flex components to discover the bitter truth that Flex framework UI components are not designed in the best way to cope with the broad spectrum of customization requirements. The current design and implementation bundles the core functionality of a component with an almost hard-coded view, thus forming a complex monolithic component. So instead of having a flexible way of customizing the view and the behavior through smart usage of inversion of control and dependency injection, right now the developer is constrained with overriding existing functionality and very often the sole possible way of getting the job done is to copy and modify code from the Flex framework. Off course the new versions of the Flex framework will introduce more and more improvements - the changes for the next version wouldn’t be that drastic as I want, but still they will address the most painful problems.

Instead of summarizing the blueprint proposed by Joe Berkovitz, I’ll show you a real MVCS-implementation, but before that you need to know what is inversion of control and how to use dependency injection in Flex.

Inversion of Control (IoC) Patterns

IoC patterns have two major goals - reducing class dependencies and extracting the creational logic and the components dependencies management outside the component. Let’s take for example this short code fragment:

package com.sample
{
    public class Loader
    {
        public function load() : void
        {
            ...
            var bar : IBar = new LoopingProgressBar();
            ...
        }
    }
}

This piece of code looks all right to the point when we decide to change the looping progress bar with a download progress bar. First the Loader has no core functionality changes what so ever, but because of this small change of the progress bar, we’ll end up messing with the Loader’s code and eventually it will need another compilation. Another way of doing this is to decouple the creational logic and use dependency injection as a form of runtime configuration of the Loader.

package com.sample
{
    public class Loader
    {
        private var _bar : IBar;
        public function set bar(value : IBar) : void
        {
            _bar = value;
        }
        public function get bar() : IBar
        {
            return _bar;
        }

        public function load() : void
        {
            ...
            // using the injected IBar-reference
            ...
        }
    }
}

In the code above I’m using the so called setter dependency injection, thus someone outside the Loader component will need to care about creating and injecting the proper progress bar instance, instead of hard-coding it inside the component. To be able to do that we need to use interfaces (or the most abstract form available) instead of concrete classes - this is how we avoid class dependencies.

MVCS with Inversion of Control

The way we do IoC in Flex is related to the Flex UI component life-cycle and the way in which the Flex data binding is triggered. We use these mechanisms instead of having a sophisticated IoC-containers, which is great because you don’t need to learn any new API. Actually you don’t really need to learn anything new if you’re already familiar with data binding and the Flex UI component life-cycle.

Let’s take a look at a typical MICRO-MVCS:

<gallery:PhotoGalleryClass xmlns:gallery="com.sample.gallery.*">
    <gallery:Model id="model"/>
    <gallery:Controller id="controller" model="{model}" service="{service}"/>
    <gallery:View id="view" model="{model}"
        nextPhoto="controller.loadNextPhoto();"
        prevPhoto="controller.loadPrevPhoto();"/>
    <gallery:Service id="service"/>
</gallery:PhotoGalleryClass>

This is the PhotoGallery.mxml component which inherits the PhotoGalleryClass as a form of a “code behind”. This component consists of a Model, a Service, a Controller that is injected with the Model and Service instances, and a View which is data bound to the Model. The nextPhoto and prevPhoto-events dispatched from the View are handled by invoking the Controller methods loadNextPhoto() or loadPrevPhoto() - these methods are using the Service to obtain from a remote destination the next or the previous photo in the gallery and to update the Model with the newly received data. The data binding between the View and the Model will automatically trigger the View updates.

Simple, huh? And all parts of this composition are potentially reusable.

This type of micro-MVC is getting more and more popular. The OpenFlux component framework is using a very similar architecture for every component in the framework, so it’s pretty convincing that this simple MVC combined with the power of IoC can be applied on different level of granularity, like for example the PhotoGallery.mxml can be a whole module or a whole application, or much simpler custom component. Ben Stucki wrote a very nice introduction to OpenFlux and I recommend you reading it. It is a very brief introduction, so it will take you less than 5 minutes to learn some very powerful concepts. You’ll notice that in OpenFlux there is no formalized Model, but if you think about it in most of the cases a change in the Model is very often coupled with a change in the component functionality, so this probably led to the decision to use the component itself as the Model for OpenFlux components.

Conclusion

Both Cairngorm and PureMVC originate from technologies which are not Flex, but Flex has some very powerful features like declarative style of programming inside the MXML and Data Binding. These combined with the UIComponent life-cycle gives us the functionality of something like an IoC-container. Getting more experienced with Flex will help us find much simpler and more powerful ways of using this IoC capabilities, which eventually will lead to designing application architectures more natural to Flex.

Reference

An Architectural Blueprint for Flex Applications by Joe Berkovitz
An Introduction to OpenFlux by Ben Stucki
OpenFlux is an open-source component framework for Flex which makes radically custom component development fast and easy.