May, 2010

flex — 1 Comment
18
May 10

Diagonol barChart

Its not the most practical component though but for a slick “Reports UI” I had to develop a diagonal bar chart component that can be used to display a barchart 45degrees to the horizontal axis. At first i thought of solving this by using a conventional Flex Barchart but it turned out to be too much of effort in styling the barchart to look like the Screenshot, So i went ahead and wrote diagonal barChart from scratch.

Limitations :
1) Chart not re-sizable
2) Chart written with embedded font (otherwise label cant be rotated).
3) Chart cannot be configured with direction, barThickness and barGap.

Features:
1) “n” Diagonal bars can be drawn on screen : i have tested it with 1000 but 50 bars are more practical.
2) top 10 bars drawn + Others : this feature enables you to see top 10 bars with the rest of the bars clubbed into others
3)sorted/unsorted bars by value.

well do try it out and if you like the widget do let me kno.

Source here

Demo here

flex — No Comments
18
May 10

Random color generator

I am sure there were many times in the past that you would have wanted to have a function that could return you random colors. Well at least i have faced this problem many times, Mostly when i am giving a demo for a new component which deals with various color ranges.

Following is the code to generate Random colors:

1
2
3
4
5
6
7
8
9
private var redBias:Number = 0xFF;
private var greenBias:Number = 0xFF;
private var blueBias:Number = 0xFF;

private function getRandomColor():uint{
var ct:ColorTransform = new ColorTransform(1,1,1,1,Math.random()*redBias, Math.random()*greenBias, Math.random()*blueBias);
var color:uint = ct.color;
return color;
}

you can also modify the above code to return you a range in a specific color range this can be done by making any 2 colors constant instead of using a random number. Well then enjoy the code and do post in any new cool things that you can do with this piece of code.

for more know-how read the following post : ColorTransform

flex / innovation — No Comments
10
May 10

Inspectable : metatag that makes your code fool proof

If you are building a custom components which will be used by other developers <mxml> style  wont it be cool for them to see the  bindable properties in a popup selectable values (i.e. true/false) via code completion in Flex Builder. Plus it could  also to show in the Properties Panel in design view and the teammate has the ability to choose a property value.

in short making your component FOOOL proof  ;). Well then “Inspectable” is your best friend.

Usage:

1
2
[Inspectable( defaultValue=false,verbose=1, category="Other", enumeration="true,false")]
[Bindable] public var aintThisCool : Boolean;

If your like what you have read and want to learn more follow the link:Flex Metatags