Ok here is the Question to me, How to display html text for the title text of the Panel ?.

Solution:

var tfTitle:IUITextField=panel.mx_internal::getTitleTextField();
tfTitle.htmlText=”This is <B><FONT COLOR=’#FF0000′>Panel Title</FONT></B>”;

Here panel is the id of the Panel Control used. Enjoy the post.

For using the XML Class methods with an XMLList Object containing one or more XML Objects you have to iterate through the XMLList Collection and apply the XML Class methods to each XML Object in the Collection.

For example use the for each.. in statement to iterate through the XMLList Collection and access the individual XML Objects and apply the required XML Class methods to the individual XML Objects.

Example:

Suppose i have an XMLList Like below

<firstwife>

<name>Aish</name>

<age>35</age>

<dob>12/10/1974</dob>

</firstwife>

<secoundwife>

<name>Anu</name>

<age>25</age>

<dob>10/12/1984</dob>

</secoundwife>

then i would iterate this XMLList like below,

for each(var xml:XML in resultXMLList)

{

trace(“ ”+xml);//now apply XML Class methods to this XML Object.

}

[Here resultXMLList is my XMLList]

Observe the output now,it will print out the individual XML’s.Enjoy the post.

We can specify a function to format the date displayed in the text field using labelFunction property of the DateField control. Function will take date and returns the string representation of the date, and in the function we can use the DateFormatter Class to format the date to our needs.

Now to parse the entered date as text we specify a parse function using the parseFunction property of the DateField control. Function takes two arguments, entered text and the formatString and returns a date object typically performing the reverse of the label function. DateField uses a default parse function DateField.stringToDate, but we can specify a custom one. If you don’t want to edit the DateField control then simply specify null to the property.

Example:

For example to represent dates in the editable DateField control in DD MMM YY [10 Feb 09] format, we make use of lableFunction, parseFunction properties of the DateField Control.

Solution:

Using two DateFormatters

<mx:DateFormatter id=”dtf1″ formatString=”DD MMM YY”/>
<mx:DateFormatter id=”dtf2″ formatString=”DD/MM/YY”/>

//the label function

private function fnDtfLblFunct(date:Date):String
{
return dtf1.format(date);
}

//the parse function

private function fnDtfPrsFunct(valueString:String,formatString:String):Date
{
return new Date(DateField.stringToDate(dtf2.format(valueString),”DD/MM/YY”));
}

Now observe these two above functions and their input,output.

Run Demo

Download Code

Explore more on  DateField Class and DateFormatter Class and just look in to the code, You will do great, because as always told “smart developers always view source”.

Enjoy the post.

There are quiet a few ways to create and deploy your Web services,the one best way to do this is by using Apache Axis2.Its easy,simple,efficient,flexible… [feature list can be found on their official website] and cost free. 

What is Apache Axis2?

In very simple terms “It is an implementation of SOAP[Simple Object Access Protocol]“.

[For more info...]

There are two implementations of the Apache Axis2 Web services engine – Apache Axis2/Java and Apache Axis2/C.

The below figure shows the flow for Apache Axis2/Java, which i have been working on now.

It is very brief and the actuall internal flow and Architecture of the Apache Axis2 can be found on their website.

Flex framework uses WebService Class to access SOAP-based Web services on remote servers which define their interfaces in a WSDL document.As Apache Axis2 is an implementation of SOAP, acts as an intermediate layer or engine between service requester [Flex using WebService Class] and service provider.

Web services have been criticised for their complex Web structures for deployment and performance.But as these frameworks for Web services emerge with simplicity, they are no longer a concern.Soon i will come up with a post on creating and deploying Web services Using Apache Axis2/Java.

Enjoy the post.

Adobe Charts for Flex has a good set of Components from which we can make attractive pictorial representations of Data.
But let me tell they dont satify the very good needs of the funtional requirements like we have.Like if i want to draw a Graph in Flex using the Adobe Charts for Flex then i would end up like “can i do that ??”,since i dont have much time on R&D i googled and found one interesting kit called birdeye.

