Flex Video Tutorials – Adding visual appeal

In Flex Video Series – Flex In Week

Part 4 has been added as Day 4: Adding visual appeal

I covers some good topics too,

Enjoy Flexing . . . 🙂

Mayur Rami


Close PopUps, TitleWindow, Panel etc by clicking the modal in Flex

I got one query, how to close Popups ( TitleWindow, Panel etc. ) just by clicking on Modal.

A functionality which we found in HTML / Javascript based modal (with lightbox ), some thing we can see now a days in Yahoo Mails, when we see images attached in our mails.

See, Modal is actually a FlexSprite instance in Flex frame work (same as well for AIR ). The Modal is created by SystemManager in Flex.

So, if we want to just close ( or to perform any business logic ), it is very easy, just listen for an Event.

The event is : ‘ mouseDownOutside ‘ .
A simple example is as below…
There are two files : 1) ModalTitleWindow.mxml 2) ModalClose.mxml

Continue reading

Flex and Actionscript 3 coding conventions

It is nice to have a standardization on any product. Same rule applies to softwares also.

Recently, Adobe has given a Coding convention guide line.

Go and check at Flex SDK coding conventions and best practices.

From the perspectives of a software developer it is even better to work with such kind of standards, especially when we are working in team and that to also in a ” on shore – off shore ” fashion.

One request to Flex team at Adobe once this document gets fully complete, please, release its PDF version too.

Happy Flexing. 🙂

Mayur Rami

Alert and Popup modal, transparancy, color and blur changes

Today, I am going to post some thing on Popup custom settings. We can change some properties like Popup modal, transparency, color and Blur.

These properties are of style. This has been a very long avaited request from my designer friends. (especially by : Mandu)

In flex ‘<Application />’ tag has mainly four attributes related to modal properties of pop-ups.

  1. modalTransparency
  2. modalTransparencyBlur
  3. modalTransparencyColor
  4. modalTransparencyDuration

Their default values are “0.5”, “3”, “0xDDDDDD” and “100” respectively. Changes to these properties are applicable to entire application level.

But, we can do same changes to separate components too. ( As I have shown in my example.)

Let me show… in image (1) We can see the default Alert / Popup window of flex

Noraml flex alert / popup customized Flex popup / alert

Continue reading

Flex & AIR – DragManager & NativeDragManager

While playing / exploring  to some new features of Flex 3 and AIR, I found one difference about DragManagers.

In AIR – API  a new ‘ NativeDragManager ‘ has been included.

If you have made your AIR application with <mx:WindowedApplication> tag it would be using ‘ NativeDragManager ‘ in place of old Flex’s   ‘ DragManager ‘. Same way if your AIR application made with <mx:Application> tag then it would be using ‘ DragManager ‘.

The NavtiveDragManager facilitates and allows an AIR Applications to be able to drag items inside and outside of AIR Windows automatically.

And there is a difference can also be noticed of using the NativeDragManager by their respective cursors.  If you are using NativeDragManager, when you drag an item over a target which is invalid, the system shows an icon with a black circle with lines.  And if you are using DragManager, when an item dragged over an invalid target, system shows a red circle with ‘ x ‘ mark on it.

And event are changed, too.

Arial chart – Chart over a Chart


Today, I am going to post something different. We all know about RIA s. Even we all try very hard to make our project very user friendly and rich.

I am sharing my one experience. In my one project, there was a need arise that our client needs to show data in a some main head and under that he needs to show some other data, too. Like some thing tree type data to show in Charts ❓

Roll Over Chart

( e.g. : Main head is : Expense in that three Sub heads Revenue, Interest, Discount )

  1. Expense
  • Revenue
  • Interest
  • Discount

Continue reading

Flex 2 : DataGrid Color operations – II

I am continuing in this post about Color Operations with DataGrid in Flex 2. This post also I am giving on one of my friends.

In this post, I am going to show something regarding to the customize color of a particular row in DataGrid. ( e.g. Color of a Total row in DataGrid )

Output is something like :

Total Row Color

Continue reading