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

Hash Map in Flex / AIR / AS3

A HashMap lets you look up values by exact key (always case-sensitive). It is very much like a Hashtable, except that it is faster and not thread-safe. There are some minor other differences:

* HashMaps work with Iterators where the older Hashtables work with Enumerations
* Hashtables work best with capacities that are prime numbers. HashMaps round capacities up to powers of two.
In Flex we dont have such a facility to look up values by exact key , so i tried to create a HashMap Class which have almost all the typical function needed to be used in the application, i have created a custom Stack Class too and will be sharing the code for that too soon.

Here goes the code :-

package
{
public class HashMap
{
public var keys:Array;
public var values:Array;
//
public function HashMap()
{
super();
this.keys = new Array();
this.values = new Array();
}

public function containsKey(key:Object):Boolean
{
return (this.findKey(key) > -1);
}
public function containsValue(value:Object):Boolean
{
return (this.findValue(value) > -1);
}
public function getKeys():Array
{
return (this.keys.slice());
}
public function getValues():Array
{
return (this.values.slice());
}
public function get(key:Object):Object
{
return (values[this.findKey(key)]);
}
public function put(key:Object, value:Object):void
{
var oldKey;
var theKey = this.findKey(key);
if (theKey < 0)
{
this.keys.push(key);
this.values.push(value);
}
}
public function putAll(map:HashMap):void
{
var theValues = map.getValues();
var theKeys = map.getKeys();
var max = keys.length;
for (var i = 0; i < max; i = i - 1)
{
this.put(theKeys[i], theValues[i]);
}
}
public function clear():void
{
this.keys = new Array();
this.values = new Array();
}
public function remove(ikey:Object):Object
{
var theiKey = this.findKey(ikey);
if (theiKey > -1)
{
var theValue = this.values[theiKey];
this.values.splice(theiKey, 1);
this.keys.splice(theiKey, 1);
return (theValue);
}
}
public function size():int
{
return (this.keys.length);
}
public function isEmpty():Boolean
{
return (this.size() < 1);
}
public function findKey(key:Object):Object
{
var index = this.keys.length;
while(this.keys[--index] !== key.toString() && index > -1)
{
}
return(index);
}
public function findValue(value:Object):Object
{
var index = this.values.length;
while(this.values[--index] !== value && index > -1)
{
}
return (index);
}

}
}

Cheers

Varun Rathore

How To Call Methods from a External SWF (Reflection in Flex )

While loading the swf from a external source , we are always wondering what all methods it may have , the developers have to seek help from the swf coders to get the methods and commnets for the methods which they have created, sometimes the developers provide the swf but fail to provide a meaningful API with which you can interact with the swf.

The Phenomenon of seeing the properties and methods of the class is know as 'reflection', to achieve this in flex we need to use the SWF loader to load the swf into the application as follows

var swfUrl : String = "www.varunrathore.co.cc";// path to your swf
var req: URLRequest = new URLRequest(swfUrl);
var loader : URLLoader = new URLLoader(req);

Now we will be using the class to get the remote objects .Once you have the class names it was a matter of the actual introspection to see the available methods. To do this you can use the getDefinition method of the ApplicationDomain class in Flex
var classUsed:Class = loader.contentLoaderInfo.applicationDomain.getDefinition(className) as Class;


Here we get a XMl with all the methods and variables ...
var remoteSWF:Object = loader.content as Object;

Just call the method you wish to call from the SWF
remoteSWF.methodToBeCalled(); // calling the desired method with its name



Cheers

Varun Rathore

How to escape characters while Saving Data in SQLITE database

I have used the following function while saving data to sqllite if the data had some characters which needed to be escaped passing the string to the function returns the escapes string .

private static function SQLSafe(strTemp:String):String
{
var i:Number = 0;
var iOld:Number = 0;
var firstQuote:Boolean = false;
var strNew:String = "";
strTemp = StringUtil.trim(strTemp);
while (i != -1){
i = strTemp.indexOf("'", i);
if (i != -1){
if ((strNew != "") || (firstQuote)){
strNew += "'" + strTemp.substring(iOld, i);
}
else if (i != 0) {
strNew = strTemp.substring(iOld, i);
}
else {
firstQuote = true;
}
iOld = i;
i++;
}
}
if (iOld <= strTemp.length){
if (strNew != ""){
strNew += "'" + strTemp.substring(iOld, strTemp.length);
}
else {
strNew = strTemp.substring(iOld, strTemp.length);
}
}
return (strNew);
}


Cheers

Varun Rathore

Debugging the Flex / Flash / AIR from outside the flex builder

Arthropod is an external Debug trace window for Flash/Flex/AIR. Drop a simple class into your project and it will accept logging from the application/swf.
You can download the sample application from :-
http://arthropod.stopp.se/


Cheers Varun Rathore

Determining Inactivity in Flex (FlexEvent.IDLE)

A FlexEvent.IDLE event is dispatched every 100 milliseconds when there is no keyboard or mouse activity for 1 second.

In order to use the following event we need to import the following classes.
1. import mx.managers.SystemManager;
2. import mx.events.FlexEvent;
3. import mx.core.mx_internal;

You’ll need to tell your program that you want to use mx_internal as a namespace to access those properties within the SystemManager class. SytemManager has an “idleCounter” property which is super useful to access- but it is scoped to mx_internal and is not normally accessible. Trying to access it without these steps will throw an error:

1. use namespace mx_internal;

SystemManager is automatically instantiated as a part of every Flex app, so we do not need to do this manually. We will, however, need to add an event listener for FlexEvent.IDLE:

1. this.systemManager.addEventListener(FlexEvent.IDLE, userIdle);

Construct the callback method. One minutes is equal to 60000 milliseconds… divided by 100 ticks and the number we need to check against is 600. Of course, you’ll probably want something a little shorter in duration for testing:


private function userIdle(e:FlexEvent):void {
if(e.currentTarget.mx_internal::idleCounter == 600){
//do something!
}
}

Note that we prefix the idle Counter property with the mx_internal namespace.

That’s it! Now we have a sweet little activity monitor in our app. When activity is detected, idle Counter will automatically reset as well.

Ribbit - Integrate Voice and Rich Communication

Ribbit - An open platform for multi-protocol communication for creating cool voiceware applications.
The Ribbit API's are simple and gives the opportunity to create new communication solutions for all sort of demands.
It enables developer to bring richness of voice calling and Web 2 Experience. You can add voice and Messaging service to your application without any traditional mobile phone intervention.
One thing that i found really good in Ribbit API is that Voice and Message can be delivered and received on multiple devices in multiple location across any sort of network.