Charts for Mobiles

Its a great feature that Adobe has given support for Flex charts on mobiles

All the MX charting components can be used in mobile development. Just need to make sure that you don’t use too much of animations in your project.

Best practice to have good performance is not to use animations.

All the best for your Mobile Projects…
Have a nice Dev Time

SQL Database Connection with Flex Air

Just create simple air application in Flex.
Using the below code you can able to connect to database.

<?xml version=“1.0″ encoding=“utf-8″?>
<mx:WindowedApplication xmlns:mx=“http://www.adobe.com/2006/mxml”
layout=“absolute” creationComplete=“init()”>
<mx:Script>
<![CDATA[
import mx.controls.Alert;

private var dbConn:SQLConnection;
private var dbFile:File;

private function init():void
{
	dbFile = File.applicationStorageDirectory.resolvePath("flashallys.db");

	dbConn = new SQLConnection();

try
{
	dbConn.open(dbFile, SQLMode.CREATE);
}
catch(e:SQLError)
{
	Alert.show("SQL Error Occured: ", e.message);
}
}
]]>
</mx:Script>
</mx:WindowedApplication>

Here goes the explanation

These two lines are mandatory to declare the SQL connection and to declare db file.

private var dbConn:SQLConnection;
private var dbFile:File;

We apply init funtion for this to dish out the file storage and to establish SQL connection.
private function init():void
{
dbFile = File.applicationStorageDirectory.resolvePath(“flashallys.db”);

dbConn = new SQLConnection();

This part of the code figures out if the output is productive and connects to the database.
try
{
dbConn.open(dbFile, SQLMode.CREATE);
}

Or else,this turns out to display the occurence of an error.
catch(e:SQLError)
{
Alert.show(“SQL Error Occured: “, e.message);
}
}

CS4, CS3 caretIndex Word

The code also works with flash cs3


import fl.controls.TextInput;
import fl.controls.Label;

var myLabel:Label = new Label();
myLabel.text = "Caret Index Word";
myLabel.x = 5;
myLabel.y = 0;
addChild(myLabel);

var textInput:TextInput = new TextInput();
textInput.x = 100;
textInput.y = 10;
addChild(textInput);

var t:Timer = new Timer(100);
t.addEventListener(TimerEvent.TIMER, caretindex);

function caretindex(e:TimerEvent):void {
	var caretIndex:Number = textfield.getCharIndexAtPoint(textfield.mouseX, textfield.mouseY)
	if(caretIndex == -1) {
		return;
	}
	var str:String = textfield.text;
	var words:Array = str.split(' ');
	var n:Number = 0;
	while(n<=words.length){
		var subset:Array = words.slice(0, n);
		var sliceString:String = subset.join(' ');
		if(sliceString.length>caretIndex) {
			textInput.text = String(subset[n-1]);
			break
		}
		n++;
	}
}
t.start();

This movie requires Flash Player 9

using LinearGradient in spark flex


<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
			   xmlns:mx="library://ns.adobe.com/flex/mx"
			   xmlns:s="library://ns.adobe.com/flex/spark"
			   width="200" height="200"
			   left="20" right="20"
			   top="20" bottom="20">
		<s:Rect x="0" y="0"
				height="100%" width="100%">
			<s:fill>
				<s:LinearGradient>
					<s:entries>
						<mx:GradientEntry color="0xFF0000"/>
						<mx:GradientEntry color="0x00FF00"/>
						<mx:GradientEntry color="0x0000FF"/>
					</s:entries>
				</s:LinearGradient>
			</s:fill>
		</s:Rect>
</s:Application>

using Spark BorderContainer

Simple Example which shows you how to use border container in spark

Just I have inserted simple label inside container


<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:mx="library://ns.adobe.com/flex/mx"
    xmlns:s="library://ns.adobe.com/flex/spark"> 

    <s:BorderContainer
        backgroundColor="red" cornerRadius="10"
        borderStyle="inset" borderWeight="4" >
        <s:Label text="Some text here" />
    </s:BorderContainer>
</s:Application>

Setting Vertical Layout for Application tag in Spark

Following example shows how to setup vertical layout in spark application tag


