BTA Flexing

My passion RIAs…………..Shardul Singh Bartwal

Archive for the ‘Flex’ Category

Flash,Flex Vs HTML 5

Posted by Shardul Singh Bartwal on February 25, 2012

I was checking the HTML 5 with Java script,CSS 3 and Jquery around since last 4 months.Also was keeping my eyes on this since 2008,but never get inspired to do anything.Now also I found that HTML 5 is still in the state where Flash was 7 to 8 years back.HTML 5 can replace maximum of simple banners and animated advertisements which were created using the flash.For that also the development cost is going to increase and quality will be not up to that extent as the Flash has provided long earlier.

But for the Audio/Video Streaming,Image manipulation,Gaming and Enterprise applications HTML5 needs to take still around 10 years.Also currently I don’t found any thing as impressive as AMF for the Client Server communication over the internet.The reason for this is simply that HTML 5 is also a markup language.You can check the link below,you will realize where the HTML 5 is in reality:-

http://www.w3.org/TR/html5-diff/

So the only thing which I will like to say is that Flash and HTML 5 will be needed in the same way
as earlier they were used together on the web.If you will try to replace Flash by HTML 5 for the small
purpose then you have to pay lot more then flash.And if you will be trying to create the Enterprise Application with HTML 5 then I think you will come back to Flex one day.Flash player is ruling since last 15 plus years,its not so simple to replace that.

Keep Rocking………..

Posted in ActionScript 3.0, Flex, Flex 3.0, Uncategorized | 3 Comments »

Using charts inside Mobile Applications with Adobe AIR

Posted by Shardul Singh Bartwal on January 30, 2012

I was in a big doubt since very long time,I was waiting for the new version of the Charts under the Spark Components,so that I can use them inside the mobile applications.But I was surprised also that why there is nothing for this in the Spark components.But Yesterday I just checked with the MX Charts components in my mobile application for a demo on my Samsung mobile,and things were working excellent and smooth.Was happy and surprised also that how is it is it possible?. Later on started to search on the net for this.And found it on my first click.It was clearly mention there at http://www.adobe.com/devnet/flex/articles/mobile-development-flex-flashbuilder.html#articlecontentAdobe_numberedheader_1 by Narciso Jaramillo long long ago that:-.

Charts are supported in mobile projects, but other MX components are not. We don’t recommend using MX components in mobile projects; use the Spark components instead. The one exception is the charting components, which are usable in mobile projects if care is taken to avoid displaying or animating too much data at once.

So finally I have to made myself satisfy with ‘Better late than never.’
Hence sharing it,hope this can help someone.

Keep Rocking………..

Posted in ActionScript 3.0, AIR, Flash Builder 4.6, Flex, Mobile Applications with Adobe AIR | Tagged: , , , , , , , , , , , , , , , , , | 4 Comments »

Official Flex User Group Tour date announcement started by Adobe

Posted by Shardul Singh Bartwal on January 29, 2012

Its nice to see that adobe has started their International Flex User Group Tour
to discuss their last year ends announcements about Flex and Flash Platform.They
have announced the dates for the North America.

Schedule can be checked at:-

http://blogs.adobe.com/flex/2012/01/announcing-flex-user-group-2012-tour-north-america-dates.html

Waiting for the turn of Asia including India.

Enjoy Flexing…….
Shardul

Posted in ActionScript 3.0, AIR, Flex, Flex 3.0, Flex 4 | Leave a Comment »

Flex 4.5 Book for ios Development

Posted by Shardul Singh Bartwal on September 21, 2011

Below is the wonderful link for purchasing the book for developing the ios based application using the Flex 4.5.

Flex 4.5 Book for ios Development

Enjoy…Flexing……..

Posted in Flex, Flex 4.5, iPhone iPad | Tagged: | 1 Comment »

Unit Testing in Flex 4 application Using Flash-Builder 4

Posted by Shardul Singh Bartwal on June 30, 2011

Inside the Flash builder 4 simply create a new Flex project,I am naming it as UnitTestingDemo.
1)I have created a class with name MyMath.as under the folder the utils,I am putting it inside the utils just for practice.
Which is as below:-

package utils
{
public class MyMath
{
public function MyMath()
{
}

public function add(num1 : Number,num2 : Number) : Number
{
return num1 + num2;
}

public function multiply(num1 : Number,num2 : Number) : Number
{
return num1 * num2;
}
}
}

2)Now go to File>New>Test Case Class

1

3)Now I am createing a class with name MyTestCase1. See below:-
2

Click on the Browser button.

4)It will look as :-
3
Select the MyMath and click OK as below:-

Now it should look like:-
4

click on Next button.You will see like below:-
5

Click Finish.

