Spring ActionScript Configuration in Flash/Flex/AIR application

Just as we use the applicationContext.xml in java application where we map the classes to the objecys in the context file and mapping the variables in the class files to the properties in the configuration file, we can use a simialr methodolgy in our flex application and get the changes to the variable by just changing in the configuration file , without building or refreshing the application.

Here is the code sniplet which is used to achive the following :-
// spring actionscript config
var applicationContext : FlexXMLApplicationContext =new FlexXMLApplicationContext("config.xml");
applicationContext .addEventListener(Event.COMPLETE, onApplicationContextComplete);
applicationContext.load();

protected function onApplicationContextComplete(event:Event):void
{
var appConfig : AppConfig = applicationContext.getObject("appConfig");
model.appConfig = appConfig;
resourceManager.localeChain = [appConfig.locale];

}

// HERE model.appConfig is the actionscript class which i have mapped to the object in my configuration file.
AppConfig.as file is as follows :-
package com.infoswell.model.global
{
[Bindable]
public class AppConfig
{
// src path used as root to locate images, etc.
public var srcPath:String = "";


// locale for menu config path
// note: curently resource bundle properties locale from project compile options
public var locale:String = "en_US";

public function AppConfig()
{
}

}
}


The config.xml is as follows:-

xsi:schemaLocation="http://www.pranaframework.org/objects
http://www.pranaframework.org/schema/objects/prana-objects-0.6.xsd">



The swc file which is used in the application can be created as follows :-
First download the source using a subversion client from the following url:

https://src.springframework.org/svn/se-springactionscript-as/

Step into the ant folder and execute “ant” to see the options. You can create a debug enabled version, a release, documentation. I created the debug enabled version with the following command. Of course you do have to have ant on your path. Do not forget to change the build.properties. You need to change the FLEX_HOME parameter as described in the readme file that comes with the sources.

ant compile-main-debug

The swc file is created in the antbuild/compile/main/swc folder.

Use the swc created in the project libs folder and use this extra ordinary feture to load configuration from outside.

Cheers
Varun

Ammaps in Flex

Here is way to implement ammaps in flex , i used swfloader to add the ammaps in my application as follows

var str : String = "assets/ammap.swf?settings_file=assets/ammap_settings.xml&data_file=assets/ammap_data.xml"

swLoader.load(str);



where i kept all the required files(swf/xml) in assets folders of my application.

Regards
Varun

Making Sharper Flex Application with Sharper Fonts

I am not a multi fan of using fonts in Flex , i had to put a very smaller font which was to be very sharp , Here is a example to add it , i tried it in my css but it can be done with setStyle Attribute too, here is the code sniplet and the result
Just define following in your css
@font-face
{
src: url("../font/kroe0555.ttf");
fontFamily: StandardFont;
flashType: true;
}
Application
{
color : #CCCCCC;
focus-thickness : 0.4;
font-size : 8;
font-grid-fit-type :subpixel;
font-sharpness : 1;
font-anti-alias-type: normal;
font-weight : normal;
}

Cheers
Varun

A great Flex Map Component Mercator.swc

Mercator Flash/Flex Component from Manfred Weber is the coolest map componet i have seen with such a cool features, to zoom, get center, lattitude,longitude with additional markers and distance lines , i tried to create the map and within minutes i created a realy cool map with color and populating the map from a xml.The component contains all countries of the world and additional 8000 cities + the corresponding latitude and longitude

Just I think he has not updated the SWC file for the markers...... i think he will do it soon check out the demo at http://dev.dschini.org/mercator-swc/demos.php

Cheers
Varun

Security Error 2060:Security sandbox violation: ExternalInterface caller

Many a times we see such issues that we are not able to launch the application from html file and see the following error---

Security Error 2060: Security sandbox violation: ExternalInterface caller
file:///C:/Varun/myproject.swf
cannot access
file:///C:/Varun/myproject.html

So to avoid such a error you need to make some changes in html template html
In the HTML template make sure that the parameter 'allowscriptaccess' is set to 'always'

'allowScriptAccess','always',
param name="allowScriptAccess" value=“always"
if you are making a Object of swf from a flex application you can add the following parameter to the Object
swfObject.addParam('allowscriptaccess', 'always');

Cheers

Varun Rathore

I am on Adobe Feed Now :)

Today i am very delighted , my blog has been added in Adobe feeds , i would try my best to share my knowledge and views on RIA.

Its me on my Bullet.