<?xml version="1.0" encoding="utf-8"?>
<s:Application	 xmlns:fx="http://ns.adobe.com/mxml/2009"
   		 xmlns:mx="library://ns.adobe.com/flex/mx"
   		 xmlns:s="library://ns.adobe.com/flex/spark"> 

        <s:layout>
            <s:VerticalLayout
                paddingLeft="5" paddingRight="5"
                paddingTop="5" paddingBottom="5"/>
        </s:layout>

        <s:Button label="Sample1"/>
        <s:Button label="Sample2"/>
        <s:Button label="Sample3"/>
        <s:Button label="Sample4"/>

</s:Application>

list of flex testing frameworks

This is the list of flex testing frameworks Which I came Across

FlexUnit (Adobe Open Source)
FlexPMD (Adobe Technical Services)
Funit (Open Source)
asUnit (Open Source)
fluint (Open Source)
FlexMonkey (Open Source)
Selenium (Open Source)
FlashSelenium (Open Source)
HP QuickTest Professional 9.5
mock-as3 (Open Source)
FlexCover (Open Source)
FunFX
Mock4AS
ASMock
Mockito

List of flex frameworks

This is the list of flex frame works Which I came Across, Let me know if i miss any

1. Cairngorm (Adobe Open Source)

2. PureMVC (Open Source)

3. Mate (Open Source)

4. Swiz (Open Source)

5. Spring ActionScript (Open Source)

6. Parsley (Open Source)

7. Robotlegs

8. HydraMVC

9. dpHibernate

10. Fight Framework

11. Lowra Framework

How to remove White Box between the scrollers using action script

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="400" height="300">
    <mx:Script>
        <![CDATA[
            override public function validateDisplayList():void {
                super.validateDisplayList();
                for (var i:Number=0; i<rawChildren.numChildren; i++) {
                    if ((rawChildren.getChildAt( i ) as DisplayObject).name == "whiteBox" ) {
                        ((rawChildren.getChildAt( i ) as DisplayObject) as Shape).graphics.clear();
                    }
                }
            }
        ]]>
    </mx:Script>
    <mx:Text text="1221sdfsdfssdfs&#xa;sdfsdf&#xa;sdfs&#xa;fs&#xa;fsd&#xa;fsd&#xa;fsd&#xa;fsd&#xa;fsd&#xa;fsd&#xa;fsd&#xa;fs&#xa;df&#xa;sdf&#xa;sdfdfs d&#xa;|sdfsdfsdfsdfsdf sdf sdf sd fsdfsdfsdsdfsfsdfsfdsfdffsdf sdf sdf sdf sdfsdsdfsfsdf&#xa;sdfsdfsdfsdfs&#xa;sdf&#xa;sdfsd&#xa;fsd&#xa;f&#xa;sdfsd&#xa;f&#xa;sfd fsdfdsfsdfsdffsd sdf sdffs dfdf"/>
</mx:Canvas>
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:local="*">
    <local:myCanvas>

    </local:myCanvas>
</mx:Application>

How to use scale9Grid with display objects in action script

This code shows how to use display objects like GradientType, InterpolationMethod, SpreadMethod and scale9Grid.


var rect:Shape = new Shape();
rect.graphics.lineStyle(10, 0x000000);
var matrix:Matrix = new Matrix();
matrix.createGradientBox(15, 15, Math.PI, 10, 10);
rect.graphics.beginGradientFill(GradientType.RADIAL,[0x000000, 0x76A3DA], [100, 100],
            [0, 0xFF],matrix,SpreadMethod.REFLECT,InterpolationMethod.RGB,0.9);

rect.graphics.drawRect(0, 0, 90, 90);

var grid:Rectangle = new Rectangle(20, 20, 50, 50);
rect.scale9Grid = grid ;

addChild(rect);

var timer:Timer = new Timer(80);
timer.start();
timer.addEventListener(TimerEvent.TIMER, imageResize);

var scale:Number = 1.01;

function imageResize(event:TimerEvent):void {
    rect.scaleX *= scale;
    rect.scaleY *= scale;

    if (rect.scaleX > 2.0) {
        scale = 0.99;
    }
    if (rect.scaleX < 1.0) {
        scale = 1.01;
    }
}

This movie requires Flash Player 9