5)Now on the Package Explorer on the left you will MyTestCase1.as under the folder flexUnitTests.You will see there a method with name testAdd() inside this class.

Now I am going to check for my expected positive result from this method.As we know that 5+6=11.So I have written like this inside this method:-

var myMath : MyMath = new MyMath();
Assert.assertEquals(myMath.add(5,6),11);

6)Now Click on the MyTestCase1.as and select it on the left side Package Explorer.Right Mouse click on this.You will see there a menu with title ‘Execute Flex UnitTests’ click on this.If every thing goes well you will see like below in your browser:-

6

Except this inside flash builder you will see a tab with title ‘FlexUnit Results’ Explore this for detail investigation.

Enjoy Flexing………….. 🙂

Posted in ActionScript 3.0, Flex, Flex 4 | Leave a Comment »

Datagrid with multiLine variable height text Item Renderer in Flex

Posted by Shardul Singh Bartwal on December 15, 2010

I was trying to get the multiline text inside the item renderer of a column and I tried a lot for this with multiple controls like TextInput, Textarea, Label etc by using the item render but was not getting the proper output.The thing which I was getting was that every item rendererer was taking the same height which was for the maximum height item renderer,and was not based on the content inside it.
The reason was only that earlier I was putting my these controls inside a Container and
there was sizing related issue for the container as I was not able to make different item renderes of different heights depending upon the text of the field inside it. But later I created my item render directly from the Text component and got the perfect result.

Main Application

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" backgroundColor="0xFFFFFF" 
	layout="vertical">
	<mx:Script>
		 <![CDATA[
       	import mx.controls.Alert;
           import mx.collections.ArrayCollection;
           
           [Bindable]
           public var arrayCollection:ArrayCollection = new ArrayCollection([
               {indexNo : '1',description:'Shardul just trying for multiline text item Renderer'},
               {indexNo : '2',description:'This text should appear on more then one line of text and it will definetly appear lets try.'},
               {indexNo : '3',description:'Cool its working fine without any prolbem hope you all will like this.'},
           ]);
           
       ]]>
	</mx:Script>   

   
 	 <mx:DataGrid width="300" height="200"
                variableRowHeight="true"
                dataProvider="{arrayCollection}">
        <mx:columns>
        	<mx:DataGridColumn headerText="IndexNo" dataField="indexNo"/>
            <mx:DataGridColumn headerText="Label Check" dataField="description" itemRenderer="VariableHeightItemRenderer"/>
        </mx:columns>
    </mx:DataGrid>
    
</mx:Application>

VariableHeightItemRenderer

<?xml version="1.0" encoding="utf-8"?>
<mx:Text xmlns:mx="http://www.adobe.com/2006/mxml"  text="{data.description}"
	 buttonMode="true" useHandCursor="true" mouseChildren="false" >
	<mx:Script>
		<![CDATA[
			override public function set data(value:Object):void
			{
				if(value != null)
				super.data = value;
			}
		]]>
	</mx:Script>
</mx:Text>

Hope you will enjoy this.
Keep rocking………..Happy flexing….

Posted in ActionScript 3.0, Flash Builder 4.6, Flex, Flex 4 | Tagged: , , , , , , , , , , , , , , , , , , , , | 2 Comments »

Byte Array to BitmapData and BitmapData to Byte array in Flex 3.

Posted by Shardul Singh Bartwal on October 14, 2010

In the code below I am initially getting the byte array of my canvas with the increased size. Converting it into Bitmap data.And again converting that Bitmap data into ByteArray. So that you can use the particular step which one you require.

</pre>
<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

<mx:Script>
<![CDATA[
import mx.controls.Alert;

import mx.graphics.ImageSnapshot;
import mx.graphics.codec.JPEGEncoder;

private var imageSnapshot:ImageSnapshot
private function inLargeImage():void
{
var jPEGEncoder:JPEGEncoder = new JPEGEncoder(90);
imageSnapshot = ImageSnapshot.captureImage(imgCanvas,500, jPEGEncoder,true);

//imageSnapshot.data is ByteArray.
byteArrayToBitmapData(imageSnapshot.data);
}

private var loader : Loader = new Loader();
private function byteArrayToBitmapData(byteArray : ByteArray):void
{
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, getBitmapData);
loader.loadBytes(byteArray);
}
private var bitmapData:BitmapData
private function getBitmapData(e:Event):void {
var content:* = loader.content;
bitmapData = new BitmapData(content.width,content.height,true,0x00000000);

var matrix:Matrix = new Matrix();
bitmapData.draw(content, matrix,null,null,null,true);
targetImage.source = new Bitmap( bitmapData );

}

private function saveInLargeImage() : void
{
if(bitmapData == null)
{
Alert.show("InLarge Image first,and then try again.")
return;
}

var encoder:JPEGEncoder = new JPEGEncoder(90);
var byteArray:ByteArray = encoder.encode(bitmapData);
var fr : FileReference= new FileReference();
fr.save(byteArray,'abcd.jpg');
}

]]>
</mx:Script>