Cheers

Varun Rathore

Adding Custom Components to Text Layout Framework(ADOBE LABS)

The Text Layout Framework is a set of ActionScript 3.0 libraries with support for complex scripts and advanced typographic and layout features not available in the TextField class,It allows us to add custom components and Display objects in the TextArea making the issue of adding headers, tables and providing loacl anchor links , also we can add multiple TextFlow elements in between the display objects and set the selection in between those elements. Still there are some Bugs which make the Text Layout framework informal to handle but overall we can achieve a good sort of text Typography which was earlier missing in Flash.
here is a code sniplet which i used to make multiple TextFlow elements inside onemain container.

// Creating a TextFlow for handling selected Text and editing
[Bindable]public var selectedFlow : TextFlow ;

// Adding UIComponent and TextFlow Dynamically, where is a public class //LinkedContainers extends Sprite
var dspObj : DisplayObject = new LinkedContainers();
dspObj.name = "dspObject";
var ufComponent = new UIComponent();

var custTextFlow : TextFlow = new TextFlow();
custTextFlow.flowComposer.addController(new DisplayObjectContainerController(ufComponent,textArea.width,textArea.height));

// setup event listeners for selection changed and ILG loaded
custTextFlow.addEventListener(SelectionEvent.SELECTION_CHANGE,selectionChangeListener,false,0,true);
custTextFlow.addEventListener(StatusChangeEvent.INLINE_GRAPHIC_STATUS_CHANGED,graphicStatusChangeEvent,false,0,true);
//_textFlow.addEventListener(CompositionCompletionEvent.COMPOSITION_COMPLETE,checkCompositionChange);
custTextFlow.addEventListener(SelectionEvent.SELECTION_CHANGE,function checkChange():void{
selectedFlow = custTextFlow;

Cheers
Varun Rathore

Reducing Flex Application Size Drastically

Most of us while working on Flex applications get into a big problem of downloading time , as the application size increases it takes more time to get downloaded on the client machine, here are few things which i found to reduce the size of the application which makes the download time to get reduced drastically

The following three methods acn reduce the swf size by 70%

1. go to project properties->flex build path->library path -> framework linkage->select RSL from drop down press ok
2. go to project properties->flex complier->additional complier arguments
add "-debug=false" in the end -> press apply and ok.

3. Using a modular approach for application building, this can further reduce the application size.

Cheers

Varun Rathore

REQUEST HEADERS in FLEX using GET - POST Methods

We can modify Request Header in Flex under the certain circumstances only

var header:URLRequestHeader = new URLRequestHeader("newHeader", "newValue");
var request:URLRequest = new URLRequest("http://www.[vrathore.blogspot].com/");
request.data = new URLVariables("name=Varun+Rathore");
request.requestHeaders.push(header);

However, its possible to modify the headers on a POST request only.
request.method = URLRequestMethod.POST;

This should be taken care that we specifically give the request method as the Flash Player will convert POST requests into GET requests if the request is empty.

Other thing which should be kept in mind is to pass atleast one variable along with the request. Otherwise the headers will remain unchanged.
var variables:URLVariables = new URLVariables();
variables.name = "newValue";
request.data = variables;

Cheers
Varun Rathore

Stack Component in Flex /AIR / AS3

While working on a auditors project i had a scenario where i was to upload files on every object of the for loop and i was to upload the file on the server with a returning id from the previous action , so that the coming files will be uploaded as the child of the previous files(As in the tree structure). I had to create a Stack class which solved my problem. The function defined are pop(), push() and peek().
I will be adding Linked List Component shortly......

Here is the Code :-

a) Stack Class

package
{

public class Stack
{
private var first : Node;

public function isEmpty ():Boolean
{
return first == null;
}

public function push (data : Object):void
{
var oldFirst : Node = first;
first = new Node ();
first.data = data;
first.next = oldFirst;
}

public function pop () : Object
{
if (isEmpty ())
{
trace ("Error: \n\t Objects of type Stack must containt data before you attempt to pop");
return null;
}
var data:Object = first.data;
first = first.next;
return data;
}

public function peek () : Object
{
if (isEmpty ())
{
trace ("Error: \n\t Objects of type Stack must containt data before you attempt to peek");
return null;
}
return first.data;
}
}
}

b)
Node Class as the store house object used in Stack Class
package
{

public class Node
{
public function Node()
{
}

public var next : Node;
public var data : Object;
}
}

Cheers

Varun Rathore