Stripes and Gradients

One of the designs I am working on has a truckload of stripes over color gradients on different elements throughout the application. Now I could either have custom graphics for the elements embedded in the fla or do the more fun thing and write a class that drew stripes for me. So here it is. These are the first released classes from my voodoo framework (more on that later).

The Stripes class works as follows:
It creates a BitmapData object draws two rectangles, one semi-transparent and the other transparent. The BitmapData is then drawn on the target MovieClip using beginBitmapFill after being skewed by a Transformation Matrix.

[SWF] /blog/swf/Main.swf, 500, 600 [/SWF]

You can download the zip file with the AS file and fla here. I have also included the GradientRect class which lets you easily draw gradient rectangles on any MovieClip.

P.S. Thanks to unijimpe for the wp-swfobject plugin. Easiest way to embed swfs in WordPress.

Blogging from FlexSeminar, NY

Well, here I am, or rather have been for the last 5 hours, at the Roosevelt hotel, attending the Real World Flex Seminar.. Whats it been like? demos….loooots of demos. And thats exactly what I came for. Seeing some of the apps that adobe has developed has been pretty interesting. Some interesting apps I have seen are a complete CMS system (ShadoCMS) and a ColdFusion Framework for writing Flex apps based on CF backends. Not that many other application vendors although there are a bunch of consulting houses out here.

Got a few doubts cleared for FlexAmp v2 ;).

Links for the day:

Loading skins at Runtime

Static methods vs. Singletons

For the last 2 years, I have been working on a number of very intense projects that involved a truckload of AS2 code (I cant imagine ever doing it in AS1). As of today, the framework is pretty extensive with enough functionality to make the day-to-day stuff a breeze. However, there is always room for improvement so I keep flipping things around trying to make the most agile and adaptable system I can.

Some of the designs I recieved for an upcoming project looked like they could benefit from a little reorganization on the framework end. The situation was this: The designs for the user-controls (scrollbars, buttons, text inputs, etc) seemed to reuse the same drawing elements. For example the input areas for checkboxes, text inputs, etc looked exactly the same. So I figured, it would be neat if the controls in the framework could instantiate an application level graphics toolkit and pass MovieClips to it. The toolkit would then draw on the MovieClip to conform to the look and feel of the application. This made the controls in the framework fairly agnostic to the application look and feel.

The system works perfectly only if all the application-level graphics toolkits implement the same methods. For example, all toolkits would need a method to draw a text-input background or a button state etc. The whole idea of polymorphism fits wonderfully here: define an interface and let each implementation implement the functions that you mandate. Unfortunately in my case there was a snag: The simplest way I implemented the first toolkit was by making it have a series of static functions. So, for example, my text-input control code looks like:

class TextInput extends BaseControl{
private var _toolkit:IUIToolkit;
private var background:MovieClip;

/* init code */

public function set toolkit(t:String{
this._toolkit = eval(t);

public function build():Void{
throw new ToolkitUndefinedError();

A point to note above is that toolkit name is being sent in as a string. This ensures that you are not compiling any application level toolkit when you compile the framework. When you do the eval, the class name sent is evaluated and a class object is returned. This is the Flash equivalent of Java’s Class.forName().

Unfortunately, since all the functions in the toolkit class were static methods and Interfaces cannot define static methods, there was no way for me to ensure application toolkits would define the methods mentioned. The only solution was to have a singleton implementation for the toolkit so that you always instantiate ONE instance of a toolkit and use that.

Although that does seem like the best scenario, I am still not completely convinced especially in light of the AS3’s discontinuation of private constructors (sigh !). Anyways lets see how this works out.

I can always refactor later ;).

p.s : I found a rather interesting discussion on singletons here

Off to NY for the Real World Flex Seminar

Whew. The approval came just in time. I am off to the Real World Flex Seminar in NY on the 14th. While I have attended enough Adobe pitches on Flex 2 , I am more interested in how other industries are percieving it. Probably the most interesting session would be the one that talks about integrating Java and Flex 2. Coming from a Java background myself, hopefully I will have a better understanding of how Adobe imagines the workflow to be for a Java developer writing Flex apps.

..and a cupful of serverside configuration goodness…

Debugging isnt fun….
But it does have its moments, when you feel you have learnt something new.Like today….

First let me step back a bit and explain ip-domain mapping using host files on Windows. The Hosts file contains the mappings of IP addresses to host names. This file is loaded into memory (cache) at startup, then Windows checks the Hosts file before it queries any DNS servers, which enables it to override addresses in the DNS.[1] The host file is located at ‘C:WINDOWSsystem32driversetchosts’.

Typically, during development, I use host files to map urls for applications under development to the sub-domain of my main site. This allows me to access cookies etc while still running the web-app on my laptop.

While setting up an web-app today I mapped a domain to an ip using my host file, but could not bring the page up no matter how I hard tried. At my wit’s end I called upon our sys-admin and resident Solaris proponent to help me fix this problem. A couple of hours later I was on my way and had a much deeper understanding of server configuration stuff. Before I forget what I learned I figured I may as well save it for posterity by publishing it here.

The problem arose because I was trying to map my domain to an ip of a virtual server. While this is not a big deal (click here to see how Apache does it), there was something weird happening on my machine.
Typically servers, like regular computers, have physical interfaces that connect them to the network. However you can have multiple virtual interfaces each with individually assigned IP addresses on a single physical interface. Within the webserver software, listening sockets were defined and mapped to the IP addresses on our virtual interfaces.
Each of the virtual interfaces are associated with a listening socket and every virtual server instance is bound to that listening socket. Virtual servers themselves can be name based or ip based. IP-based virtual hosts use the IP address of the connection to determine the correct virtual host to serve whereas name based ones use DNS mappings of IPs to decide which host to serve

The behavior I was seeing turned out to be because while the server’s virtual server instances were bound to individual IP addresses, there were also names that identified what was allowed in the host request field sent by a browser. Since I defined a name in my local hosts file that didn’t match a name defined on the server to be associated with the virtual server instance that I tried to reach, the web server sent my browser’s request to its default, or primary instance.

…I am glad its a Friday !

The Fan: Flash Forward Finalist

FYI: The Fan has been nominated for Flash Forward as a finalist in the video category. Its pretty gratifying when you see something you have worked on for so long be appreciated by the online community. Check it out here and do show your appreciation by voting for us here. Oh, and while you are at Comcast Labs, check out the other cool stuff thats coming soon.

Flex 2 growing pains

As I continue to poke my way around with Flex2 in the few hours I get a week, once in a while I keep hitting walls that I dont really expect. And with any new technology, my skills with google search yield few results to ease the pain. Take today for example…

So there I was trying to write this real easy app that would take this not too convoluted XML file and render it in a list with the node-names as the entries. Nothing simpler, you say?…not quite. For the longest time after putzing with the HTTPService class, I was still not able to read the stupid document. I looked at some of the examples couldnt quite find out what I was doing wrong…..until 5 minutes ago.

Turns out HTTPService returns the data as an object by default. To get an XML document back make sure you have resultFormat=”xml” in the HTTPService.

Oh, and remember to keep XML.ignoreWhitespace = “true”.

…source code coming soon.