<mx:VBox horizontalAlign="center" verticalAlign="middle" width="100%" height="100%">
<mx:VBox id="imgCanvas" width="600" height="450" horizontalAlign="center"
verticalAlign="middle" backgroundColor="0x0000FF">
<mx:Image source="image1.jpg"/>
</mx:VBox>

<mx:Image id="targetImage"/>

<mx:Button click="inLargeImage()" label="Inlarge Image"/>
<mx:Button label="Save To Your Computer" click="saveInLargeImage()"/>
</mx:VBox>

</mx:Application>
<pre>

Hope you will enjoy this……..

Posted in ActionScript 3.0, AIR, Flash Builder 4.6, Flex, Flex 3.0, Flex 4, Uncategorized | Tagged: , , , , , , , , , , , , , , , , , , , , | 2 Comments »

Saving Image to File System Using Flex 4

Posted by Shardul Singh Bartwal on July 4, 2010

It is possible for us to saving any image to our computer from flex application( without any server code).Below is
the demo application.Please not that this is the feature of the flash player 10. So It will not work if your flash player is
older than flash player 10.


<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
 xmlns:s="library://ns.adobe.com/flex/spark"
 xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
 <fx:Script>
 <![CDATA[

 import mx.graphics.ImageSnapshot;
 import mx.graphics.codec.JPEGEncoder;
 private function saveImageToFileSystem():void
 {
 var jPEGEncoder:JPEGEncoder = new JPEGEncoder(500);
 var imageSnapshot:ImageSnapshot = ImageSnapshot.captureImage(imgCanvas, 0, jPEGEncoder);
 var fileReference:FileReference = new FileReference();
 fileReference.save(imageSnapshot.data, "img123.jpg");
 }
 ]]>
 </fx:Script>

<mx:VBox horizontalAlign="center" verticalAlign="middle">
<mx:Canvas id="imgCanvas">
<mx:Image source="images/image1.jpg"/>
</mx:Canvas>
 <s:Button click="saveImageToFileSystem()" label="Save Image"/>
</mx:VBox>


</s:Application>




Posted in Flex, Flex 4 | 4 Comments »

Mobile Applications in Flex

Posted by Shardul Singh Bartwal on July 4, 2010

Great news from Adobe that now we can create the web,desktop as well as the most awaited mobile applications only from the single framework.One more platform open for all the flex guys.”Hero” is the code name for this sdk.

For detail please visit:-

http://opensource.adobe.com/wiki/display/flexsdk/Hero

Please also explore for detail:-

http://download.macromedia.com/pub/labs/flex/mobile/flexmobile_whitepaper.pdf

Enjoy Flexing……..

Posted in Flex, Flex 4, Mobile Applications with Flex | Leave a Comment »

Using Image Inside the Sprite in Flex

Posted by Shardul Singh Bartwal on September 18, 2009

Using Image Inside the Sprite in Flex

If we want to add any Image inside the Sprite class in flex,then It is not possible to add image inside the sprite. But if your requirement is as such in that case you can achieve this by adding the Loader inside the sprite. Below is the code for the same.

MainApplication.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
layout="absolute" creationComplete="createSpriteWithBitmap()">
	<mx:Script>
	<![CDATA[
	import mx.controls.Image;
	private function createSpriteWithBitmap():void
	{
	var sp : SpriteWithBitmap = new SpriteWithBitmap();
	can.rawChildren.addChild( sp );
	}
	]]>
	</mx:Script>
	<mx:Canvas id="can" x="200" y="200"/>
</mx:Application>

SpriteWithBitmap

package 
{
import flash.display.Loader;
import flash.display.Sprite;
import flash.events.*;
import flash.net.URLRequest;

import mx.controls.Alert;

public class SpriteWithBitmap extends Sprite
{
	//Pass the source path or url here. 
	private var url:String = "https://shardulbartwal.files.wordpress.com/2009/09/ssbrose.jpg";

	public function SpriteWithBitmap() 
	{
		loadImg();
	}
	private function loadImg():void 
	{
		var loader:Loader = new Loader();
		loader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, loadFailure);
		var request:URLRequest = new URLRequest(url);
		loader.load(request);
		this.addChild(loader);
	}

	private function loadFailure(event:IOErrorEvent):void
	{
		Alert.show("Can't load :" + url);
	}
}

}

Enjoy Flexing………….

Posted in ActionScript 3.0, Flex, Flex 3.0 | Tagged: , , , | 4 Comments »