Crossdomain.xml – Flex

When accessing the web services in Flex you need a crossdomain.xml file in the root of the web server which hosts the web service. In the file you can mention whether to accept the connections from all the domains or the connections from the specific domains to be accepted.

Here the sample for a crossdomain.xml file which allows the access from all the domains.

   1: <?xml version="1.0" ?>

   2: <cross-domain-policy>

   3:    <allow-access-from domain="*" secure="false" />

   4:    <site-control permitted-cross-domain-policies="all"/>

   5:    <allow-http-request-headers-from domain="*" headers="*"/>

   6: </cross-domain-policy>

For .NET guys, this is the exact similar version of the clientaccesspolicy.xml file we deploy in the root of the web server when working with Silverlight.

Creating a custom formatted DataGrid in Flex

This post explains how to create or at least begin to create a custom formatted DataGrid in Flex. I used the spark DataGrid for this sample. Two format settings are applied here; first is formatting the numbers as comma separated groups and format the color based on the value and second formatting the DataGrid column headers.

We have to write ItemRenderers for the above purposes. Flash Builder provides ItemRenderer template for Spark DataGrid. Just right click on your project folder and in the ‘New’ items list you will get an option for ItemRenderer and when you select it you will be asked for the option for which control you need to create the ItemRenderer for, Spark DataGrid is there on the top of the list.In the template you can add and edit required styling elements.

The Grid has a two columns Name and Score respectively. Name column is simple and displays the data and the Score column’s header is formatted in red color. Writing a HeaderRenderer for the Spark DataGrid is tricky; we’ve to write the HeaderRenderer and the correct Skin file to make it work properly. And also this column displays the positive values in black (default color) and the negative values in red color.

Download the source code here

image

Accessing a WCF – SOAP service from Flex

Flex development for a .NET guy

I’ve been working on Flex for last couple weeks using Flash Builder 4.7. I touched the second Adobe product in my life first is Dreamweaver, not Photoshop. I know that’s quite surprising but the truth is I haven’t used Photoshop yet and I don’t even know how to use it.

Leaving my history aside; I started Flex and soon I had to create some complex controls for the project. I did them and now I think I do fairly good. I write this post in order to help the newbies like me who jump into Flex development without any clue and for my personal reference.

As a developer you can put some basic controls and do simple development. You can find plenty of beginners tutorials for Flex. This post  explains how to make a web service call from Flex and access data.

Flex make it very simple to connect to a SOAP based services.

   1: <?xml version="1.0" encoding="utf-8"?>

   2: <s:Application     xmlns:fx="http://ns.adobe.com/mxml/2009" 

   3:                    xmlns:mx="library://ns.adobe.com/flex/mx" 

   4:                    xmlns:s="library://ns.adobe.com/flex/spark"

   5:                    creationComplete="application_creationCompleteHandler(event)">

   6:     <fx:Script>

   7:         <![CDATA[

   8:             

   9:             private var serverServiceUrl:String = "http://localhost/yourservice.svc?wsdl";

  10:             

  11:             [Bindable]

  12:             private var prodSAH:Object;

  13:             

  14:             protected function application_creationCompleteHandler(event:FlexEvent):void

  15:             {

  16:                 productionService.GetProductionData("SAH","","","Month To Date");

  17:             }    

  18:             

  19:             

  20:             protected function productionService_resultHandler(event:ResultEvent):void

  21:             {

  22:                 prodSAH = event.result as Object;

  23:  

  24:                 Alert.show(prodSAH.CompanyName);

  25:             }

  26:             

  27:             

  28:                    

  29:         ]]>

  30:     </fx:Script>

  31:     

  32:         

  33:     <fx:Declarations> 

  34:         

  35:         <s:WebService id="productionService" wsdl="{serverServiceUrl}" result="productionService_resultHandler(event)">

  36:         </s:WebService>

  37:             

  38:     </fx:Declarations>

  39:     

  40:     

  41:     

  42:     

In the code above [Bindable] attribute makes the variables responsively coupled with the controls, if you’re from Silverlight background you can understand this as a INotifyPropertyChanged interface implemented variables. Any change to those variables would reflect in the UI.

“Declarations” section contains the declarations of the MXML application, web service reference sits here. GetProductionData is one OperationContract of the WCF service and it returns a Production object as SOAP message. Production object contains several properties, here I have shown how to access the properties. It is simple, just put a dot(.) and type the property name (in this case CompanyName). But when you put the dot don’t expect Intellisense to be popped out and give you suggestions. It will never happen, so be careful about the spelling.

If you’re getting a collection from the service you can simply load it into a ArrayCollection in Flex.

I haven’t included any UI controls in this sample, but they’re straight forward as XAML markup (probably MXML came first).

Flash Builder IDE

This section discusses about the Flash Builder as an IDE.

In my Boolean world if some one asks me how do I rate Flash Builder as an IDE either god or bad it’s definitely bad.

I use Flash Builder 4.7. As an IDE it has plenty of glitches and personally for me as a person who spend entire work time with VS this is a direct kick on my midriff as a new developer for Flex. The IDE continuously eats up your heap. There’s an option that you can enable to view the heap size of the IDE. In my 4GB work station my OS allocates 740 ~ 760 Mb for Flash Builder. But after few builds during development the entire heap is full and IDE stops responding and goes dead slow. I often have to restart the IDE in order to work in my pace. I checked with other developers as well, same story.

And mainly there’s a disastrous problem there’s no design view. Believe it of course no design view. I got to know that they removed the design view from this version onwards. 

When you create a project Flash Builder creates a default MXML application in the name of the project. One project can contain multiple MXML applications. But if you delete the MXML file in the name of the project you cannot export any other MXML files. This is really a stupid and senseless bug.

As a VS lazy guy Intellisense is the god of development, in Flash Builder it’s there for the sake. Almost all the time I have to bring it up after putting a dot using Ctrl + Space. There’s a hell lots of improvements needed for Flash Builder as an IDE.