Apache – Adobe Flex Framework Diagram wallpaper

• How productive it is to program in Flex compared to the .Net + Silverlight?

Way more productive than Silverlight as it has a much richer and capable control library. Silverlight is rapidly gaining ground here though. I think by the time SL 4 comes out they will reach feature parity, maybe even SL 3.

• Any technical advantages over other frameworks?

If you can create it in Photoshop, you can pretty much do it in Flex with the help of the Flash drawing API. If you want to build very interesting data visualizations (tree/node diagrams, such as an org chart) you can do this Flex without a ton of work.

• Any disadvantages ?

There is no server-side component to ActionScript so you need to find a way to pass data between Flex and your backend, be it Java, .NET, PHP, etc. There are libraries out there to AMF remoting with just about any backend which makes it easy. But as far as the objects you pass between the two, you need to maintain both or use a code generation tool to create AS3 classes from your backend classes.

• Does it have any known scaling issues?

Flex is simply a presentation technology so this question doesn't really apply.

• What kind of web servers can it be hosted on?

Again, only a presentation technology. It compiles out to a SWF file that is loaded by the browser over HTTP and then executes inside of the Flash Player plugin.

Creating a tiled backgound in Flex 3 is not available through the use of of CSS styles or property styles.

However it is possible simply by assigning your component a custom programmatic skin, which handles the drawing of the tiled image through using the raw bitmap data.

Let me further illustrate my point with some code

<mx:Canvas borderSkin="{TiledBackgroundSkin}"
    width="100%" height="100%">
</mx:Canvas>

That is your component with a programmatic border skin applied to it.

Now you just create that border skin by extending the RectangularBorder class. Such as:

public class TiledBackgroundSkin extends RectangularBorder
{
    [Bindable]      
    [Embed(source='tile.jpg')]
    private var tileImageClass  :Class;
    private var tileBitmapData  :BitmapData;

    public function TiledBackgroundSkin()
    {
        super(); 
        createBitmap()
    }

    /** A private method that handles the drawing of the bitmap **/
    private function createBitmap():void
    {
        var backgroundImage:Bitmap = new tileImageClass();
        tileBitmapData = new BitmapData(backgroundImage.width,backgroundImage.height);
        tileBitmapData.draw( backgroundImage );
    }

    /** Override updateDisplayList to draw the Tiled Background **/
    override protected function updateDisplayList(  unscaledWidth:Number,unscaledHeight:Number ):void 
    {
        super.updateDisplayList(unscaledWidth,unscaledHeight );
        graphics.clear();
        graphics.beginBitmapFill( tileBitmapData );
        graphics.drawRect(0,0,unscaledWidth,unscaledHeight);
        graphics.endFill();
    }       
}

The constructor creates the bitmap image for tiling.

Then the updateDisplayList method (called after initial creation and for subsequent resizes of the component) fills the entire component with the tiled background.

If you wish to adjust the offset positioning of the tiled image, you would do so in the updateDisplayList method