What is birdeye?
open source information visualization and visual analytics library for Adobe Flex.
[For more info...]

They have few cool kits.I used one of the kit[Relational Analysis] and made a Graph according to the need in to my live project.Thanks to the team behind birdeye.

Run Demo

Its the Binomial Tree Distribution which represents the Option Pricing[Finance concept].

Enjoy the post.

When you come across a Class and explore it, you should be really concentrating on the very basics of that Class first.So here I am talking about the Date Class.You can create Date Objects in four different ways.So explore about that, then you should be able to answer this question How to find the number of days betweeen two Date’s in Flex ?

Solution:

private const MS_PER_DAY:uint = 1000 * 60 * 60 * 24;

var strd1:Date=new Date(2009,2,18);
var strd2:Date=new Date(2009,2+1,18);
var tempDate:Date = new Date(strd2.time – strd1.time);

trace(’No. of Days:’+tempDate.time/MS_PER_DAY);

Enjoy the post.

As some readers requested a demo on this post, so I am giving it here.Enjoy the post.

Run Demo

Comment me for query.

One of the readers asked this question, Is it possible to show ToolTips for the Combobox List items [on mouse over on each item i would like to show a ToolTip]?, and my answer was “YES”.And this post tells about that.

The First thing we got to remember here is the ToolTipManager Class and its methods.Basic information on how to create tooltips using this Class.

The ToolTipManager has two methods that let you programmatically use ToolTips. These methods are createToolTip() and destroyToolTip(), which you use to create and destroy new ToolTip objects. When you create a ToolTip object, you can customize it as you would any object, with access to its properties, styles, events, and effects.

[So explore more about this ToolTipManager Class to learn more], now we know how to create ToolTips using this Class, but how to show on the Combobox List items ?.Its simple using the ListEvent Class and on ListEvent.ITEM_ROLL_OVER raise an Event and write your code on the eventhandler to create tooltip.Check on the below code sample for this.And destroy the created tooltip on ListEvent.ITEM_ROLL_OUT.Isn’t that simple.

Run demo.

1.Download source code. –> This is with the itemRollOver,itemRollOut properties.

2.Download source code. –> This is with the addEventListener().

Enjoy the post.

The list based controls in Flex has the built in support for the drag and drop.So to support the drag and drop operations for the non-list based components(here TextInput) we must handle the drag and drop events.
Go through the classes involded in the drag and drop operations,drag and drop events for a drag initiator,drag and drop events for a drop target to explicitly handle the drag and drop and to fully understand the drag and drop operations functionality.

For now enjoy the below demo and code.

 Run demo.

Download source code.

To Access the multiple selected items in a Tree control we got to enable the multiple selection in the Tree control like below.

allowMultipleSelection=”true”

Then we can access the selectedItems of the Tree control with the property “selectedItems” like below code.

for(var i:int=0;i<tree.selectedItems.length;i++)
{
trace(tree.selectedItems[i].@NAME);
}

Here tree is the id of the Tree control and NAME is the attribute name of the dataProvider of the Tree control.Check the code for clearance.

Run Demo App.

Download Code Example.

Check out this Calculator.Its not a Big or Major Application but a simple one which does the Binary Arthimatic Calculations.

Run Demo.

Follow the Below instruction and Examples to start.

[Click Buttons to Calculate]
Example 1:On Enter 100 Press AND Button then on Enter 011 Press the == Button Gives the Result as 000.
Example 2:On Enter 100 Press OR Button then on Enter 011 Press the == Button Gives the Result as 111.
After the each Result Press the Clear Button.

Its so Basic which depends on the Logical Thinking.
I don’t know if this is already done in Flex or not but Enjoy mine.Leave any Comments if found any Bugs.:-)

Enjoy the post.

Happy New Year 2009. OK I am not good at writing quotes so here’s the image.

happy new year 2009

Note : This post is not related to Flex or any Technology just best wishes for the new year ahead.Enjoy yourself and let others too enjoy.:-)

First i must tell that using the Form and its children components like the FormItem,FormHeader are very use full as they touch our requirement in all means, like they control the layout,validating the fields,mark/unmark fields.. and many more.So while working on i came across a requirement to mark my Label as a symbol of Compulsory Field[a RED asterisk] for the TextInputs next to it,more or like the indicator in the FormItem which is a child component of the Form Container. So i thought of using the FormItem itself but its not possible, its only a child component in the Form Container, means i cannot individually use that.I just want a Label With the Indication as Compulsory field[asterisk].So how to achieve this ??.

My second thought was to search the WEB ,may be some one might had the same requirement and done a Custom Component for it. But believe me i found nothing and nothing.

Then my Third thought was to make one. I Called It “Indicator Label” or ILabel.

So i created one , it came out very clean and as i required and its very much similar to the FormItem which is a sub-Class of Container Class and my ILabel is just sub-Class of the Label Class. There is much difference between the Container and the Label.

Description:

It has the following properties with Label Component Properties:

indicatorSkin –>refers to the skin used for the indication, Programmatic Skin or Graphical Skin.

indicatorGap–>refers to the Gap between the indicator and the Label text.

required–>indicator is required or not.default value true.

requiredChanged–>Event for the required property value change.

That’s my requirement.Just a Label with all these properties.Finally made it.

Now just sit back and enjoy this example.

Run demo.

Enjoy the Post. , Leave any Comments for queries.

Before going through explore the basic concepts about them.,few lines from the  Flex Builder help are below.

Repeater components are useful for repeating a small set of simple user interface components, such as RadioButton controls and other controls typically used in Form containers. Repetition is generally controlled by an array of dynamic data, such as an Array object returned from a web service, but you can use static arrays to emulate simple for loops.

Ok now you got a little info about them I will show you one example and let’s work with them.

Here I am using a TextArea component in the Repeater and reading the dataProvider for the Repeater from the HttpService. To manipulate the Repeater and its components it’s better to provide an ArrayCollection to the Repeater as dataProvider and its bindable will reflect the changes made.

Hence I will use an HttpService to read the data in to the ArrayCollection from an XML file and provide this to the Repeater Component as the dataProvider. As the below lines shows us.

<mx:HTTPService id=”srvMain” url=”data.xml” useProxy=”false” result=”readRes(event)”
showBusyCursor=”true” />

<mx:VBox verticalAlign=”middle” horizontalAlign=”center”>
<mx:Repeater id=”rpt” dataProvider=”{arrCll}”>
<mx:TextArea id=”txta” text=”{rpt.currentItem.NAME}”/>
</mx:Repeater>
</mx:VBox>

And my script block contains the code to read my dataProvider in to an ArrayCollection and this goes in to the result of the HttpService.

This will repeat the TextArea components based on the dataProvider to the Repeater.

And observe the line I am using for assigning the text to the TextArea component from the dataProvider.

text=”{rpt.currentItem.NAME}”

Similarly we can use any component in the Repeater component. And they are very use full in large Applications where in you want many similar components in series, for example in a Login/signup form I may need the user to fill in multiple TextInput’s, a few of them is ok just use the individual components ,but what if there are many TextInputs the user needs to fill in and this screen/view is created at runtime which in turn reduces the Application size , because the components are not created at compile time they are laid out at runtime [That is it's just a separate view and loaded when necessary].

Now let’s just stay back and enjoy this Example.

Run the Demo.

Download the source Code.

As you can see the components are created at Runtime using the Repeater component.This is the charm of the Repeater Component,Enjoy the post.

Here I will give you a tip on when to use Move Effect and Resize Effect.

Move Effect :

When you move [as the name specifies] your control in position you got to use this effect. Like if you alter the co-ordinates [x,y], then to smoothen this movement you can use this Move Effect.

Resize Effect:

When you resize [as the name specifies] your control in dimensions you got to use this effect. Like if you alter the dimensions [width,height] of a control, then to smoothen this movement you can use this Resize Effect.

Hope this helps some one out there. Enjoy the Post.